diff --git a/platform/commonUI/browse/res/templates/back-arrow.html b/platform/commonUI/browse/res/templates/back-arrow.html
index 15775fb632..c73b4cbdb2 100644
--- a/platform/commonUI/browse/res/templates/back-arrow.html
+++ b/platform/commonUI/browse/res/templates/back-arrow.html
@@ -21,8 +21,8 @@
 -->
 
 <!-- Back Arrow Icon used on mobile-->
-<span ng-controller="BrowseController"
+<a ng-controller="BrowseController"
+      class='type-icon icon ui-symbol s-back'
       ng-click='backArrow()'
-      ng-class="checkRoot(); atRoot ? 'mobile-back-hide' : 'mobile-back-unhide'">
-    <a class='type-icon icon ui-symbol'>{</a>
-</span>
+      ng-class="checkRoot(); atRoot ? 'hidden' : ''">{
+</a>
diff --git a/platform/commonUI/browse/res/templates/browse-object.html b/platform/commonUI/browse/res/templates/browse-object.html
index 1f69f45b0a..80bb313d22 100644
--- a/platform/commonUI/browse/res/templates/browse-object.html
+++ b/platform/commonUI/browse/res/templates/browse-object.html
@@ -20,22 +20,23 @@
  at runtime from the About dialog for additional information.
 -->
 <span ng-controller="BrowseObjectController">
-    <div class="object-browse-bar bar abs">
-        <div class="items-select left abs">
+    <div class="object-browse-bar bar l-flex">
+        <div class="items-select left">
+            <mct-representation key="'back-arrow'" class="l-back"></mct-representation>
             <mct-representation key="'object-header'" mct-object="domainObject">
             </mct-representation>
         </div>
-        <!-- Temporarily, on mobile, the button bar is hidden-->
-        <div class="btn-bar right abs mobile-hide">
-            <mct-representation key="'action-group'"
-                                mct-object="domainObject"
-                                parameters="{ category: 'view-control' }">
-            </mct-representation>
-
+        <div class="btn-bar right">
             <mct-representation key="'switcher'"
                                 mct-object="domainObject"
                                 ng-model="representation">
             </mct-representation>
+            <!-- Temporarily, on mobile, the action buttons are hidden-->
+            <mct-representation key="'action-group'"
+                                mct-object="domainObject"
+                                parameters="{ category: 'view-control' }"
+                                class="mobile-hide">
+            </mct-representation>
         </div>
     </div>
 
diff --git a/platform/commonUI/browse/res/templates/browse.html b/platform/commonUI/browse/res/templates/browse.html
index c9fd7d317c..6e6db9d1a4 100644
--- a/platform/commonUI/browse/res/templates/browse.html
+++ b/platform/commonUI/browse/res/templates/browse.html
@@ -20,23 +20,21 @@
  at runtime from the About dialog for additional information.
 -->
 
-<div content="jquery-wrapper" class="abs holder-all browse-mode" ng-controller="BrowseController">
+<div class="abs holder-all browse-mode" ng-controller="BrowseController">
     <mct-include key="'topbar-browse'"></mct-include>
     <div class="holder browse-area s-browse-area abs browse-wrapper" ng-class="treeClass ? 'browse-showtree' : 'browse-hidetree'">
         <mct-split-pane class='contents abs' anchor='left'>
-            <div
-                class='split-pane-component treeview pane mobile-pane left-menu desktop-browse'
-                >
+            <div class='split-pane-component treeview pane left'>
                 <mct-representation key="'create-button'" mct-object="navigatedObject">
                 </mct-representation>
-                <div class='holder search-holder abs'
+                <div class='holder search-holder abs l-mobile'
                      ng-class="{active: treeModel.search}">
                     <mct-representation key="'search'"
                                  mct-object="domainObject"
                                  ng-model="treeModel">
                     </mct-representation>
                 </div>
-                <div class='holder tree-holder abs mobile-tree-holder'
+                <div class='tree-holder abs mobile-tree-holder'
                      ng-hide="treeModel.search">
                     <mct-representation key="'tree'"
                                         mct-object="domainObject"
@@ -46,14 +44,14 @@
             </div>
 
             <mct-splitter class="mobile-hide"></mct-splitter>
-                    <div class='split-pane-component items pane mobile-pane right-repr'>
-                        <div class='holder abs' id='content-area'>
-                            <mct-representation mct-object="navigatedObject" key="'browse-object'">
-                            </mct-representation>
-                        </div>
-                    <div class="left s-very-subtle key-properties ui-symbol mobile-menu-icon button-pos" 
-                        ng-click="treeSlide()">m</div>                        
-                    </div>   
+
+            <div class='split-pane-component items pane right-repr'>
+                <div class='holder abs l-mobile' id='content-area'>
+                    <mct-representation mct-object="navigatedObject" key="'browse-object'">
+                    </mct-representation>
+                </div>
+                <div class="key-properties ui-symbol icon mobile-menu-icon desktop-hide" ng-click="treeSlide()">m</div>
+            </div>
         </mct-split-pane>
     </div>
     <mct-include key="'bottombar'"></mct-include>
diff --git a/platform/commonUI/browse/res/templates/browse/object-header.html b/platform/commonUI/browse/res/templates/browse/object-header.html
index 84cc087bbc..a9652631d9 100644
--- a/platform/commonUI/browse/res/templates/browse/object-header.html
+++ b/platform/commonUI/browse/res/templates/browse/object-header.html
@@ -20,11 +20,10 @@
  at runtime from the About dialog for additional information.
 -->
 <div class='object-header object-header-mobile'>
-    <span class="label s-label">
-        <mct-representation class="desktop-hide" key="'back-arrow'"></mct-representation>
-        <span class='type-icon icon ui-symbol'>{{type.getGlyph()}}</span>
+    <span class='type-icon ui-symbol'>{{type.getGlyph()}}</span>
+    <!--span class='type-name mobile-important-hide'>{{type.getName()}}</span-->
+    <span class="l-elem-wrapper">
         <span ng-if="parameters.mode" class='action'>{{parameters.mode}}</span>
-        <span class='type-name mobile-important-hide'>{{type.getName()}}</span>
         <span class='title-label'>{{model.name}}</span>
         <mct-representation key="'menu-arrow'" mct-object='domainObject'></mct-representation>
     </span>
diff --git a/platform/commonUI/browse/res/templates/items/grid-item.html b/platform/commonUI/browse/res/templates/items/grid-item.html
index d27d088ee1..647d8e26da 100644
--- a/platform/commonUI/browse/res/templates/items/grid-item.html
+++ b/platform/commonUI/browse/res/templates/items/grid-item.html
@@ -20,37 +20,30 @@
  at runtime from the About dialog for additional information.
 -->
 <!-- For selected, add class 'selected' to outer div -->
-<div class='item grid-item'>
-    <div class="contents abs mobile-grid-nav" ng-click='action.perform("navigate")'>
+<div class='item grid-item' ng-click='action.perform("navigate")'>
+    <div class='contents abs'>
         <div class='top-bar bar abs'>
-            <div class='left abs'>
-                <mct-include key="_checkbox"></mct-include>
-            </div>
-            <div class='right abs mobile-right'>
-                <div class='ui-symbol icon alert hidden' onclick="alert('Not yet functional. When this is visible, it means that this object needs to be updated. Clicking will allow that action via a dialog.');">!</div>
-                <div class='ui-symbol icon profile' title="Shared">P</div>
-            </div>
+            <div class='ui-symbol profile' title='Shared'>&#x4f;</div>
+            <mct-representation class="desktop-hide" key="'info-button'" mct-object="domainObject"></mct-representation>
         </div>
         <div class='item-main abs'>
             <div class='ui-symbol icon lg item-type'>
                 {{type.getGlyph()}}
                 <span
-                    class="ui-symbol icon l-icon-link" title="This object is a link"
+                    class="ui-symbol l-icon-link" title="This object is a link"
                     ng-show="location.isLink()"
                     ></span>
             </div>
-            <div class='ui-symbol icon abs item-open'>}</div>
+            <div class='ui-symbol abs item-open'>}</div>
         </div>
         <div class='bottom-bar bar abs'>
             <div class='title'>{{model.name}}</div>
             <div class='details'>
+                <span>{{type.getName()}}</span>
                 <span ng-show="model.composition !== undefined">
-                    {{model.composition.length}} Items
+                    - {{model.composition.length}} Item<span ng-show="model.composition.length > 1">s</span>
                 </span>
             </div>
         </div>
     </div>
-    <div class="contents abs mobile-info desktop-hide">
-        <mct-representation class="contents abs btn s-very-subtle desktop-hide" key="'info-button'" mct-object="domainObject"></mct-representation>
-    </div>
 </div>
diff --git a/platform/commonUI/dialog/res/templates/dialog.html b/platform/commonUI/dialog/res/templates/dialog.html
index 661ea36ff5..1bea0290e7 100644
--- a/platform/commonUI/dialog/res/templates/dialog.html
+++ b/platform/commonUI/dialog/res/templates/dialog.html
@@ -25,7 +25,7 @@
         All fields marked <span class="ui-symbol req">*</span> are required.
     </div>
 </div>
-<div class="abs form outline editor">
+<div class="abs form editor">
     <div class='abs contents l-dialog'>
         <mct-form ng-model="ngModel.value"
                   structure="ngModel.structure"
diff --git a/platform/commonUI/dialog/res/templates/overlay.html b/platform/commonUI/dialog/res/templates/overlay.html
index 2718f9d74d..df8bd9c160 100644
--- a/platform/commonUI/dialog/res/templates/overlay.html
+++ b/platform/commonUI/dialog/res/templates/overlay.html
@@ -25,7 +25,7 @@
         <a href=""
            ng-click="ngModel.cancel()"
            ng-if="ngModel.cancel"
-           class="btn normal ui-symbol close">
+           class="clk-icon icon ui-symbol close">
             x
         </a>
         <div class="abs contents" ng-transclude>
diff --git a/platform/commonUI/general/res/css/forms.css b/platform/commonUI/general/res/css/forms.css
index 7b9fa40b87..a9ce755177 100644
--- a/platform/commonUI/general/res/css/forms.css
+++ b/platform/commonUI/general/res/css/forms.css
@@ -69,6 +69,7 @@
  * this source code distribution or the Licensing information page available
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
+/************************** STYLE */
 /************************** MOBILE REPRESENTATION ITEMS DIMENSIONS */
 /************************** MOBILE TREE MENU DIMENSIONS */
 /************************** WINDOW DIMENSIONS FOR RWD */
@@ -171,35 +172,34 @@
  *****************************************************************************/
 /* line 22, ../sass/forms/_elems.scss */
 .section-header {
-  -moz-border-radius: 3px;
-  -webkit-border-radius: 3px;
-  border-radius: 3px;
+  -moz-border-radius: 2px;
+  -webkit-border-radius: 2px;
+  border-radius: 2px;
   background: rgba(255, 255, 255, 0.1);
+  color: #cccccc;
   font-size: 0.8em;
-  margin-top: 5px;
-  padding: 5px; }
-  /* line 28, ../sass/forms/_elems.scss */
-  .section-header:first-child {
-    margin-top: 0; }
+  padding: 5px 5px;
+  text-transform: uppercase; }
 
 /* line 35, ../sass/forms/_elems.scss */
 .form .form-section {
-  position: relative; }
-/* line 39, ../sass/forms/_elems.scss */
+  position: relative;
+  margin-bottom: 20px; }
+/* line 40, ../sass/forms/_elems.scss */
 .form .form-row {
   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
   overflow: hidden;
   *zoom: 1;
-  border-top: 1px solid #4d4d4d;
+  border-top: 1px solid rgba(255, 255, 255, 0.1);
   margin-top: 5px;
-  padding: 5px;
+  padding: 5px 5px;
   position: relative; }
-  /* line 46, ../sass/forms/_elems.scss */
+  /* line 48, ../sass/forms/_elems.scss */
   .form .form-row.first {
     border-top: none; }
-  /* line 50, ../sass/forms/_elems.scss */
+  /* line 52, ../sass/forms/_elems.scss */
   .form .form-row .label,
   .form .form-row .controls {
     -moz-box-sizing: border-box;
@@ -207,45 +207,45 @@
     box-sizing: border-box;
     overflow: hidden;
     *zoom: 1;
-    box-sizing: border-box;
-    font-size: 0.75rem;
+    font-size: 0.8rem;
     line-height: 22px;
     min-height: 22px; }
   /* line 61, ../sass/forms/_elems.scss */
   .form .form-row > .label {
     float: left;
+    min-width: 120px;
     position: relative;
     white-space: nowrap;
-    width: 20%; }
-  /* line 69, ../sass/forms/_elems.scss */
+    width: 30%; }
+  /* line 71, ../sass/forms/_elems.scss */
   .form .form-row .value {
     color: #cccccc; }
-  /* line 73, ../sass/forms/_elems.scss */
+  /* line 75, ../sass/forms/_elems.scss */
   .form .form-row .controls {
     float: left;
     position: relative;
-    width: 79.9%; }
-    /* line 80, ../sass/forms/_elems.scss */
+    width: 69.9%; }
+    /* line 82, ../sass/forms/_elems.scss */
     .form .form-row .controls .l-composite-control.l-checkbox {
       display: inline-block;
       line-height: 14px;
       margin-right: 5px; }
-    /* line 89, ../sass/forms/_elems.scss */
+    /* line 91, ../sass/forms/_elems.scss */
     .form .form-row .controls .l-med input[type="text"] {
       width: 200px; }
-    /* line 93, ../sass/forms/_elems.scss */
+    /* line 95, ../sass/forms/_elems.scss */
     .form .form-row .controls .l-small input[type="text"] {
       width: 50px; }
-    /* line 97, ../sass/forms/_elems.scss */
+    /* line 99, ../sass/forms/_elems.scss */
     .form .form-row .controls .l-numeric input[type="text"] {
       text-align: right; }
-    /* line 101, ../sass/forms/_elems.scss */
+    /* line 103, ../sass/forms/_elems.scss */
     .form .form-row .controls .select {
       margin-right: 5px; }
-  /* line 106, ../sass/forms/_elems.scss */
+  /* line 108, ../sass/forms/_elems.scss */
   .form .form-row .field-hints {
     color: #666666; }
-  /* line 110, ../sass/forms/_elems.scss */
+  /* line 112, ../sass/forms/_elems.scss */
   .form .form-row .selector-list {
     -moz-border-radius: 2px;
     -webkit-border-radius: 2px;
@@ -258,7 +258,7 @@
     position: relative;
     height: 150px;
     overflow: auto; }
-    /* line 121, ../sass/forms/_elems.scss */
+    /* line 123, ../sass/forms/_elems.scss */
     .form .form-row .selector-list .wrapper {
       overflow-y: auto;
       position: absolute;
@@ -267,24 +267,24 @@
       bottom: 5px;
       left: 5px; }
 
-/* line 135, ../sass/forms/_elems.scss */
+/* line 137, ../sass/forms/_elems.scss */
 label.form-control.checkbox input {
   margin-right: 5px;
   vertical-align: top; }
 
-/* line 141, ../sass/forms/_elems.scss */
+/* line 143, ../sass/forms/_elems.scss */
 .hint,
 .s-hint {
   font-size: 0.9em; }
 
-/* line 146, ../sass/forms/_elems.scss */
+/* line 148, ../sass/forms/_elems.scss */
 .l-result {
   display: inline-block;
   min-width: 32px;
   min-height: 32px;
   position: relative;
   vertical-align: top; }
-  /* line 153, ../sass/forms/_elems.scss */
+  /* line 155, ../sass/forms/_elems.scss */
   .l-result div.s-hint {
     -moz-border-radius: 2px;
     -webkit-border-radius: 2px;
@@ -433,7 +433,7 @@ input[type="text"] {
   margin: 0 0 2px 2px;
   overflow: hidden;
   position: relative; }
-  /* line 163, ../sass/_mixins.scss */
+  /* line 167, ../sass/_mixins.scss */
   .form-control.select:not(.disabled):hover {
     background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzYzNjM2MyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU3NTc1NyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
     background-size: 100%;
@@ -442,10 +442,10 @@ input[type="text"] {
     background-image: -webkit-linear-gradient(#636363, #575757);
     background-image: linear-gradient(#636363, #575757);
     color: #bdbdbd; }
-    /* line 166, ../sass/_mixins.scss */
+    /* line 170, ../sass/_mixins.scss */
     .form-control.select:not(.disabled):hover.btn-menu .invoke-menu {
       color: #878787; }
-  /* line 171, ../sass/_mixins.scss */
+  /* line 175, ../sass/_mixins.scss */
   .form-control.select.btn-menu .invoke-menu {
     color: #757575; }
   /* line 29, ../sass/forms/_selects.scss */
diff --git a/platform/commonUI/general/res/css/items.css b/platform/commonUI/general/res/css/items.css
index 620ed931bc..0c29bd9ebb 100644
--- a/platform/commonUI/general/res/css/items.css
+++ b/platform/commonUI/general/res/css/items.css
@@ -69,6 +69,7 @@
  * this source code distribution or the Licensing information page available
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
+/************************** STYLE */
 /************************** MOBILE REPRESENTATION ITEMS DIMENSIONS */
 /************************** MOBILE TREE MENU DIMENSIONS */
 /************************** WINDOW DIMENSIONS FOR RWD */
@@ -185,7 +186,7 @@
     margin-bottom: 3px;
     margin-right: 3px;
     position: relative; }
-    /* line 163, ../sass/_mixins.scss */
+    /* line 167, ../sass/_mixins.scss */
     .items-holder .item.grid-item:not(.disabled):hover {
       background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzcwNzA3MCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzYzNjM2MyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
       background-size: 100%;
@@ -194,15 +195,15 @@
       background-image: -webkit-linear-gradient(#707070, #636363);
       background-image: linear-gradient(#707070, #636363);
       color: #bdbdbd; }
-      /* line 166, ../sass/_mixins.scss */
+      /* line 170, ../sass/_mixins.scss */
       .items-holder .item.grid-item:not(.disabled):hover.btn-menu .invoke-menu {
         color: #949494; }
-    /* line 171, ../sass/_mixins.scss */
+    /* line 175, ../sass/_mixins.scss */
     .items-holder .item.grid-item.btn-menu .invoke-menu {
       color: #828282; }
     /* line 46, ../sass/items/_item.scss */
     .items-holder .item.grid-item:hover .item-main .item-type {
-      color: #0099cc !important; }
+      color: deepskyblue !important; }
       /* line 48, ../sass/items/_item.scss */
       .items-holder .item.grid-item:hover .item-main .item-type .l-icon-link {
         color: #49dedb; }
@@ -211,35 +212,35 @@
       opacity: 1; }
     /* line 57, ../sass/items/_item.scss */
     .items-holder .item.grid-item .contents {
-      top: 5px;
-      right: 5px;
-      bottom: 5px;
-      left: 5px; }
-    /* line 61, ../sass/items/_item.scss */
-    .items-holder .item.grid-item .bar.top-bar.abs {
+      top: 10px;
+      right: 10px;
+      bottom: 10px;
+      left: 10px; }
+    /* line 63, ../sass/items/_item.scss */
+    .items-holder .item.grid-item .bar.top-bar {
       bottom: auto;
       height: 20px;
       line-height: 20px;
+      text-align: right;
       z-index: 5; }
-      /* line 66, ../sass/items/_item.scss */
-      .items-holder .item.grid-item .bar.top-bar.abs .left, .items-holder .item.grid-item .bar.top-bar.abs .right {
+      /* line 69, ../sass/items/_item.scss */
+      .items-holder .item.grid-item .bar.top-bar .left, .items-holder .item.grid-item .bar.top-bar .right {
         width: auto; }
-        /* line 68, ../sass/items/_item.scss */
-        .items-holder .item.grid-item .bar.top-bar.abs .left .icon, .items-holder .item.grid-item .bar.top-bar.abs .right .icon {
+        /* line 71, ../sass/items/_item.scss */
+        .items-holder .item.grid-item .bar.top-bar .left .icon, .items-holder .item.grid-item .bar.top-bar .right .icon {
           margin-left: 3px; }
-          /* line 70, ../sass/items/_item.scss */
-          .items-holder .item.grid-item .bar.top-bar.abs .left .icon.l-icon-link, .items-holder .item.grid-item .bar.top-bar.abs .right .icon.l-icon-link {
+          /* line 73, ../sass/items/_item.scss */
+          .items-holder .item.grid-item .bar.top-bar .left .icon.l-icon-link, .items-holder .item.grid-item .bar.top-bar .right .icon.l-icon-link {
             color: #49dedb; }
-    /* line 76, ../sass/items/_item.scss */
-    .items-holder .item.grid-item .bar.bottom-bar.abs {
+    /* line 79, ../sass/items/_item.scss */
+    .items-holder .item.grid-item .bar.bottom-bar {
       top: auto;
-      height: 30px;
-      padding: 5px; }
-    /* line 82, ../sass/items/_item.scss */
+      line-height: 110%; }
+    /* line 85, ../sass/items/_item.scss */
     .items-holder .item.grid-item .item-main {
       line-height: 160px;
       z-index: 1; }
-      /* line 88, ../sass/items/_item.scss */
+      /* line 91, ../sass/items/_item.scss */
       .items-holder .item.grid-item .item-main .item-type {
         overflow: false;
         position: absolute;
@@ -249,24 +250,23 @@
         left: 40px;
         width: auto;
         height: auto;
-        color: #737373;
         text-align: center;
         font-size: 96.9px;
         line-height: 102px;
         bottom: auto;
         height: 102px;
         top: 30px; }
-        /* line 100, ../sass/items/_item.scss */
+        /* line 103, ../sass/items/_item.scss */
         .items-holder .item.grid-item .item-main .item-type .l-icon-link {
-          color: #1a8e8b;
-          height: 36px;
-          line-height: 36px;
+          color: #49dedb;
+          height: auto;
+          line-height: 100%;
           position: absolute;
-          font-size: 32px;
+          font-size: 0.3em;
           left: 0px;
           bottom: 10px;
           z-index: 2; }
-      /* line 112, ../sass/items/_item.scss */
+      /* line 116, ../sass/items/_item.scss */
       .items-holder .item.grid-item .item-main .item-open {
         -moz-transition-property: "opacity";
         -o-transition-property: "opacity";
@@ -286,17 +286,20 @@
         width: 50px;
         pointer-events: none;
         text-align: right; }
-    /* line 124, ../sass/items/_item.scss */
+    /* line 128, ../sass/items/_item.scss */
     .items-holder .item.grid-item .title {
       text-shadow: rgba(0, 0, 0, 0.1) 0 1px 2px;
-      color: #cccccc;
       overflow: hidden;
+      text-overflow: ellipsis;
       white-space: nowrap;
-      text-overflow: ellipsis; }
-    /* line 132, ../sass/items/_item.scss */
+      color: #cccccc; }
+    /* line 133, ../sass/items/_item.scss */
     .items-holder .item.grid-item .details {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
       font-size: 0.8em; }
-    /* line 135, ../sass/items/_item.scss */
+    /* line 137, ../sass/items/_item.scss */
     .items-holder .item.grid-item.selected {
       background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzBhYzJmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwYjRmMCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
       background-size: 100%;
@@ -318,7 +321,7 @@
       color: #999;
       display: inline-block;
       color: #80dfff; }
-      /* line 163, ../sass/_mixins.scss */
+      /* line 167, ../sass/_mixins.scss */
       .items-holder .item.grid-item.selected:not(.disabled):hover {
         background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzJlY2JmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzE0YzRmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
         background-size: 100%;
@@ -327,22 +330,22 @@
         background-image: -webkit-linear-gradient(#2ecbff, #14c4ff);
         background-image: linear-gradient(#2ecbff, #14c4ff);
         color: #bdbdbd; }
-        /* line 166, ../sass/_mixins.scss */
+        /* line 170, ../sass/_mixins.scss */
         .items-holder .item.grid-item.selected:not(.disabled):hover.btn-menu .invoke-menu {
           color: #75ddff; }
-      /* line 171, ../sass/_mixins.scss */
+      /* line 175, ../sass/_mixins.scss */
       .items-holder .item.grid-item.selected.btn-menu .invoke-menu {
         color: #52d4ff; }
-      /* line 140, ../sass/items/_item.scss */
+      /* line 142, ../sass/items/_item.scss */
       .items-holder .item.grid-item.selected .item-type, .items-holder .item.grid-item.selected .top-bar .icon:not(.alert) {
         color: #80dfff; }
-      /* line 141, ../sass/items/_item.scss */
+      /* line 143, ../sass/items/_item.scss */
       .items-holder .item.grid-item.selected .item-main .item-open {
         color: #80dfff; }
-      /* line 142, ../sass/items/_item.scss */
+      /* line 144, ../sass/items/_item.scss */
       .items-holder .item.grid-item.selected .title {
         color: white; }
-      /* line 144, ../sass/items/_item.scss */
+      /* line 146, ../sass/items/_item.scss */
       .items-holder .item.grid-item.selected:hover .item-main .item-type {
         color: white !important; }
 
@@ -368,82 +371,82 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 @media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 34, ../sass/mobile/_item.scss */
-  .items-holder .item.grid-item .mobile-grid-nav {
-    top: 0px;
-    bottom: 0px;
-    right: 55px; }
-  /* line 39, ../sass/mobile/_item.scss */
-  .items-holder .item.grid-item .mobile-info {
-    text-align: center;
-    width: 50px;
-    right: 0px;
-    left: auto;
-    font-size: 1.3em; }
-  /* line 47, ../sass/mobile/_item.scss */
-  .items-holder .item.grid-item .bar.bottom-bar.abs {
-    top: 0px;
-    height: auto; }
-  /* line 54, ../sass/mobile/_item.scss */
-  .items-holder .item.grid-item .item-main .item-type {
-    font-size: 30px;
-    top: 0px;
-    left: 0px;
-    text-align: left;
-    height: auto; }
-  /* line 61, ../sass/mobile/_item.scss */
-  .items-holder .item.grid-item .item-main .item-open {
-    display: none; }
-  /* line 65, ../sass/mobile/_item.scss */
-  .items-holder .item.grid-item .title, .items-holder .item.grid-item .details {
-    margin-left: 30px; } }
+  /* line 29, ../sass/mobile/_item.scss */
+  .items-holder .item.grid-item {
+    width: 100%; }
+    /* line 33, ../sass/mobile/_item.scss */
+    .items-holder .item.grid-item > .contents {
+      top: 0px;
+      right: 10px;
+      bottom: 0px;
+      left: 10px; }
+    /* line 37, ../sass/mobile/_item.scss */
+    .items-holder .item.grid-item .bar.top-bar {
+      bottom: 0 !important;
+      left: auto !important;
+      right: 20px !important;
+      width: 40px !important;
+      height: auto !important;
+      text-align: right; }
+    /* line 44, ../sass/mobile/_item.scss */
+    .items-holder .item.grid-item .bar.bottom-bar {
+      left: 40px;
+      right: 60px; }
+    /* line 52, ../sass/mobile/_item.scss */
+    .items-holder .item.grid-item .item-main .item-type {
+      font-size: 30px;
+      right: auto;
+      bottom: auto;
+      left: 0;
+      line-height: 100%;
+      text-align: left;
+      width: 30px; }
+      /* line 61, ../sass/mobile/_item.scss */
+      .items-holder .item.grid-item .item-main .item-type .l-icon-link {
+        bottom: 0; }
+    /* line 65, ../sass/mobile/_item.scss */
+    .items-holder .item.grid-item .item-main .item-open {
+      display: block;
+      opacity: 1;
+      font-size: 1em;
+      width: auto; } }
 @media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px) {
   /* line 29, ../sass/mobile/_item.scss */
   .items-holder .item.grid-item {
-    width: 100%;
     height: 50px; }
-    /* line 74, ../sass/mobile/_item.scss */
-    .items-holder .item.grid-item .mobile-right {
-      top: 100%; }
-    /* line 77, ../sass/mobile/_item.scss */
-    .items-holder .item.grid-item .mobile-info {
-      line-height: 25px; }
-    /* line 81, ../sass/mobile/_item.scss */
+    /* line 78, ../sass/mobile/_item.scss */
+    .items-holder .item.grid-item .bar.top-bar {
+      line-height: 50px !important; }
+    /* line 82, ../sass/mobile/_item.scss */
+    .items-holder .item.grid-item .bar.bottom-bar {
+      top: 7px;
+      bottom: auto;
+      height: 35px; }
+    /* line 87, ../sass/mobile/_item.scss */
     .items-holder .item.grid-item .item-main .item-type {
-      line-height: 40px; }
-    /* line 85, ../sass/mobile/_item.scss */
-    .items-holder .item.grid-item .title {
-      margin-right: 10px;
-      line-height: 25px; }
-    /* line 89, ../sass/mobile/_item.scss */
-    .items-holder .item.grid-item .details {
-      margin-right: 10px;
-      line-height: 0px; } }
+      top: 10px;
+      bottom: auto;
+      height: 30px; }
+    /* line 90, ../sass/mobile/_item.scss */
+    .items-holder .item.grid-item .item-main .item-open {
+      line-height: 50px; } }
 @media screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
   /* line 29, ../sass/mobile/_item.scss */
   .items-holder .item.grid-item {
-    width: 100%;
-    height: 66.66667px; }
-    /* line 99, ../sass/mobile/_item.scss */
-    .items-holder .item.grid-item .mobile-right {
-      top: 100%; }
-    /* line 103, ../sass/mobile/_item.scss */
-    .items-holder .item.grid-item .mobile-info {
-      line-height: 38px; }
-    /* line 107, ../sass/mobile/_item.scss */
+    height: 66px; }
+    /* line 100, ../sass/mobile/_item.scss */
+    .items-holder .item.grid-item .bar.top-bar {
+      line-height: 66px !important; }
+    /* line 104, ../sass/mobile/_item.scss */
+    .items-holder .item.grid-item .bar.bottom-bar {
+      top: 15px;
+      bottom: auto;
+      height: 35px; }
+    /* line 109, ../sass/mobile/_item.scss */
     .items-holder .item.grid-item .item-main .item-type {
-      font-size: 30px;
-      line-height: 50px; }
+      top: 18px;
+      bottom: auto;
+      height: 30px; }
     /* line 112, ../sass/mobile/_item.scss */
-    .items-holder .item.grid-item .title {
-      margin-right: 10px;
-      line-height: 38px; }
-    /* line 116, ../sass/mobile/_item.scss */
-    .items-holder .item.grid-item .details {
-      margin-right: 10px;
-      line-height: 0px; } }
-@media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) {
-  /* line 29, ../sass/mobile/_item.scss */
-  .items-holder .item.grid-item {
-    width: 200px;
-    height: 200px; } }
+    .items-holder .item.grid-item .item-main .item-open {
+      line-height: 66px; } }
diff --git a/platform/commonUI/general/res/css/theme-espresso.css b/platform/commonUI/general/res/css/theme-espresso.css
index 167144638d..06be8ed1f7 100644
--- a/platform/commonUI/general/res/css/theme-espresso.css
+++ b/platform/commonUI/general/res/css/theme-espresso.css
@@ -70,6 +70,7 @@
  * this source code distribution or the Licensing information page available
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
+/************************** STYLE */
 /************************** MOBILE REPRESENTATION ITEMS DIMENSIONS */
 /************************** MOBILE TREE MENU DIMENSIONS */
 /************************** WINDOW DIMENSIONS FOR RWD */
@@ -387,16 +388,10 @@ p {
   margin-bottom: 10px; }
 
 /* line 74, ../sass/_global.scss */
-span {
-  /* 618 DEBUG
-  box-sizing: border-box;
-  */ }
-
-/* line 80, ../sass/_global.scss */
 mct-container {
   display: block; }
 
-/* line 84, ../sass/_global.scss */
+/* line 78, ../sass/_global.scss */
 .abs, .btn-menu span.l-click-area {
   position: absolute;
   top: 0;
@@ -406,51 +401,51 @@ mct-container {
   height: auto;
   width: auto; }
 
-/* line 94, ../sass/_global.scss */
+/* line 88, ../sass/_global.scss */
 .code, .codehilite {
   font-family: "Lucida Console", monospace;
   font-size: 0.7em;
   line-height: 150%;
   white-space: pre; }
 
-/* line 101, ../sass/_global.scss */
+/* line 95, ../sass/_global.scss */
 .codehilite {
   background-color: rgba(255, 255, 255, 0.1);
   padding: 1em; }
 
-/* line 107, ../sass/_global.scss */
+/* line 101, ../sass/_global.scss */
 .align-right {
   text-align: right; }
 
-/* line 111, ../sass/_global.scss */
+/* line 105, ../sass/_global.scss */
 .centered {
   text-align: center; }
 
-/* line 115, ../sass/_global.scss */
+/* line 109, ../sass/_global.scss */
 .no-margin {
   margin: 0; }
 
-/* line 119, ../sass/_global.scss */
+/* line 113, ../sass/_global.scss */
 .colorKey {
   color: #0099cc; }
 
-/* line 123, ../sass/_global.scss */
+/* line 117, ../sass/_global.scss */
 .ds {
   -moz-box-shadow: rgba(0, 0, 0, 0.7) 0 4px 10px 2px;
   -webkit-box-shadow: rgba(0, 0, 0, 0.7) 0 4px 10px 2px;
   box-shadow: rgba(0, 0, 0, 0.7) 0 4px 10px 2px; }
 
-/* line 127, ../sass/_global.scss */
+/* line 121, ../sass/_global.scss */
 .hide,
 .hidden {
   display: none !important; }
 
-/* line 133, ../sass/_global.scss */
+/* line 127, ../sass/_global.scss */
 .paused:not(.s-btn):not(.icon-btn) {
   border-color: #c56f01 !important;
   color: #c56f01 !important; }
 
-/* line 139, ../sass/_global.scss */
+/* line 133, ../sass/_global.scss */
 .sep {
   color: rgba(255, 255, 255, 0.2); }
 
@@ -549,23 +544,33 @@ mct-container {
 .bar.abs, .btn-menu span.bar.l-click-area {
   text-wrap: none;
   white-space: nowrap; }
-/* line 74, ../sass/user-environ/_layout.scss */
-.bar.left,
-.bar .left {
-  width: 45% !important;
-  right: auto !important; }
-/* line 79, ../sass/user-environ/_layout.scss */
-.bar.right,
-.bar .right {
-  width: 45% !important;
-  left: auto !important;
-  text-align: right; }
-  /* line 84, ../sass/user-environ/_layout.scss */
-  .bar.right .icon.major,
-  .bar .right .icon.major {
-    margin-left: 15px; }
+  /* line 73, ../sass/user-environ/_layout.scss */
+  .bar.abs.left, .btn-menu span.bar.left.l-click-area,
+  .bar.abs .left,
+  .btn-menu span.bar.l-click-area .left {
+    width: 45%;
+    right: auto; }
+  /* line 78, ../sass/user-environ/_layout.scss */
+  .bar.abs.right, .btn-menu span.bar.right.l-click-area,
+  .bar.abs .right,
+  .btn-menu span.bar.l-click-area .right {
+    width: 45%;
+    left: auto;
+    text-align: right; }
+    /* line 83, ../sass/user-environ/_layout.scss */
+    .bar.abs.right .icon.major, .btn-menu span.bar.right.l-click-area .icon.major,
+    .bar.abs .right .icon.major,
+    .btn-menu span.bar.l-click-area .right .icon.major {
+      margin-left: 15px; }
+/* line 88, ../sass/user-environ/_layout.scss */
+.bar.l-flex {
+  display: flex;
+  flex-flow: row nowrap; }
+  /* line 91, ../sass/user-environ/_layout.scss */
+  .bar.l-flex .left {
+    flex: 1 1 0; }
 
-/* line 91, ../sass/user-environ/_layout.scss */
+/* line 99, ../sass/user-environ/_layout.scss */
 .user-environ .browse-area,
 .user-environ .edit-area,
 .user-environ .editor {
@@ -573,24 +578,24 @@ mct-container {
   right: 10px;
   bottom: 35px;
   left: 10px; }
-/* line 102, ../sass/user-environ/_layout.scss */
+/* line 110, ../sass/user-environ/_layout.scss */
 .user-environ .browse-area > .contents,
 .user-environ .edit-area > .contents {
   left: 0;
   right: 0; }
-/* line 108, ../sass/user-environ/_layout.scss */
+/* line 116, ../sass/user-environ/_layout.scss */
 .user-environ .edit-area {
   top: 45px; }
-  /* line 111, ../sass/user-environ/_layout.scss */
+  /* line 119, ../sass/user-environ/_layout.scss */
   .user-environ .edit-area .tool-bar {
     bottom: auto;
     height: 30px;
     line-height: 25px; }
-  /* line 116, ../sass/user-environ/_layout.scss */
+  /* line 124, ../sass/user-environ/_layout.scss */
   .user-environ .edit-area .work-area {
     top: 40px; }
-/* line 121, ../sass/user-environ/_layout.scss */
-.user-environ .bottom-bar {
+/* line 129, ../sass/user-environ/_layout.scss */
+.user-environ .ue-bottom-bar {
   overflow: hidden;
   position: absolute;
   top: 0;
@@ -601,20 +606,20 @@ mct-container {
   height: auto;
   top: auto;
   height: 25px; }
-  /* line 126, ../sass/user-environ/_layout.scss */
-  .user-environ .bottom-bar .status-holder {
+  /* line 134, ../sass/user-environ/_layout.scss */
+  .user-environ .ue-bottom-bar .status-holder {
     z-index: 1; }
-  /* line 130, ../sass/user-environ/_layout.scss */
-  .user-environ .bottom-bar .app-logo {
+  /* line 138, ../sass/user-environ/_layout.scss */
+  .user-environ .ue-bottom-bar .app-logo {
     left: auto;
     width: 105px;
     z-index: 2; }
 
-/* line 138, ../sass/user-environ/_layout.scss */
+/* line 146, ../sass/user-environ/_layout.scss */
 .cols {
   overflow: hidden;
   *zoom: 1; }
-  /* line 140, ../sass/user-environ/_layout.scss */
+  /* line 148, ../sass/user-environ/_layout.scss */
   .cols .col {
     -moz-box-sizing: border-box;
     -webkit-box-sizing: border-box;
@@ -625,114 +630,130 @@ mct-container {
     margin-left: 1.5%;
     padding-left: 5px;
     position: relative; }
-    /* line 148, ../sass/user-environ/_layout.scss */
+    /* line 156, ../sass/user-environ/_layout.scss */
     .cols .col:first-child {
       margin-left: 0;
       padding-left: 0; }
-  /* line 155, ../sass/user-environ/_layout.scss */
+  /* line 163, ../sass/user-environ/_layout.scss */
   .cols.cols-2 .col-1 {
     min-width: 250px;
     width: 48.5%; }
-  /* line 161, ../sass/user-environ/_layout.scss */
+  /* line 169, ../sass/user-environ/_layout.scss */
   .cols.cols-2-ff .col-100px {
     width: 100px; }
-  /* line 168, ../sass/user-environ/_layout.scss */
+  /* line 176, ../sass/user-environ/_layout.scss */
   .cols.cols-6 .col-1 {
     min-width: 83.33333px;
     width: 15.16667%; }
-  /* line 174, ../sass/user-environ/_layout.scss */
+  /* line 182, ../sass/user-environ/_layout.scss */
   .cols.cols-16 .col-1 {
     min-width: 31.25px;
     width: 4.75%; }
-  /* line 177, ../sass/user-environ/_layout.scss */
+  /* line 185, ../sass/user-environ/_layout.scss */
   .cols.cols-16 .col-2 {
     min-width: 62.5px;
     width: 11%; }
-  /* line 180, ../sass/user-environ/_layout.scss */
+  /* line 188, ../sass/user-environ/_layout.scss */
   .cols.cols-16 .col-7 {
     min-width: 218.75px;
     width: 42.25%; }
-  /* line 186, ../sass/user-environ/_layout.scss */
+  /* line 194, ../sass/user-environ/_layout.scss */
   .cols.cols-32 .col-2 {
     min-width: 31.25px;
     width: 4.75%; }
-  /* line 189, ../sass/user-environ/_layout.scss */
+  /* line 197, ../sass/user-environ/_layout.scss */
   .cols.cols-32 .col-15 {
     min-width: 234.375px;
     width: 45.375%; }
-  /* line 193, ../sass/user-environ/_layout.scss */
+  /* line 201, ../sass/user-environ/_layout.scss */
   .cols .l-row {
     overflow: hidden;
     *zoom: 1;
     padding: 5px 0; }
 
-/* line 201, ../sass/user-environ/_layout.scss */
+/* line 209, ../sass/user-environ/_layout.scss */
 .browse-mode .split-layout .split-pane-component.pane.left {
   min-width: 150px;
-  max-width: 50%; }
+  max-width: 800px;
+  width: 25%; }
 
-/* line 210, ../sass/user-environ/_layout.scss */
-.edit-mode .split-layout .split-pane-component.pane.right {
-  min-width: 150px;
-  max-width: 50%; }
-  /* line 213, ../sass/user-environ/_layout.scss */
-  .edit-mode .split-layout .split-pane-component.pane.right .split-pane-component.pane.bottom {
-    min-height: 50px;
-    max-height: 80%; }
+/* line 222, ../sass/user-environ/_layout.scss */
+.edit-mode .split-layout .split-pane-component.pane.right .split-pane-component.pane.bottom {
+  min-height: 50px;
+  max-height: 80%; }
 
-/* line 221, ../sass/user-environ/_layout.scss */
+/* line 230, ../sass/user-environ/_layout.scss */
 .pane {
   position: absolute; }
-  /* line 224, ../sass/user-environ/_layout.scss */
+  /* line 233, ../sass/user-environ/_layout.scss */
   .pane.treeview.left .create-btn-holder {
     bottom: auto;
     top: 0;
     height: 24px; }
-    /* line 227, ../sass/user-environ/_layout.scss */
+    /* line 236, ../sass/user-environ/_layout.scss */
     .pane.treeview.left .create-btn-holder .wrapper.menu-element {
       position: absolute;
       bottom: 5px; }
-  /* line 232, ../sass/user-environ/_layout.scss */
+  /* line 241, ../sass/user-environ/_layout.scss */
   .pane.treeview.left .search-holder {
     top: 34px; }
-  /* line 235, ../sass/user-environ/_layout.scss */
+  /* line 244, ../sass/user-environ/_layout.scss */
   .pane.treeview.left .tree-holder {
     overflow: auto;
     top: 64px; }
-  /* line 242, ../sass/user-environ/_layout.scss */
+  /* line 251, ../sass/user-environ/_layout.scss */
   .pane.items .object-browse-bar .left.abs, .pane.items .object-browse-bar .btn-menu span.left.l-click-area, .btn-menu .pane.items .object-browse-bar span.left.l-click-area,
   .pane.items .object-browse-bar .right.abs,
   .pane.items .object-browse-bar .btn-menu span.right.l-click-area,
   .btn-menu .pane.items .object-browse-bar span.right.l-click-area {
     top: auto; }
-  /* line 247, ../sass/user-environ/_layout.scss */
+  /* line 262, ../sass/user-environ/_layout.scss */
   .pane.items .object-holder {
     top: 34px; }
-  /* line 251, ../sass/user-environ/_layout.scss */
+  /* line 266, ../sass/user-environ/_layout.scss */
   .pane .object-holder {
     overflow: auto; }
 
-/* line 259, ../sass/user-environ/_layout.scss */
+/* line 274, ../sass/user-environ/_layout.scss */
 .split-layout.horizontal > .pane {
   margin-top: 5px; }
-  /* line 262, ../sass/user-environ/_layout.scss */
+  /* line 277, ../sass/user-environ/_layout.scss */
   .split-layout.horizontal > .pane:first-child {
     margin-top: 0; }
-/* line 269, ../sass/user-environ/_layout.scss */
+/* line 284, ../sass/user-environ/_layout.scss */
 .split-layout.vertical > .pane {
   margin-left: 5px; }
-  /* line 272, ../sass/user-environ/_layout.scss */
+  /* line 287, ../sass/user-environ/_layout.scss */
   .split-layout.vertical > .pane > .holder {
     left: 0;
     right: 0; }
-  /* line 276, ../sass/user-environ/_layout.scss */
+  /* line 291, ../sass/user-environ/_layout.scss */
   .split-layout.vertical > .pane:first-child {
     margin-left: 0; }
-    /* line 278, ../sass/user-environ/_layout.scss */
+    /* line 293, ../sass/user-environ/_layout.scss */
     .split-layout.vertical > .pane:first-child .holder {
       right: 3px; }
 
-/* line 287, ../sass/user-environ/_layout.scss */
+/* line 302, ../sass/user-environ/_layout.scss */
+.object-browse-bar .btn,
+.object-browse-bar .t-btn,
+.object-browse-bar .view-switcher,
+.top-bar .buttons-main .btn,
+.top-bar .buttons-main .t-btn,
+.top-bar .view-switcher,
+.tool-bar .btn,
+.tool-bar .t-btn {
+  display: inline-block;
+  font-size: 11.25px;
+  line-height: 200%;
+  vertical-align: top; }
+
+/* line 319, ../sass/user-environ/_layout.scss */
+.object-browse-bar .view-switcher,
+.top-bar .view-switcher {
+  margin-right: 20px; }
+
+/* line 324, ../sass/user-environ/_layout.scss */
 .vscroll {
   overflow-y: auto; }
 
@@ -760,162 +781,138 @@ mct-container {
 @media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
   /* line 26, ../sass/mobile/_layout.scss */
   .browse-wrapper,
-  .mobile-pane {
-    position: absolute;
-    left: 0;
-    top: 0;
+  .pane {
+    top: 0 !important;
     right: 0;
-    white-space: nowrap; } }
+    bottom: 0;
+    left: 0; }
 
-@media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) {
-  /* line 38, ../sass/mobile/_layout.scss */
-  .desktop-browse {
-    min-width: 150px;
-    max-width: 800px;
-    width: 25%; } }
+  /* line 31, ../sass/mobile/_layout.scss */
+  .pane.left.treeview {
+    background-color: #222; }
 
-@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 49, ../sass/mobile/_layout.scss */
+  /* line 35, ../sass/mobile/_layout.scss */
+  .pane.right-repr {
+    -moz-transition-duration: 0.35s;
+    -o-transition-duration: 0.35s;
+    -webkit-transition-duration: 0.35s;
+    transition-duration: 0.35s;
+    transition-timing-function: ease;
+    backface-visibility: hidden;
+    margin-left: 0 !important; }
+    /* line 39, ../sass/mobile/_layout.scss */
+    .pane.right-repr #content-area {
+      -moz-transition-duration: 0.35s;
+      -o-transition-duration: 0.35s;
+      -webkit-transition-duration: 0.35s;
+      transition-duration: 0.35s;
+      transition-timing-function: ease;
+      backface-visibility: hidden;
+      opacity: 1; }
+
+  /* line 45, ../sass/mobile/_layout.scss */
+  .user-environ .browse-area,
+  .user-environ .edit-area,
+  .user-environ .editor {
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 25px; }
+
+  /* line 51, ../sass/mobile/_layout.scss */
+  .holder.l-mobile {
+    top: 10px !important;
+    right: 10px !important;
+    bottom: 10px !important;
+    left: 10px !important; }
+
+  /* line 61, ../sass/mobile/_layout.scss */
   .browse-hidetree {
     -moz-user-select: -moz-none;
     -ms-user-select: none;
     -webkit-user-select: none;
-    user-select: none; } }
-@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 60, ../sass/mobile/_layout.scss */
-  .browse-hidetree .mobile-pane.left-menu {
-    -moz-transition-property: opacity;
-    -o-transition-property: opacity;
-    -webkit-transition-property: opacity;
-    transition-property: opacity;
-    -moz-transition-duration: 0.4s;
-    -o-transition-duration: 0.4s;
-    -webkit-transition-duration: 0.4s;
-    transition-duration: 0.4s;
-    -moz-transition-timing-function: ease-in-out;
-    -o-transition-timing-function: ease-in-out;
-    -webkit-transition-timing-function: ease-in-out;
-    transition-timing-function: ease-in-out;
-    opacity: 0;
-    right: 100% !important;
-    width: auto !important;
-    overflow-y: hidden;
-    overflow-x: hidden; } }
-@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 73, ../sass/mobile/_layout.scss */
-  .browse-hidetree .mobile-pane.right-repr {
-    -moz-transition-duration: 0.35s;
-    -o-transition-duration: 0.35s;
-    -webkit-transition-duration: 0.35s;
-    transition-duration: 0.35s;
-    transition-timing-function: ease;
-    backface-visibility: hidden;
-    left: auto !important;
-    width: 100% !important; } }
+    user-select: none; }
+    /* line 65, ../sass/mobile/_layout.scss */
+    .browse-hidetree .pane.left.treeview {
+      opacity: 0;
+      right: 100% !important;
+      width: auto !important;
+      overflow-y: hidden;
+      overflow-x: hidden; }
+    /* line 74, ../sass/mobile/_layout.scss */
+    .browse-hidetree .pane.right-repr {
+      left: 0 !important; }
 
-/* line 82, ../sass/mobile/_layout.scss */
-.mobile-tree-holder {
-  top: 50px; }
-
-@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 91, ../sass/mobile/_layout.scss */
+  /* line 79, ../sass/mobile/_layout.scss */
   .browse-showtree {
     -moz-user-select: -moz-none;
     -ms-user-select: none;
     -webkit-user-select: none;
-    user-select: none; } }
-@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 102, ../sass/mobile/_layout.scss */
-  .browse-showtree .mobile-pane.left-menu {
-    -moz-transition-property: opacity;
-    -o-transition-property: opacity;
-    -webkit-transition-property: opacity;
-    transition-property: opacity;
-    -moz-transition-duration: 0.4s;
-    -o-transition-duration: 0.4s;
-    -webkit-transition-duration: 0.4s;
-    transition-duration: 0.4s;
-    -moz-transition-timing-function: ease-in-out;
-    -o-transition-timing-function: ease-in-out;
-    -webkit-transition-timing-function: ease-in-out;
-    transition-timing-function: ease-in-out;
-    opacity: 1;
-    display: block !important;
-    width: auto !important; } }
-@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px) {
-  /* line 102, ../sass/mobile/_layout.scss */
-  .browse-showtree .mobile-pane.left-menu {
-    right: 19px !important; } }
-@media screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 102, ../sass/mobile/_layout.scss */
-  .browse-showtree .mobile-pane.left-menu {
-    right: 66% !important; } }
-@media screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px) {
-  /* line 102, ../sass/mobile/_layout.scss */
-  .browse-showtree .mobile-pane.left-menu {
-    right: 500px !important; } }
-@media screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 102, ../sass/mobile/_layout.scss */
-  .browse-showtree .mobile-pane.left-menu {
-    right: 78% !important; } }
-@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 126, ../sass/mobile/_layout.scss */
-  .browse-showtree .mobile-pane.right-repr {
-    -moz-transition-duration: 0.35s;
-    -o-transition-duration: 0.35s;
-    -webkit-transition-duration: 0.35s;
-    transition-duration: 0.35s;
-    transition-timing-function: ease;
-    backface-visibility: hidden;
-    left: auto !important; } }
-@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px) {
-  /* line 126, ../sass/mobile/_layout.scss */
-  .browse-showtree .mobile-pane.right-repr {
-    width: 19px !important; } }
-@media screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 126, ../sass/mobile/_layout.scss */
-  .browse-showtree .mobile-pane.right-repr {
-    width: 66% !important; } }
-@media screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px) {
-  /* line 126, ../sass/mobile/_layout.scss */
-  .browse-showtree .mobile-pane.right-repr {
-    width: 500px !important; } }
-@media screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 126, ../sass/mobile/_layout.scss */
-  .browse-showtree .mobile-pane.right-repr {
-    width: 78% !important; } }
+    user-select: none; }
+    /* line 88, ../sass/mobile/_layout.scss */
+    .browse-showtree .pane.left.treeview {
+      -moz-transition-property: opacity;
+      -o-transition-property: opacity;
+      -webkit-transition-property: opacity;
+      transition-property: opacity;
+      -moz-transition-duration: 0.4s;
+      -o-transition-duration: 0.4s;
+      -webkit-transition-duration: 0.4s;
+      transition-duration: 0.4s;
+      -moz-transition-timing-function: ease-in-out;
+      -o-transition-timing-function: ease-in-out;
+      -webkit-transition-timing-function: ease-in-out;
+      transition-timing-function: ease-in-out;
+      background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuMCIgeTE9IjAuNSIgeDI9IjEuMCIgeTI9IjAuNSI+PHN0b3Agb2Zmc2V0PSI5OCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC4wIi8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjMDAwMDAwIiBzdG9wLW9wYWNpdHk9IjAuMyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
+      background-size: 100%;
+      background-image: -moz-linear-gradient(0deg, rgba(0, 0, 0, 0) 98%, rgba(0, 0, 0, 0.3) 100%);
+      background-image: -webkit-linear-gradient(0deg, rgba(0, 0, 0, 0) 98%, rgba(0, 0, 0, 0.3) 100%);
+      background-image: linear-gradient(90deg, rgba(0, 0, 0, 0) 98%, rgba(0, 0, 0, 0.3) 100%);
+      opacity: 1;
+      display: block !important;
+      right: auto !important;
+      width: 40% !important; }
+    /* line 98, ../sass/mobile/_layout.scss */
+    .browse-showtree .pane.right-repr {
+      left: 40% !important; }
 
-@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 149, ../sass/mobile/_layout.scss */
-  .button-pos {
-    position: absolute; } }
+  /* line 107, ../sass/mobile/_layout.scss */
+  .mobile-menu-icon {
+    font-size: 110%;
+    position: absolute;
+    top: 12px;
+    left: 10px; }
 
-@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 158, ../sass/mobile/_layout.scss */
-  .object-header {
-    position: relative;
-    left: 44px; }
-    /* line 163, ../sass/mobile/_layout.scss */
-    .object-header .label .context-available {
-      opacity: 1 !important; } }
+  /* line 114, ../sass/mobile/_layout.scss */
+  .object-browse-bar {
+    left: 30px !important; }
+    /* line 117, ../sass/mobile/_layout.scss */
+    .object-browse-bar .context-available {
+      opacity: 1 !important; }
+    /* line 120, ../sass/mobile/_layout.scss */
+    .object-browse-bar .view-switcher {
+      margin-right: 0 !important; }
+      /* line 122, ../sass/mobile/_layout.scss */
+      .object-browse-bar .view-switcher .name {
+        display: none; }
 
-@media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) {
-  /* line 170, ../sass/mobile/_layout.scss */
-  .desktop-hide {
-    display: none; } }
+  /* line 129, ../sass/mobile/_layout.scss */
+  .tree-holder {
+    overflow-x: hidden !important; }
 
-@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 177, ../sass/mobile/_layout.scss */
-  .mobile-hide {
-    display: none; } }
+  /* line 133, ../sass/mobile/_layout.scss */
+  .mobile-disable-select {
+    -moz-user-select: -moz-none;
+    -ms-user-select: none;
+    -webkit-user-select: none;
+    user-select: none; }
 
-@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 183, ../sass/mobile/_layout.scss */
-  .mobile-important-hide {
-    display: none !important; } }
+  /* line 138, ../sass/mobile/_layout.scss */
+  .mobile-hide,
+  .mobile-hide-important {
+    display: none !important; }
 
-@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 189, ../sass/mobile/_layout.scss */
+  /* line 143, ../sass/mobile/_layout.scss */
   .mobile-back-hide {
     pointer-events: none;
     -moz-transition-property: opacity;
@@ -930,10 +927,9 @@ mct-container {
     -o-transition-timing-function: ease-in-out;
     -webkit-transition-timing-function: ease-in-out;
     transition-timing-function: ease-in-out;
-    opacity: 0; } }
+    opacity: 0; }
 
-@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 198, ../sass/mobile/_layout.scss */
+  /* line 148, ../sass/mobile/_layout.scss */
   .mobile-back-unhide {
     pointer-events: all;
     -moz-transition-property: opacity;
@@ -949,25 +945,21 @@ mct-container {
     -webkit-transition-timing-function: ease-in-out;
     transition-timing-function: ease-in-out;
     opacity: 1; } }
-
-@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 207, ../sass/mobile/_layout.scss */
-  .phone-hide {
+@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px) {
+  /* line 157, ../sass/mobile/_layout.scss */
+  .browse-showtree .pane.left.treeview {
+    width: 90% !important; }
+  /* line 160, ../sass/mobile/_layout.scss */
+  .browse-showtree .pane.right-repr {
+    left: 0 !important;
+    transform: translateX(90%); }
+    /* line 163, ../sass/mobile/_layout.scss */
+    .browse-showtree .pane.right-repr #content-area {
+      opacity: 0; } }
+@media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) {
+  /* line 171, ../sass/mobile/_layout.scss */
+  .desktop-hide {
     display: none; } }
-
-@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 213, ../sass/mobile/_layout.scss */
-  .tree-holder {
-    overflow-x: hidden !important; } }
-
-@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 218, ../sass/mobile/_layout.scss */
-  .mobile-disable-select {
-    -moz-user-select: -moz-none;
-    -ms-user-select: none;
-    -webkit-user-select: none;
-    user-select: none; } }
-
 /*****************************************************************************
 * Open MCT Web, Copyright (c) 2014-2015, United States Government
 * as represented by the Administrator of the National Aeronautics and Space
@@ -1295,7 +1287,7 @@ mct-container {
     font-size: 1.65em; }
 
 /* line 48, ../sass/_icons.scss */
-.bar .icon {
+.bar .ui-symbol {
   display: inline-block; }
 
 /* line 52, ../sass/_icons.scss */
@@ -1314,10 +1306,6 @@ mct-container {
 .super-menu.menu .type-icon {
   position: absolute; }
 
-/* line 68, ../sass/_icons.scss */
-.tree-item .type-icon {
-  font-size: 16px; }
-
 /* line 72, ../sass/_icons.scss */
 .l-icon-link:before {
   content: "\f4"; }
@@ -1706,37 +1694,37 @@ table {
   -ms-user-select: none;
   -webkit-user-select: none;
   user-select: none;
-  line-height: 1.5em;
+  line-height: 150%;
   padding: 0 7.5px;
   text-decoration: none; }
-  /* line 32, ../sass/controls/_buttons.scss */
+  /* line 33, ../sass/controls/_buttons.scss */
   .btn.lg, .btn.create-btn,
   .l-btn.lg,
   .l-btn.create-btn {
     height: 24px;
     line-height: 22px;
     padding: 0 22.5px; }
-  /* line 41, ../sass/controls/_buttons.scss */
+  /* line 42, ../sass/controls/_buttons.scss */
   .btn.create-btn:before,
   .l-btn.create-btn:before {
     content: "+";
     font-family: symbolsfont;
     font-size: 0.8em; }
-  /* line 46, ../sass/controls/_buttons.scss */
+  /* line 47, ../sass/controls/_buttons.scss */
   .btn.create-btn .menu,
   .l-btn.create-btn .menu {
     margin-left: -7.5px; }
-  /* line 53, ../sass/controls/_buttons.scss */
+  /* line 54, ../sass/controls/_buttons.scss */
   .btn.sm,
   .l-btn.sm {
     padding: 0 5px; }
-  /* line 56, ../sass/controls/_buttons.scss */
+  /* line 57, ../sass/controls/_buttons.scss */
   .btn.vsm,
   .l-btn.vsm {
     padding: 0 2.5px; }
 
 /*********************************** STYLE STYLES */
-/* line 62, ../sass/controls/_buttons.scss */
+/* line 63, ../sass/controls/_buttons.scss */
 .btn,
 .s-btn,
 .icon-btn,
@@ -1750,7 +1738,7 @@ table {
   text-shadow: rgba(0, 0, 0, 0.3) 0 1px 1px;
   cursor: pointer;
   text-decoration: none; }
-  /* line 71, ../sass/controls/_buttons.scss */
+  /* line 72, ../sass/controls/_buttons.scss */
   .btn.major,
   .s-btn.major,
   .major.icon-btn,
@@ -1775,7 +1763,7 @@ table {
     color: #999;
     display: inline-block;
     color: #ccf2ff; }
-    /* line 163, ../sass/_mixins.scss */
+    /* line 167, ../sass/_mixins.scss */
     .btn.major:not(.disabled):hover,
     .s-btn.major:not(.disabled):hover,
     .major.icon-btn:not(.disabled):hover,
@@ -1787,19 +1775,19 @@ table {
       background-image: -webkit-linear-gradient(#2ecbff, #14c4ff);
       background-image: linear-gradient(#2ecbff, #14c4ff);
       color: #bdbdbd; }
-      /* line 166, ../sass/_mixins.scss */
+      /* line 170, ../sass/_mixins.scss */
       .btn.major:not(.disabled):hover.btn-menu .invoke-menu,
       .s-btn.major:not(.disabled):hover.btn-menu .invoke-menu,
       .major.icon-btn:not(.disabled):hover.btn-menu .invoke-menu,
       .major.s-icon-btn:not(.disabled):hover.btn-menu .invoke-menu {
         color: #75ddff; }
-    /* line 171, ../sass/_mixins.scss */
+    /* line 175, ../sass/_mixins.scss */
     .btn.major.btn-menu .invoke-menu,
     .s-btn.major.btn-menu .invoke-menu,
     .major.btn-menu.icon-btn .invoke-menu,
     .major.btn-menu.s-icon-btn .invoke-menu {
       color: #52d4ff; }
-    /* line 76, ../sass/controls/_buttons.scss */
+    /* line 77, ../sass/controls/_buttons.scss */
     .btn.major:hover,
     .s-btn.major:hover,
     .major.icon-btn:hover,
@@ -1823,7 +1811,7 @@ table {
       border-top: 1px solid #2ecbff;
       color: #ccf2ff;
       display: inline-block; }
-      /* line 163, ../sass/_mixins.scss */
+      /* line 167, ../sass/_mixins.scss */
       .btn.major:hover:not(.disabled):hover,
       .s-btn.major:hover:not(.disabled):hover,
       .major.icon-btn:hover:not(.disabled):hover,
@@ -1835,25 +1823,25 @@ table {
         background-image: -webkit-linear-gradient(#47d1ff, #2ecbff);
         background-image: linear-gradient(#47d1ff, #2ecbff);
         color: white; }
-        /* line 166, ../sass/_mixins.scss */
+        /* line 170, ../sass/_mixins.scss */
         .btn.major:hover:not(.disabled):hover.btn-menu .invoke-menu,
         .s-btn.major:hover:not(.disabled):hover.btn-menu .invoke-menu,
         .major.icon-btn:hover:not(.disabled):hover.btn-menu .invoke-menu,
         .major.s-icon-btn:hover:not(.disabled):hover.btn-menu .invoke-menu {
           color: #8fe3ff; }
-      /* line 171, ../sass/_mixins.scss */
+      /* line 175, ../sass/_mixins.scss */
       .btn.major:hover.btn-menu .invoke-menu,
       .s-btn.major:hover.btn-menu .invoke-menu,
       .major.icon-btn:hover.btn-menu .invoke-menu,
       .major.s-icon-btn:hover.btn-menu .invoke-menu {
         color: #6bdaff; }
-    /* line 80, ../sass/controls/_buttons.scss */
+    /* line 81, ../sass/controls/_buttons.scss */
     .btn.major .invoke-menu,
     .s-btn.major .invoke-menu,
     .major.icon-btn .invoke-menu,
     .major.s-icon-btn .invoke-menu {
       color: #ccf2ff; }
-  /* line 84, ../sass/controls/_buttons.scss */
+  /* line 85, ../sass/controls/_buttons.scss */
   .btn.subtle,
   .s-btn.subtle,
   .subtle.icon-btn,
@@ -1877,7 +1865,7 @@ table {
     border-top: 1px solid #8a8a8a;
     color: #cccccc;
     display: inline-block; }
-    /* line 163, ../sass/_mixins.scss */
+    /* line 167, ../sass/_mixins.scss */
     .btn.subtle:not(.disabled):hover,
     .s-btn.subtle:not(.disabled):hover,
     .subtle.icon-btn:not(.disabled):hover,
@@ -1889,19 +1877,19 @@ table {
       background-image: -webkit-linear-gradient(#969696, #8a8a8a);
       background-image: linear-gradient(#969696, #8a8a8a);
       color: #f0f0f0; }
-      /* line 166, ../sass/_mixins.scss */
+      /* line 170, ../sass/_mixins.scss */
       .btn.subtle:not(.disabled):hover.btn-menu .invoke-menu,
       .s-btn.subtle:not(.disabled):hover.btn-menu .invoke-menu,
       .subtle.icon-btn:not(.disabled):hover.btn-menu .invoke-menu,
       .subtle.s-icon-btn:not(.disabled):hover.btn-menu .invoke-menu {
         color: #bababa; }
-    /* line 171, ../sass/_mixins.scss */
+    /* line 175, ../sass/_mixins.scss */
     .btn.subtle.btn-menu .invoke-menu,
     .s-btn.subtle.btn-menu .invoke-menu,
     .subtle.btn-menu.icon-btn .invoke-menu,
     .subtle.btn-menu.s-icon-btn .invoke-menu {
       color: #a8a8a8; }
-  /* line 87, ../sass/controls/_buttons.scss */
+  /* line 88, ../sass/controls/_buttons.scss */
   .btn.very-subtle, .btn.s-very-subtle,
   .s-btn.very-subtle,
   .very-subtle.icon-btn,
@@ -1928,7 +1916,7 @@ table {
     border-top: 1px solid #575757;
     color: #999;
     display: inline-block; }
-    /* line 163, ../sass/_mixins.scss */
+    /* line 167, ../sass/_mixins.scss */
     .btn.very-subtle:not(.disabled):hover, .btn.s-very-subtle:not(.disabled):hover,
     .s-btn.very-subtle:not(.disabled):hover,
     .very-subtle.icon-btn:not(.disabled):hover,
@@ -1943,7 +1931,7 @@ table {
       background-image: -webkit-linear-gradient(#636363, #575757);
       background-image: linear-gradient(#636363, #575757);
       color: #bdbdbd; }
-      /* line 166, ../sass/_mixins.scss */
+      /* line 170, ../sass/_mixins.scss */
       .btn.very-subtle:not(.disabled):hover.btn-menu .invoke-menu, .btn.s-very-subtle:not(.disabled):hover.btn-menu .invoke-menu,
       .s-btn.very-subtle:not(.disabled):hover.btn-menu .invoke-menu,
       .very-subtle.icon-btn:not(.disabled):hover.btn-menu .invoke-menu,
@@ -1952,7 +1940,7 @@ table {
       .s-very-subtle.icon-btn:not(.disabled):hover.btn-menu .invoke-menu,
       .s-very-subtle.s-icon-btn:not(.disabled):hover.btn-menu .invoke-menu {
         color: #878787; }
-    /* line 171, ../sass/_mixins.scss */
+    /* line 175, ../sass/_mixins.scss */
     .btn.very-subtle.btn-menu .invoke-menu, .btn.s-very-subtle.btn-menu .invoke-menu,
     .s-btn.very-subtle.btn-menu .invoke-menu,
     .very-subtle.btn-menu.icon-btn .invoke-menu,
@@ -1961,7 +1949,7 @@ table {
     .s-very-subtle.btn-menu.icon-btn .invoke-menu,
     .s-very-subtle.btn-menu.s-icon-btn .invoke-menu {
       color: #757575; }
-    /* line 90, ../sass/controls/_buttons.scss */
+    /* line 91, ../sass/controls/_buttons.scss */
     .btn.very-subtle.paused, .btn.s-very-subtle.paused,
     .s-btn.very-subtle.paused,
     .very-subtle.paused.icon-btn,
@@ -1988,7 +1976,7 @@ table {
       border-top: 1px solid #fe9510;
       color: #fff;
       display: inline-block; }
-      /* line 163, ../sass/_mixins.scss */
+      /* line 167, ../sass/_mixins.scss */
       .btn.very-subtle.paused:not(.disabled):hover, .btn.s-very-subtle.paused:not(.disabled):hover,
       .s-btn.very-subtle.paused:not(.disabled):hover,
       .very-subtle.paused.icon-btn:not(.disabled):hover,
@@ -2003,7 +1991,7 @@ table {
         background-image: -webkit-linear-gradient(#fea029, #fe9510);
         background-image: linear-gradient(#fea029, #fe9510);
         color: white; }
-        /* line 166, ../sass/_mixins.scss */
+        /* line 170, ../sass/_mixins.scss */
         .btn.very-subtle.paused:not(.disabled):hover.btn-menu .invoke-menu, .btn.s-very-subtle.paused:not(.disabled):hover.btn-menu .invoke-menu,
         .s-btn.very-subtle.paused:not(.disabled):hover.btn-menu .invoke-menu,
         .very-subtle.paused.icon-btn:not(.disabled):hover.btn-menu .invoke-menu,
@@ -2012,7 +2000,7 @@ table {
         .s-very-subtle.paused.icon-btn:not(.disabled):hover.btn-menu .invoke-menu,
         .s-very-subtle.paused.s-icon-btn:not(.disabled):hover.btn-menu .invoke-menu {
           color: #fec070; }
-      /* line 171, ../sass/_mixins.scss */
+      /* line 175, ../sass/_mixins.scss */
       .btn.very-subtle.paused.btn-menu .invoke-menu, .btn.s-very-subtle.paused.btn-menu .invoke-menu,
       .s-btn.very-subtle.paused.btn-menu .invoke-menu,
       .very-subtle.paused.btn-menu.icon-btn .invoke-menu,
@@ -2021,7 +2009,7 @@ table {
       .s-very-subtle.paused.btn-menu.icon-btn .invoke-menu,
       .s-very-subtle.paused.btn-menu.s-icon-btn .invoke-menu {
         color: #feb04d; }
-      /* line 92, ../sass/controls/_buttons.scss */
+      /* line 93, ../sass/controls/_buttons.scss */
       .btn.very-subtle.paused .icon:before, .btn.s-very-subtle.paused .icon:before,
       .s-btn.very-subtle.paused .icon:before,
       .very-subtle.paused.icon-btn .icon:before,
@@ -2031,31 +2019,31 @@ table {
       .s-very-subtle.paused.s-icon-btn .icon:before {
         content: "\0000EF"; }
 
-/* line 99, ../sass/controls/_buttons.scss */
+/* line 100, ../sass/controls/_buttons.scss */
 .icon-btn,
 .s-icon-btn {
   font-size: 1em; }
-  /* line 103, ../sass/controls/_buttons.scss */
+  /* line 104, ../sass/controls/_buttons.scss */
   .icon-btn .icon,
   .s-icon-btn .icon {
     color: #0099cc; }
-  /* line 107, ../sass/controls/_buttons.scss */
+  /* line 108, ../sass/controls/_buttons.scss */
   .icon-btn.paused .icon,
   .s-icon-btn.paused .icon {
     color: #fff; }
-  /* line 115, ../sass/controls/_buttons.scss */
+  /* line 116, ../sass/controls/_buttons.scss */
   .icon-btn:not(.disabled):not(.paused):hover .icon,
   .s-icon-btn:not(.disabled):not(.paused):hover .icon {
     color: #33ccff; }
-  /* line 122, ../sass/controls/_buttons.scss */
+  /* line 123, ../sass/controls/_buttons.scss */
   .icon-btn.labeled,
   .s-icon-btn.labeled {
     padding: 0 3.75px; }
-    /* line 127, ../sass/controls/_buttons.scss */
+    /* line 128, ../sass/controls/_buttons.scss */
     .icon-btn.labeled .title-label,
     .s-icon-btn.labeled .title-label {
       margin-left: 5px; }
-  /* line 132, ../sass/controls/_buttons.scss */
+  /* line 133, ../sass/controls/_buttons.scss */
   .icon-btn.pause-play,
   .s-icon-btn.pause-play {
     /*		&.paused {
@@ -2063,17 +2051,17 @@ table {
     				@include pulse(500ms);
     			}
     		}*/ }
-    /* line 138, ../sass/controls/_buttons.scss */
+    /* line 139, ../sass/controls/_buttons.scss */
     .icon-btn.pause-play .icon:before,
     .s-icon-btn.pause-play .icon:before {
       content: "\0000F1"; }
-  /* line 144, ../sass/controls/_buttons.scss */
+  /* line 145, ../sass/controls/_buttons.scss */
   .icon-btn.show-thumbs .icon:before,
   .s-icon-btn.show-thumbs .icon:before {
     content: "\000039"; }
 
 /*********************************** LAYOUT STYLES */
-/* line 151, ../sass/controls/_buttons.scss */
+/* line 152, ../sass/controls/_buttons.scss */
 span.btn,
 span.btn span,
 span.l-btn,
@@ -2266,11 +2254,20 @@ a.l-btn span {
     overflow-y: auto;
     overflow-x: hidden; }
 
-/* line 105, ../sass/controls/_controls.scss */
-.btn-bar .btn,
-.btn-bar .btn-set,
-.btn-bar .t-btn {
-  display: inline-block; }
+/* line 103, ../sass/controls/_controls.scss */
+.btn-bar {
+  /*	.btn,
+  	.btn-set,
+  	.t-btn {
+  		display: inline-block;
+  		//		margin-left: $interiorMargin;
+  	}
+  	.btn,
+  	.t-btn {
+  		&:first-child {
+  			//			margin-left: 0;
+  		}
+  	}*/ }
 
 /* line 119, ../sass/controls/_controls.scss */
 .l-composite-control {
@@ -2304,51 +2301,41 @@ a.l-btn span {
 .s-local-controls {
   font-size: 0.7rem; }
 
-/* line 156, ../sass/controls/_controls.scss */
+/*
 .btn-set {
-  display: inline-block;
-  position: relative; }
-  /* line 160, ../sass/controls/_controls.scss */
-  .btn-set .btn,
-  .btn-set .t-btn {
-    -moz-border-radius: 0;
-    -webkit-border-radius: 0;
-    border-radius: 0;
-    border-left: 1px solid #666666;
-    margin-left: 0; }
-    /* line 165, ../sass/controls/_controls.scss */
-    .btn-set .btn:first-child,
-    .btn-set .t-btn:first-child {
-      border-left: none;
-      -moz-border-radius-topleft: 3px;
-      -webkit-border-top-left-radius: 3px;
-      border-top-left-radius: 3px;
-      -moz-border-radius-bottomleft: 3px;
-      -webkit-border-bottom-left-radius: 3px;
-      border-bottom-left-radius: 3px; }
-    /* line 169, ../sass/controls/_controls.scss */
-    .btn-set .btn:last-child,
-    .btn-set .t-btn:last-child {
-      -moz-border-radius-topright: 3px;
-      -webkit-border-top-right-radius: 3px;
-      border-top-right-radius: 3px;
-      -moz-border-radius-bottomright: 3px;
-      -webkit-border-bottom-right-radius: 3px;
-      border-bottom-right-radius: 3px; }
-
-/* line 175, ../sass/controls/_controls.scss */
+	// Buttons that have a very tight conceptual grouping - no internal space between them.
+	display: inline-block;
+	position: relative;
+	.btn,
+	.t-btn {
+		@include border-radius(0);
+		border-left: 1px solid lighten($colorBodyBg, 20%);
+		margin-left: 0;
+		&:first-child {
+			border-left: none;
+			@include border-left-radius($controlCr);
+		}
+		&:last-child {
+			@include border-right-radius($controlCr);
+		}
+	}
+}
+*/
+/* line 177, ../sass/controls/_controls.scss */
 .object-browse-bar .btn,
 .object-browse-bar .t-btn,
+.object-browse-bar .view-switcher,
 .top-bar .buttons-main .btn,
 .top-bar .buttons-main .t-btn,
+.top-bar .view-switcher,
 .tool-bar .btn,
 .tool-bar .t-btn {
   display: inline-block;
   font-size: 11.25px;
-  height: 25px;
-  line-height: 22px; }
+  line-height: 200%;
+  vertical-align: top; }
 
-/* line 194, ../sass/controls/_controls.scss */
+/* line 192, ../sass/controls/_controls.scss */
 label.checkbox.custom {
   cursor: pointer;
   display: inline-block;
@@ -2356,14 +2343,14 @@ label.checkbox.custom {
   margin-right: 20px;
   padding-left: 19px;
   position: relative;
-  vertical-align: top; }
-  /* line 205, ../sass/controls/_controls.scss */
+  vertical-align: middle; }
+  /* line 202, ../sass/controls/_controls.scss */
   label.checkbox.custom em {
     color: #999;
     display: inline-block;
     height: 14px;
     min-width: 14px; }
-    /* line 210, ../sass/controls/_controls.scss */
+    /* line 207, ../sass/controls/_controls.scss */
     label.checkbox.custom em:before {
       -moz-border-radius: 1.5px;
       -webkit-border-radius: 1.5px;
@@ -2382,51 +2369,51 @@ label.checkbox.custom {
       top: 0;
       position: absolute;
       text-align: center; }
-  /* line 228, ../sass/controls/_controls.scss */
+  /* line 225, ../sass/controls/_controls.scss */
   label.checkbox.custom.no-text {
     overflow: hidden;
     margin-right: 0;
     padding-left: 0;
     height: 14px;
     width: 14px; }
-    /* line 234, ../sass/controls/_controls.scss */
+    /* line 231, ../sass/controls/_controls.scss */
     label.checkbox.custom.no-text em {
       overflow: hidden; }
-  /* line 238, ../sass/controls/_controls.scss */
+  /* line 235, ../sass/controls/_controls.scss */
   label.checkbox.custom input {
     display: none; }
-    /* line 240, ../sass/controls/_controls.scss */
+    /* line 237, ../sass/controls/_controls.scss */
     label.checkbox.custom input:checked ~ em:before {
       background: #0099cc;
       color: #ccf2ff;
       content: "2"; }
 
-/* line 248, ../sass/controls/_controls.scss */
+/* line 245, ../sass/controls/_controls.scss */
 .input-labeled {
   margin-left: 5px; }
-  /* line 250, ../sass/controls/_controls.scss */
+  /* line 247, ../sass/controls/_controls.scss */
   .input-labeled label {
     display: inline-block;
     margin-right: 3px; }
-  /* line 254, ../sass/controls/_controls.scss */
+  /* line 251, ../sass/controls/_controls.scss */
   .input-labeled.inline {
     display: inline-block; }
-  /* line 257, ../sass/controls/_controls.scss */
+  /* line 254, ../sass/controls/_controls.scss */
   .input-labeled:first-child {
     margin-left: 0; }
 
-/* line 262, ../sass/controls/_controls.scss */
+/* line 259, ../sass/controls/_controls.scss */
 .btn-menu label.checkbox.custom {
   margin-left: 5px; }
 
-/* line 267, ../sass/controls/_controls.scss */
+/* line 264, ../sass/controls/_controls.scss */
 .item .checkbox.checked label {
   -moz-box-shadow: none;
   -webkit-box-shadow: none;
   box-shadow: none;
   border-bottom: none; }
 
-/* line 273, ../sass/controls/_controls.scss */
+/* line 270, ../sass/controls/_controls.scss */
 .btn-menu {
   background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzUyNTI1MiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzQ1NDU0NSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
   background-size: 100%;
@@ -2464,7 +2451,7 @@ label.checkbox.custom {
   			color: lighten($c, 10%);
   		}
   	}*/ }
-  /* line 163, ../sass/_mixins.scss */
+  /* line 167, ../sass/_mixins.scss */
   .btn-menu:not(.disabled):hover {
     background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzYzNjM2MyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU3NTc1NyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
     background-size: 100%;
@@ -2473,60 +2460,55 @@ label.checkbox.custom {
     background-image: -webkit-linear-gradient(#636363, #575757);
     background-image: linear-gradient(#636363, #575757);
     color: #bdbdbd; }
-    /* line 166, ../sass/_mixins.scss */
+    /* line 170, ../sass/_mixins.scss */
     .btn-menu:not(.disabled):hover.btn-menu .invoke-menu {
       color: #878787; }
-  /* line 171, ../sass/_mixins.scss */
+  /* line 175, ../sass/_mixins.scss */
   .btn-menu.btn-menu .invoke-menu {
     color: #757575; }
-  /* line 285, ../sass/controls/_controls.scss */
+  /* line 282, ../sass/controls/_controls.scss */
   .btn-menu:not(.disabled):hover {
     color: #cccccc; }
-  /* line 310, ../sass/controls/_controls.scss */
+  /* line 307, ../sass/controls/_controls.scss */
   .btn-menu .name {
     margin-left: 5px; }
-  /* line 313, ../sass/controls/_controls.scss */
+  /* line 310, ../sass/controls/_controls.scss */
   .btn-menu .menu {
     position: absolute;
     left: 0;
     text-align: left; }
-    /* line 318, ../sass/controls/_controls.scss */
+    /* line 315, ../sass/controls/_controls.scss */
     .btn-menu .menu .ui-symbol.icon {
       width: 12px; }
 
-/* line 324, ../sass/controls/_controls.scss */
-.top-bar .btn-menu {
-  height: 25px;
-  line-height: 25px;
-  padding-right: 10px; }
+/* line 329, ../sass/controls/_controls.scss */
+.top-bar .btn-menu.browse-btn {
+  margin-right: 5px;
+  padding-left: 25px; }
   /* line 332, ../sass/controls/_controls.scss */
-  .top-bar .btn-menu.browse-btn {
-    margin-right: 5px;
-    padding-left: 25px; }
-    /* line 335, ../sass/controls/_controls.scss */
-    .top-bar .btn-menu.browse-btn .badge {
-      -moz-border-radius: 4.5px;
-      -webkit-border-radius: 4.5px;
-      border-radius: 4.5px;
-      display: block;
-      font-size: 1em;
-      line-height: 15px;
-      position: absolute;
-      top: 5px;
-      left: 5px;
-      bottom: 5px;
-      right: auto;
-      width: 15px;
-      height: auto; }
+  .top-bar .btn-menu.browse-btn .badge {
+    -moz-border-radius: 4.5px;
+    -webkit-border-radius: 4.5px;
+    border-radius: 4.5px;
+    display: block;
+    font-size: 1em;
+    line-height: 15px;
+    position: absolute;
+    top: 5px;
+    left: 5px;
+    bottom: 5px;
+    right: auto;
+    width: 15px;
+    height: auto; }
 
-/* line 351, ../sass/controls/_controls.scss */
+/* line 348, ../sass/controls/_controls.scss */
 .context-available {
   color: #0099cc; }
-  /* line 355, ../sass/controls/_controls.scss */
+  /* line 351, ../sass/controls/_controls.scss */
   .context-available:hover {
     color: deepskyblue; }
 
-/* line 360, ../sass/controls/_controls.scss */
+/* line 356, ../sass/controls/_controls.scss */
 .view-switcher {
   -moz-transition-property: visibility, opacity, background-color, border-color;
   -o-transition-property: visibility, opacity, background-color, border-color;
@@ -2542,37 +2524,54 @@ label.checkbox.custom {
   transition-timing-function: ease-in-out; }
 
 /******************************************************** OBJECT-HEADER */
-/* line 365, ../sass/controls/_controls.scss */
+/* line 364, ../sass/controls/_controls.scss */
 .object-header {
-  display: inline-block;
   font-size: 1em; }
-  /* line 369, ../sass/controls/_controls.scss */
-  .object-header .label .title-label {
-    color: white; }
-  /* line 372, ../sass/controls/_controls.scss */
-  .object-header .label .type-icon {
+  /* line 374, ../sass/controls/_controls.scss */
+  .object-header > .type-icon {
     font-size: 120%;
-    margin-right: 5px;
-    vertical-align: middle; }
-  /* line 377, ../sass/controls/_controls.scss */
-  .object-header .label .context-available {
-    opacity: 0;
-    font-size: 0.8em; }
-  /* line 382, ../sass/controls/_controls.scss */
-  .object-header .label:hover .context-available {
-    opacity: 1; }
-
-/* line 391, ../sass/controls/_controls.scss */
-.top-bar .object-header,
-.object-browse-bar .object-header {
-  font-size: 1.1em; }
-  /* line 393, ../sass/controls/_controls.scss */
-  .top-bar .object-header span,
-  .object-browse-bar .object-header span {
-    display: inline-block; }
+    float: left;
+    margin-right: 5px; }
+  /* line 380, ../sass/controls/_controls.scss */
+  .object-header .l-elem-wrapper {
+    display: flex;
+    flex-flow: row nowrap;
+    justify-content: flex-start; }
+  /* line 386, ../sass/controls/_controls.scss */
+  .object-header .action {
+    margin-right: 5px; }
+  /* line 390, ../sass/controls/_controls.scss */
+  .object-header .title-label {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    color: white;
+    padding-right: 0.35em; }
+  /* line 397, ../sass/controls/_controls.scss */
+  .object-header .context-available {
+    font-size: 0.7em; }
+  @media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) {
+    /* line 402, ../sass/controls/_controls.scss */
+    .object-header .context-available {
+      -moz-transition-property: opacity;
+      -o-transition-property: opacity;
+      -webkit-transition-property: opacity;
+      transition-property: opacity;
+      -moz-transition-duration: 0.25s;
+      -o-transition-duration: 0.25s;
+      -webkit-transition-duration: 0.25s;
+      transition-duration: 0.25s;
+      -moz-transition-timing-function: ease-in-out;
+      -o-transition-timing-function: ease-in-out;
+      -webkit-transition-timing-function: ease-in-out;
+      transition-timing-function: ease-in-out;
+      opacity: 0; }
+    /* line 407, ../sass/controls/_controls.scss */
+    .object-header:hover .context-available {
+      opacity: 1; } }
 
 /******************************************************** SLIDERS */
-/* line 405, ../sass/controls/_controls.scss */
+/* line 420, ../sass/controls/_controls.scss */
 .slider .slot {
   -moz-border-radius: 2px;
   -webkit-border-radius: 2px;
@@ -2593,7 +2592,7 @@ label.checkbox.custom {
   right: 0;
   bottom: auto;
   left: 0; }
-/* line 416, ../sass/controls/_controls.scss */
+/* line 431, ../sass/controls/_controls.scss */
 .slider .knob {
   background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzUyNTI1MiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzQ1NDU0NSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
   background-size: 100%;
@@ -2622,7 +2621,7 @@ label.checkbox.custom {
   auto: 0;
   bottom: auto;
   left: auto; }
-  /* line 163, ../sass/_mixins.scss */
+  /* line 167, ../sass/_mixins.scss */
   .slider .knob:not(.disabled):hover {
     background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzYzNjM2MyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU3NTc1NyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
     background-size: 100%;
@@ -2631,13 +2630,13 @@ label.checkbox.custom {
     background-image: -webkit-linear-gradient(#636363, #575757);
     background-image: linear-gradient(#636363, #575757);
     color: #bdbdbd; }
-    /* line 166, ../sass/_mixins.scss */
+    /* line 170, ../sass/_mixins.scss */
     .slider .knob:not(.disabled):hover.btn-menu .invoke-menu {
       color: #878787; }
-  /* line 171, ../sass/_mixins.scss */
+  /* line 175, ../sass/_mixins.scss */
   .slider .knob.btn-menu .invoke-menu {
     color: #757575; }
-  /* line 187, ../sass/_mixins.scss */
+  /* line 191, ../sass/_mixins.scss */
   .slider .knob:before {
     -moz-transition-property: "border-color";
     -o-transition-property: "border-color";
@@ -2661,7 +2660,7 @@ label.checkbox.custom {
     left: 2px;
     bottom: 5px;
     top: 5px; }
-  /* line 209, ../sass/_mixins.scss */
+  /* line 213, ../sass/_mixins.scss */
   .slider .knob:not(.disabled):hover:before {
     -moz-transition-property: "border-color";
     -o-transition-property: "border-color";
@@ -2676,12 +2675,12 @@ label.checkbox.custom {
     -webkit-transition-timing-function: ease-in-out;
     transition-timing-function: ease-in-out;
     border-color: #0099cc; }
-  /* line 427, ../sass/controls/_controls.scss */
+  /* line 442, ../sass/controls/_controls.scss */
   .slider .knob:before {
     top: 1px;
     bottom: 3px;
     left: 5px; }
-/* line 434, ../sass/controls/_controls.scss */
+/* line 449, ../sass/controls/_controls.scss */
 .slider .range {
   background: rgba(0, 153, 204, 0.6);
   cursor: ew-resize;
@@ -2692,59 +2691,59 @@ label.checkbox.custom {
   left: auto;
   height: auto;
   width: auto; }
-  /* line 444, ../sass/controls/_controls.scss */
+  /* line 459, ../sass/controls/_controls.scss */
   .slider .range:hover {
     background: rgba(0, 153, 204, 0.7); }
 
 /******************************************************** BROWSER ELEMENTS */
-/* line 452, ../sass/controls/_controls.scss */
-::-webkit-scrollbar {
-  -moz-border-radius: 2px;
-  -webkit-border-radius: 2px;
-  border-radius: 2px;
-  -moz-box-sizing: border-box;
-  -webkit-box-sizing: border-box;
-  box-sizing: border-box;
-  -moz-box-shadow: inset rgba(0, 0, 0, 0.7) 0 1px 5px;
-  -webkit-box-shadow: inset rgba(0, 0, 0, 0.7) 0 1px 5px;
-  box-shadow: inset rgba(0, 0, 0, 0.7) 0 1px 5px;
-  background-color: rgba(0, 0, 0, 0.4);
-  border-bottom: 1px solid rgba(77, 77, 77, 0.4);
-  border-right: 1px solid rgba(77, 77, 77, 0.4);
-  height: 10px;
-  width: 10px; }
+@media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) {
+  /* line 468, ../sass/controls/_controls.scss */
+  ::-webkit-scrollbar {
+    -moz-border-radius: 2px;
+    -webkit-border-radius: 2px;
+    border-radius: 2px;
+    -moz-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    -moz-box-shadow: inset rgba(0, 0, 0, 0.7) 0 1px 5px;
+    -webkit-box-shadow: inset rgba(0, 0, 0, 0.7) 0 1px 5px;
+    box-shadow: inset rgba(0, 0, 0, 0.7) 0 1px 5px;
+    background-color: rgba(0, 0, 0, 0.4);
+    border-bottom: 1px solid rgba(77, 77, 77, 0.4);
+    border-right: 1px solid rgba(77, 77, 77, 0.4);
+    height: 10px;
+    width: 10px; }
 
-/* line 458, ../sass/controls/_controls.scss */
-::-webkit-scrollbar-thumb {
-  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU5NTk1OSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
-  background-size: 100%;
-  background-image: -webkit-gradient(linear, 50% 0%, 50% 20, color-stop(0%, #666666), color-stop(100%, #595959));
-  background-image: -moz-linear-gradient(#666666, #595959 20px);
-  background-image: -webkit-linear-gradient(#666666, #595959 20px);
-  background-image: linear-gradient(#666666, #595959 20px);
-  -moz-border-radius: 1px;
-  -webkit-border-radius: 1px;
-  border-radius: 1px;
-  -moz-box-sizing: border-box;
-  -webkit-box-sizing: border-box;
-  box-sizing: border-box;
-  -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
-  -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
-  box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
-  border-top: 1px solid gray; }
-  /* line 465, ../sass/controls/_controls.scss */
-  ::-webkit-scrollbar-thumb:hover {
-    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzgwODA4MCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzczNzM3MyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
+  /* line 474, ../sass/controls/_controls.scss */
+  ::-webkit-scrollbar-thumb {
+    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU5NTk1OSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
     background-size: 100%;
-    background-image: -webkit-gradient(linear, 50% 0%, 50% 20, color-stop(0%, #808080), color-stop(100%, #737373));
-    background-image: -moz-linear-gradient(#808080, #737373 20px);
-    background-image: -webkit-linear-gradient(#808080, #737373 20px);
-    background-image: linear-gradient(#808080, #737373 20px); }
-
-/* line 470, ../sass/controls/_controls.scss */
-::-webkit-scrollbar-corner {
-  background: rgba(0, 0, 0, 0.4); }
+    background-image: -webkit-gradient(linear, 50% 0%, 50% 20, color-stop(0%, #666666), color-stop(100%, #595959));
+    background-image: -moz-linear-gradient(#666666, #595959 20px);
+    background-image: -webkit-linear-gradient(#666666, #595959 20px);
+    background-image: linear-gradient(#666666, #595959 20px);
+    -moz-border-radius: 1px;
+    -webkit-border-radius: 1px;
+    border-radius: 1px;
+    -moz-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
+    -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
+    box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
+    border-top: 1px solid gray; }
+    /* line 481, ../sass/controls/_controls.scss */
+    ::-webkit-scrollbar-thumb:hover {
+      background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzgwODA4MCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzczNzM3MyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
+      background-size: 100%;
+      background-image: -webkit-gradient(linear, 50% 0%, 50% 20, color-stop(0%, #808080), color-stop(100%, #737373));
+      background-image: -moz-linear-gradient(#808080, #737373 20px);
+      background-image: -webkit-linear-gradient(#808080, #737373 20px);
+      background-image: linear-gradient(#808080, #737373 20px); }
 
+  /* line 486, ../sass/controls/_controls.scss */
+  ::-webkit-scrollbar-corner {
+    background: rgba(0, 0, 0, 0.4); } }
 /*****************************************************************************
  * Open MCT Web, Copyright (c) 2014-2015, United States Government
  * as represented by the Administrator of the National Aeronautics and Space
@@ -2833,14 +2832,14 @@ label.checkbox.custom {
     padding: 3px 0;
     position: absolute;
     z-index: 10; }
-    /* line 171, ../sass/_mixins.scss */
+    /* line 175, ../sass/_mixins.scss */
     .menu-element .menu.btn-menu .invoke-menu {
       color: #828282; }
     /* line 37, ../sass/controls/_menus.scss */
     .menu-element .menu ul {
       margin: 0;
       padding: 0; }
-      /* line 309, ../sass/_mixins.scss */
+      /* line 314, ../sass/_mixins.scss */
       .menu-element .menu ul li {
         list-style-type: none;
         margin: 0;
@@ -2892,7 +2891,7 @@ label.checkbox.custom {
     border-top: 1px solid #919191;
     color: #999;
     display: inline-block; }
-    /* line 171, ../sass/_mixins.scss */
+    /* line 175, ../sass/_mixins.scss */
     .menu-element .context-menu.btn-menu .invoke-menu, .menu-element .btn-menu.checkbox-menu .invoke-menu,
     .menu-element .super-menu.btn-menu .invoke-menu {
       color: #b0b0b0; }
@@ -3052,19 +3051,19 @@ label.checkbox.custom {
  * this source code distribution or the Licensing information page available
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
-/* line 25, ../sass/mobile/controls/_menus.scss */
-.mobile-menu-icon {
-  display: inline-block; }
-  @media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-    /* line 25, ../sass/mobile/controls/_menus.scss */
-    .mobile-menu-icon {
-      font-size: 21px;
-      padding-top: 1px; } }
-  @media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) {
-    /* line 25, ../sass/mobile/controls/_menus.scss */
-    .mobile-menu-icon {
+@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
+  /* line 26, ../sass/mobile/controls/_menus.scss */
+  .menu-element .super-menu {
+    width: 250px;
+    height: 250px; }
+    /* line 32, ../sass/mobile/controls/_menus.scss */
+    .menu-element .super-menu .pane.left {
+      border-right: none;
+      padding-right: 0;
+      width: 100%; }
+    /* line 37, ../sass/mobile/controls/_menus.scss */
+    .menu-element .super-menu .pane.right {
       display: none; } }
-
 /* line 1, ../sass/controls/_time-controller.scss */
 .l-time-controller {
   position: relative;
@@ -3518,35 +3517,34 @@ label.checkbox.custom {
  *****************************************************************************/
 /* line 22, ../sass/forms/_elems.scss */
 .section-header {
-  -moz-border-radius: 3px;
-  -webkit-border-radius: 3px;
-  border-radius: 3px;
+  -moz-border-radius: 2px;
+  -webkit-border-radius: 2px;
+  border-radius: 2px;
   background: rgba(255, 255, 255, 0.1);
+  color: #cccccc;
   font-size: 0.8em;
-  margin-top: 5px;
-  padding: 5px; }
-  /* line 28, ../sass/forms/_elems.scss */
-  .section-header:first-child {
-    margin-top: 0; }
+  padding: 5px 5px;
+  text-transform: uppercase; }
 
 /* line 35, ../sass/forms/_elems.scss */
 .form .form-section {
-  position: relative; }
-/* line 39, ../sass/forms/_elems.scss */
+  position: relative;
+  margin-bottom: 20px; }
+/* line 40, ../sass/forms/_elems.scss */
 .form .form-row {
   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
   overflow: hidden;
   *zoom: 1;
-  border-top: 1px solid #4d4d4d;
+  border-top: 1px solid rgba(255, 255, 255, 0.1);
   margin-top: 5px;
-  padding: 5px;
+  padding: 5px 5px;
   position: relative; }
-  /* line 46, ../sass/forms/_elems.scss */
+  /* line 48, ../sass/forms/_elems.scss */
   .form .form-row.first {
     border-top: none; }
-  /* line 50, ../sass/forms/_elems.scss */
+  /* line 52, ../sass/forms/_elems.scss */
   .form .form-row .label,
   .form .form-row .controls {
     -moz-box-sizing: border-box;
@@ -3554,45 +3552,45 @@ label.checkbox.custom {
     box-sizing: border-box;
     overflow: hidden;
     *zoom: 1;
-    box-sizing: border-box;
-    font-size: 0.75rem;
+    font-size: 0.8rem;
     line-height: 22px;
     min-height: 22px; }
   /* line 61, ../sass/forms/_elems.scss */
   .form .form-row > .label {
     float: left;
+    min-width: 120px;
     position: relative;
     white-space: nowrap;
-    width: 20%; }
-  /* line 69, ../sass/forms/_elems.scss */
+    width: 30%; }
+  /* line 71, ../sass/forms/_elems.scss */
   .form .form-row .value {
     color: #cccccc; }
-  /* line 73, ../sass/forms/_elems.scss */
+  /* line 75, ../sass/forms/_elems.scss */
   .form .form-row .controls {
     float: left;
     position: relative;
-    width: 79.9%; }
-    /* line 80, ../sass/forms/_elems.scss */
+    width: 69.9%; }
+    /* line 82, ../sass/forms/_elems.scss */
     .form .form-row .controls .l-composite-control.l-checkbox {
       display: inline-block;
       line-height: 14px;
       margin-right: 5px; }
-    /* line 89, ../sass/forms/_elems.scss */
+    /* line 91, ../sass/forms/_elems.scss */
     .form .form-row .controls .l-med input[type="text"] {
       width: 200px; }
-    /* line 93, ../sass/forms/_elems.scss */
+    /* line 95, ../sass/forms/_elems.scss */
     .form .form-row .controls .l-small input[type="text"] {
       width: 50px; }
-    /* line 97, ../sass/forms/_elems.scss */
+    /* line 99, ../sass/forms/_elems.scss */
     .form .form-row .controls .l-numeric input[type="text"] {
       text-align: right; }
-    /* line 101, ../sass/forms/_elems.scss */
+    /* line 103, ../sass/forms/_elems.scss */
     .form .form-row .controls .select {
       margin-right: 5px; }
-  /* line 106, ../sass/forms/_elems.scss */
+  /* line 108, ../sass/forms/_elems.scss */
   .form .form-row .field-hints {
     color: #666666; }
-  /* line 110, ../sass/forms/_elems.scss */
+  /* line 112, ../sass/forms/_elems.scss */
   .form .form-row .selector-list {
     -moz-border-radius: 2px;
     -webkit-border-radius: 2px;
@@ -3605,7 +3603,7 @@ label.checkbox.custom {
     position: relative;
     height: 150px;
     overflow: auto; }
-    /* line 121, ../sass/forms/_elems.scss */
+    /* line 123, ../sass/forms/_elems.scss */
     .form .form-row .selector-list .wrapper {
       overflow-y: auto;
       position: absolute;
@@ -3614,24 +3612,24 @@ label.checkbox.custom {
       bottom: 5px;
       left: 5px; }
 
-/* line 135, ../sass/forms/_elems.scss */
+/* line 137, ../sass/forms/_elems.scss */
 label.form-control.checkbox input {
   margin-right: 5px;
   vertical-align: top; }
 
-/* line 141, ../sass/forms/_elems.scss */
+/* line 143, ../sass/forms/_elems.scss */
 .hint,
 .s-hint {
   font-size: 0.9em; }
 
-/* line 146, ../sass/forms/_elems.scss */
+/* line 148, ../sass/forms/_elems.scss */
 .l-result {
   display: inline-block;
   min-width: 32px;
   min-height: 32px;
   position: relative;
   vertical-align: top; }
-  /* line 153, ../sass/forms/_elems.scss */
+  /* line 155, ../sass/forms/_elems.scss */
   .l-result div.s-hint {
     -moz-border-radius: 2px;
     -webkit-border-radius: 2px;
@@ -3667,18 +3665,16 @@ label.form-control.checkbox input {
   padding-right: 25px; }
   /* line 26, ../sass/forms/_validation.scss */
   .validates > .label::after {
-    display: block;
-    position: absolute;
-    top: 0;
-    right: 10px;
-    bottom: 0;
-    left: auto;
-    height: auto;
-    width: 15px;
+    /*            display: block;
+                position: absolute;
+                top: 0;
+                right: $reqSymbolM;
+                bottom: 0;
+                left: auto;
+                height: auto;
+                width: $reqSymbolW;*/
     font-family: symbolsfont;
-    font-size: 0.7em;
-    text-align: right;
-    vertical-align: middle; }
+    font-size: 0.7em; }
 /* line 44, ../sass/forms/_validation.scss */
 .validates.invalid > .label::after, .validates.invalid.req > .label::after {
   color: #ff9900;
@@ -3739,7 +3735,7 @@ input[type="text"] {
   color: #cccccc;
   outline: none;
   padding: 0 3px; }
-  /* line 275, ../sass/_mixins.scss */
+  /* line 280, ../sass/_mixins.scss */
   input[type="text"].error {
     background: rgba(255, 0, 0, 0.5); }
   /* line 29, ../sass/forms/_text-input.scss */
@@ -3793,7 +3789,7 @@ input[type="text"] {
   margin: 0 0 2px 2px;
   overflow: hidden;
   position: relative; }
-  /* line 163, ../sass/_mixins.scss */
+  /* line 167, ../sass/_mixins.scss */
   .form-control.select:not(.disabled):hover {
     background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzYzNjM2MyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU3NTc1NyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
     background-size: 100%;
@@ -3802,10 +3798,10 @@ input[type="text"] {
     background-image: -webkit-linear-gradient(#636363, #575757);
     background-image: linear-gradient(#636363, #575757);
     color: #bdbdbd; }
-    /* line 166, ../sass/_mixins.scss */
+    /* line 170, ../sass/_mixins.scss */
     .form-control.select:not(.disabled):hover.btn-menu .invoke-menu {
       color: #878787; }
-  /* line 171, ../sass/_mixins.scss */
+  /* line 175, ../sass/_mixins.scss */
   .form-control.select.btn-menu .invoke-menu {
     color: #757575; }
   /* line 29, ../sass/forms/_selects.scss */
@@ -3884,7 +3880,7 @@ input[type="text"] {
   max-height: 400px;
   overflow: auto;
   padding: 5px; }
-  /* line 275, ../sass/_mixins.scss */
+  /* line 280, ../sass/_mixins.scss */
   .channel-selector .treeview.error {
     background: rgba(255, 0, 0, 0.5); }
 /* line 36, ../sass/forms/_channel-selector.scss */
@@ -3984,7 +3980,7 @@ input[type="text"] {
   padding: 0 3px;
   background: #3b3b3b;
   border-bottom: 1px solid #4d4d4d; }
-  /* line 275, ../sass/_mixins.scss */
+  /* line 280, ../sass/_mixins.scss */
   .filter input.filter.error,
   .filter input.t-filter-input.error,
   .t-filter input.filter.error,
@@ -4380,19 +4376,14 @@ input[type="text"] {
   background: rgba(0, 0, 0, 0.7);
   z-index: 100; }
 /* line 27, ../sass/overlay/_overlay.scss */
-.overlay .btn.close {
-  -moz-border-radius: 4px;
-  -webkit-border-radius: 4px;
-  border-radius: 4px;
-  padding: 3px 6px;
+.overlay .clk-icon.close {
   position: absolute;
-  border: none;
-  top: 3px;
-  right: 3px;
+  top: 10px;
+  right: 10px;
   bottom: auto;
   left: auto;
   z-index: 100; }
-/* line 38, ../sass/overlay/_overlay.scss */
+/* line 32, ../sass/overlay/_overlay.scss */
 .overlay > .holder {
   background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzUyNTI1MiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzQ1NDU0NSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
   background-size: 100%;
@@ -4422,32 +4413,32 @@ input[type="text"] {
   bottom: 15%;
   left: 15%;
   z-index: 101; }
-  /* line 171, ../sass/_mixins.scss */
+  /* line 175, ../sass/_mixins.scss */
   .overlay > .holder.btn-menu .invoke-menu {
     color: #757575; }
-  /* line 45, ../sass/overlay/_overlay.scss */
+  /* line 39, ../sass/overlay/_overlay.scss */
   .overlay > .holder > .contents {
     top: 25px;
     right: 25px;
     bottom: 25px;
     left: 25px; }
-/* line 50, ../sass/overlay/_overlay.scss */
+/* line 44, ../sass/overlay/_overlay.scss */
 .overlay .title {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-  font-size: 1.3em;
+  font-size: 1.2em;
   margin-bottom: 5px; }
-/* line 56, ../sass/overlay/_overlay.scss */
+/* line 50, ../sass/overlay/_overlay.scss */
 .overlay .top-bar {
   height: 60px; }
-/* line 60, ../sass/overlay/_overlay.scss */
+/* line 54, ../sass/overlay/_overlay.scss */
 .overlay .editor {
   top: 70px;
   bottom: 50px;
   left: 0;
   right: 0; }
-/* line 66, ../sass/overlay/_overlay.scss */
+/* line 60, ../sass/overlay/_overlay.scss */
 .overlay .bottom-bar {
   top: auto;
   right: 0;
@@ -4456,10 +4447,10 @@ input[type="text"] {
   overflow: visible;
   height: 40px;
   text-align: right; }
-  /* line 72, ../sass/overlay/_overlay.scss */
+  /* line 66, ../sass/overlay/_overlay.scss */
   .overlay .bottom-bar .btn {
     margin-left: 10px; }
-/* line 76, ../sass/overlay/_overlay.scss */
+/* line 70, ../sass/overlay/_overlay.scss */
 .overlay .contents.l-dialog {
   top: 5px;
   right: 5px;
@@ -4468,7 +4459,11 @@ input[type="text"] {
   overflow: auto; }
 
 @media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 6, ../sass/mobile/overlay/_overlay.scss */
+  /* line 4, ../sass/mobile/overlay/_overlay.scss */
+  .overlay .clk-icon.close {
+    top: 10px;
+    right: 10px; }
+  /* line 8, ../sass/mobile/overlay/_overlay.scss */
   .overlay > .holder {
     -moz-border-radius: 0;
     -webkit-border-radius: 0;
@@ -4476,8 +4471,32 @@ input[type="text"] {
     top: 0;
     right: 0;
     bottom: 0;
-    left: 0; } }
-
+    left: 0; }
+    /* line 14, ../sass/mobile/overlay/_overlay.scss */
+    .overlay > .holder > .contents {
+      top: 10px;
+      right: 10px;
+      bottom: 10px;
+      left: 10px; }
+      /* line 21, ../sass/mobile/overlay/_overlay.scss */
+      .overlay > .holder > .contents .top-bar > .title {
+        margin-right: 1.2em; }
+      /* line 26, ../sass/mobile/overlay/_overlay.scss */
+      .overlay > .holder > .contents .form.editor {
+        border: none; }
+        /* line 29, ../sass/mobile/overlay/_overlay.scss */
+        .overlay > .holder > .contents .form.editor .contents {
+          top: 0;
+          right: 0;
+          bottom: 0;
+          left: 0; } }
+@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px) {
+  /* line 43, ../sass/mobile/overlay/_overlay.scss */
+  .overlay > .holder > .contents .form.editor .contents .form-row > .label,
+  .overlay > .holder > .contents .form.editor .contents .form-row > .controls {
+    display: block;
+    float: none;
+    width: 100%; } }
 /*****************************************************************************
  * Open MCT Web, Copyright (c) 2014-2015, United States Government
  * as represented by the Administrator of the National Aeronautics and Space
@@ -4506,27 +4525,32 @@ input[type="text"] {
   /* line 28, ../sass/user-environ/_frame.scss */
   .frame.child-frame.panel:hover {
     border-color: #666666; }
-/* line 36, ../sass/user-environ/_frame.scss */
+/* line 32, ../sass/user-environ/_frame.scss */
 .frame > .object-header.abs, .btn-menu .frame > span.object-header.l-click-area {
   font-size: 0.75em;
-  height: 20px; }
-/* line 40, ../sass/user-environ/_frame.scss */
+  height: 16px;
+  line-height: 16px; }
+/* line 38, ../sass/user-environ/_frame.scss */
 .frame > .object-holder.abs, .btn-menu .frame > span.object-holder.l-click-area {
-  top: 23px; }
-/* line 43, ../sass/user-environ/_frame.scss */
+  top: 21px; }
+/* line 41, ../sass/user-environ/_frame.scss */
 .frame .contents {
   top: 5px;
   right: 5px;
   bottom: 5px;
   left: 5px; }
-/* line 53, ../sass/user-environ/_frame.scss */
+/* line 49, ../sass/user-environ/_frame.scss */
 .frame.frame-template .view-switcher {
-  opacity: 0;
+  line-height: 16px;
   z-index: 10; }
-/* line 57, ../sass/user-environ/_frame.scss */
-.frame.frame-template:hover .view-switcher {
-  opacity: 1; }
-/* line 65, ../sass/user-environ/_frame.scss */
+@media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) {
+  /* line 56, ../sass/user-environ/_frame.scss */
+  .frame.frame-template .view-switcher {
+    opacity: 0; }
+  /* line 59, ../sass/user-environ/_frame.scss */
+  .frame.frame-template:hover .view-switcher {
+    opacity: 1; } }
+/* line 67, ../sass/user-environ/_frame.scss */
 .frame .view-switcher .name {
   display: none; }
 
@@ -4551,30 +4575,28 @@ input[type="text"] {
  * this source code distribution or the Licensing information page available
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
-/* line 27, ../sass/user-environ/_top-bar.scss */
+/* line 23, ../sass/user-environ/_top-bar.scss */
 .top-bar.browse, .top-bar.edit {
   border-bottom: 1px solid #4d4d4d;
   top: 10px;
   right: 10px;
   bottom: auto;
   left: 10px;
-  height: 30px; }
-/* line 37, ../sass/user-environ/_top-bar.scss */
+  height: 30px;
+  line-height: 24px; }
+/* line 31, ../sass/user-environ/_top-bar.scss */
 .top-bar .title {
   color: #fff; }
-/* line 42, ../sass/user-environ/_top-bar.scss */
+/* line 35, ../sass/user-environ/_top-bar.scss */
 .top-bar .buttons-main {
   font-size: 0.8em;
   left: auto;
   text-align: right; }
-  /* line 47, ../sass/user-environ/_top-bar.scss */
-  .top-bar .buttons-main .btn {
-    margin-left: 5px; }
 
-/* line 55, ../sass/user-environ/_top-bar.scss */
+/* line 48, ../sass/user-environ/_top-bar.scss */
 .edit-mode .top-bar .buttons-main {
   white-space: nowrap; }
-  /* line 59, ../sass/user-environ/_top-bar.scss */
+  /* line 52, ../sass/user-environ/_top-bar.scss */
   .edit-mode .top-bar .buttons-main.abs, .edit-mode .top-bar .btn-menu span.buttons-main.l-click-area, .btn-menu .edit-mode .top-bar span.buttons-main.l-click-area {
     bottom: auto;
     left: auto; }
@@ -4682,11 +4704,28 @@ input[type="text"] {
  *****************************************************************************/
 /* line 22, ../sass/user-environ/_object-browse.scss */
 .object-browse-bar {
+  overflow: visible;
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  width: auto;
+  height: auto;
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
   height: 24px;
-  line-height: 24px; }
-  /* line 26, ../sass/user-environ/_object-browse.scss */
-  .object-browse-bar .items-select .btn-menu {
-    margin-right: 15px; }
+  line-height: 24px;
+  white-space: nowrap; }
+  /* line 30, ../sass/user-environ/_object-browse.scss */
+  .object-browse-bar .left {
+    padding-right: 5px; }
+    /* line 32, ../sass/user-environ/_object-browse.scss */
+    .object-browse-bar .left .l-back {
+      display: inline-block;
+      float: left;
+      margin-right: 10px; }
 
 /*****************************************************************************
  * Open MCT Web, Copyright (c) 2014-2015, United States Government
@@ -4954,7 +4993,7 @@ input[type="text"] {
     right: 0;
     width: auto;
     height: 5px; }
-    /* line 187, ../sass/_mixins.scss */
+    /* line 191, ../sass/_mixins.scss */
     .split-layout.horizontal > .splitter:before {
       -moz-transition-property: "border-color";
       -o-transition-property: "border-color";
@@ -4978,7 +5017,7 @@ input[type="text"] {
       top: 2px;
       left: 5px;
       right: 5px; }
-    /* line 209, ../sass/_mixins.scss */
+    /* line 213, ../sass/_mixins.scss */
     .split-layout.horizontal > .splitter:not(.disabled):hover:before {
       -moz-transition-property: "border-color";
       -o-transition-property: "border-color";
@@ -5008,7 +5047,7 @@ input[type="text"] {
   bottom: 0;
   cursor: col-resize;
   width: 5px; }
-  /* line 187, ../sass/_mixins.scss */
+  /* line 191, ../sass/_mixins.scss */
   .split-layout.vertical > .splitter:before {
     -moz-transition-property: "border-color";
     -o-transition-property: "border-color";
@@ -5032,7 +5071,7 @@ input[type="text"] {
     left: 2px;
     bottom: 5px;
     top: 5px; }
-  /* line 209, ../sass/_mixins.scss */
+  /* line 213, ../sass/_mixins.scss */
   .split-layout.vertical > .splitter:not(.disabled):hover:before {
     -moz-transition-property: "border-color";
     -o-transition-property: "border-color";
diff --git a/platform/commonUI/general/res/css/tree.css b/platform/commonUI/general/res/css/tree.css
index 8df0158358..9bf108bc36 100644
--- a/platform/commonUI/general/res/css/tree.css
+++ b/platform/commonUI/general/res/css/tree.css
@@ -69,6 +69,7 @@
  * this source code distribution or the Licensing information page available
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
+/************************** STYLE */
 /************************** MOBILE REPRESENTATION ITEMS DIMENSIONS */
 /************************** MOBILE TREE MENU DIMENSIONS */
 /************************** WINDOW DIMENSIONS FOR RWD */
@@ -152,7 +153,7 @@
 ul.tree {
   margin: 0;
   padding: 0; }
-  /* line 309, ../sass/_mixins.scss */
+  /* line 314, ../sass/_mixins.scss */
   ul.tree li {
     list-style-type: none;
     margin: 0;
@@ -163,6 +164,9 @@ ul.tree {
     position: relative; }
     /* line 28, ../sass/tree/_tree.scss */
     ul.tree li span.tree-item {
+      -moz-box-sizing: border-box;
+      -webkit-box-sizing: border-box;
+      box-sizing: border-box;
       -moz-border-radius: 2px;
       -webkit-border-radius: 2px;
       border-radius: 2px;
@@ -176,17 +180,17 @@ ul.tree {
       line-height: 1.5rem;
       margin-bottom: 3px;
       position: relative; }
-      /* line 39, ../sass/tree/_tree.scss */
+      /* line 40, ../sass/tree/_tree.scss */
       ul.tree li span.tree-item .view-control {
         display: inline-block;
         margin-left: 5px;
         font-size: 0.75em;
         width: 10px; }
         @media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) {
-          /* line 47, ../sass/tree/_tree.scss */
+          /* line 48, ../sass/tree/_tree.scss */
           ul.tree li span.tree-item .view-control:hover {
             color: #ffc700; } }
-      /* line 53, ../sass/tree/_tree.scss */
+      /* line 54, ../sass/tree/_tree.scss */
       ul.tree li span.tree-item .label {
         display: block;
         overflow: hidden;
@@ -197,28 +201,27 @@ ul.tree {
         left: 0px;
         width: auto;
         height: auto;
+        line-height: 1.5rem;
         left: 15px; }
-        /* line 60, ../sass/tree/_tree.scss */
+        /* line 62, ../sass/tree/_tree.scss */
         ul.tree li span.tree-item .label .type-icon {
-          overflow: false;
-          position: absolute;
-          top: 0;
-          right: 0;
-          bottom: 0;
-          left: 0;
-          width: auto;
-          height: auto;
           text-shadow: rgba(0, 0, 0, 0.6) 0 1px 2px;
+          font-size: 16px;
           color: #0099cc;
           left: 5px;
+          position: absolute;
+          top: 4px;
+          bottom: auto;
+          height: 16px;
+          line-height: 100%;
           right: auto;
-          width: 1em; }
-          /* line 68, ../sass/tree/_tree.scss */
+          width: 16px; }
+          /* line 75, ../sass/tree/_tree.scss */
           ul.tree li span.tree-item .label .type-icon .icon.l-icon-link, ul.tree li span.tree-item .label .type-icon .icon.l-icon-alert {
             text-shadow: black 0 1px 2px;
             position: absolute;
             z-index: 2; }
-          /* line 74, ../sass/tree/_tree.scss */
+          /* line 81, ../sass/tree/_tree.scss */
           ul.tree li span.tree-item .label .type-icon .icon.l-icon-alert {
             color: #ff3c00;
             font-size: 8px;
@@ -227,7 +230,7 @@ ul.tree {
             width: 8px;
             top: 1px;
             right: -2px; }
-          /* line 80, ../sass/tree/_tree.scss */
+          /* line 87, ../sass/tree/_tree.scss */
           ul.tree li span.tree-item .label .type-icon .icon.l-icon-link {
             color: #49dedb;
             font-size: 8px;
@@ -235,8 +238,8 @@ ul.tree {
             height: 8px;
             width: 8px;
             left: -3px;
-            bottom: 5px; }
-        /* line 89, ../sass/tree/_tree.scss */
+            bottom: 0px; }
+        /* line 95, ../sass/tree/_tree.scss */
         ul.tree li span.tree-item .label .title-label {
           overflow: hidden;
           position: absolute;
@@ -251,53 +254,53 @@ ul.tree {
           overflow: hidden;
           text-overflow: ellipsis;
           white-space: nowrap; }
-      /* line 100, ../sass/tree/_tree.scss */
+      /* line 106, ../sass/tree/_tree.scss */
       ul.tree li span.tree-item.loading {
         pointer-events: none; }
-        /* line 102, ../sass/tree/_tree.scss */
+        /* line 108, ../sass/tree/_tree.scss */
         ul.tree li span.tree-item.loading .label {
           opacity: 0.5; }
-          /* line 104, ../sass/tree/_tree.scss */
+          /* line 110, ../sass/tree/_tree.scss */
           ul.tree li span.tree-item.loading .label .title-label {
             font-style: italic; }
-        /* line 108, ../sass/tree/_tree.scss */
+        /* line 114, ../sass/tree/_tree.scss */
         ul.tree li span.tree-item.loading .wait-spinner {
           margin-left: 14px; }
-      /* line 113, ../sass/tree/_tree.scss */
+      /* line 119, ../sass/tree/_tree.scss */
       ul.tree li span.tree-item.selected {
         background: #005177;
         color: #fff; }
-        /* line 117, ../sass/tree/_tree.scss */
+        /* line 123, ../sass/tree/_tree.scss */
         ul.tree li span.tree-item.selected .view-control {
           color: #0099cc; }
-        /* line 120, ../sass/tree/_tree.scss */
+        /* line 126, ../sass/tree/_tree.scss */
         ul.tree li span.tree-item.selected .label .type-icon {
           color: #fff; }
       @media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) {
-        /* line 128, ../sass/tree/_tree.scss */
+        /* line 134, ../sass/tree/_tree.scss */
         ul.tree li span.tree-item:not(.selected):hover {
-          background: #404040;
+          background: rgba(255, 255, 255, 0.1);
           color: #cccccc; }
-          /* line 131, ../sass/tree/_tree.scss */
+          /* line 137, ../sass/tree/_tree.scss */
           ul.tree li span.tree-item:not(.selected):hover .context-trigger {
             display: block; }
-          /* line 134, ../sass/tree/_tree.scss */
+          /* line 140, ../sass/tree/_tree.scss */
           ul.tree li span.tree-item:not(.selected):hover .icon {
             color: #33ccff; } }
-      /* line 141, ../sass/tree/_tree.scss */
+      /* line 147, ../sass/tree/_tree.scss */
       ul.tree li span.tree-item:not(.loading) {
         cursor: pointer; }
-      /* line 145, ../sass/tree/_tree.scss */
+      /* line 151, ../sass/tree/_tree.scss */
       ul.tree li span.tree-item .context-trigger {
         top: -1px;
         position: absolute;
         right: 3px; }
-        /* line 151, ../sass/tree/_tree.scss */
+        /* line 157, ../sass/tree/_tree.scss */
         ul.tree li span.tree-item .context-trigger .invoke-menu {
           font-size: 0.75em;
           height: 0.9rem;
           line-height: 0.9rem; }
-  /* line 160, ../sass/tree/_tree.scss */
+  /* line 166, ../sass/tree/_tree.scss */
   ul.tree ul.tree {
     margin-left: 15px; }
 
@@ -569,38 +572,28 @@ ul.tree {
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 @media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 24, ../sass/mobile/_tree.scss */
-  ul.tree {
-    margin: 0;
-    padding: 0; }
-    /* line 309, ../sass/_mixins.scss */
-    ul.tree li {
-      list-style-type: none;
-      margin: 0;
-      padding: 0; }
-    /* line 29, ../sass/mobile/_tree.scss */
-    ul.tree li span.tree-item {
-      height: 38px;
-      line-height: 38px;
-      padding-top: 3px;
-      padding-bottom: 3px;
-      margin-bottom: 0px; }
-      /* line 36, ../sass/mobile/_tree.scss */
-      ul.tree li span.tree-item .view-control {
-        position: absolute;
-        right: 13px;
-        font-size: 1.8em;
-        right: 0px;
-        width: 35px;
-        text-align: center; }
-      /* line 45, ../sass/mobile/_tree.scss */
-      ul.tree li span.tree-item .label {
-        left: 3px;
-        right: 45px;
-        font-size: 1.2em; }
-        /* line 54, ../sass/mobile/_tree.scss */
-        ul.tree li span.tree-item .label .title-label {
-          right: 16.9px; }
-    /* line 63, ../sass/mobile/_tree.scss */
-    ul.tree ul.tree {
-      margin-left: 7px; } }
+  /* line 28, ../sass/mobile/_tree.scss */
+  ul.tree li span.tree-item {
+    height: 35px;
+    line-height: 35px;
+    margin-bottom: 0px; }
+    /* line 32, ../sass/mobile/_tree.scss */
+    ul.tree li span.tree-item .view-control {
+      position: absolute;
+      font-size: 1.1em;
+      right: 0px;
+      width: 30px;
+      text-align: center; }
+    /* line 41, ../sass/mobile/_tree.scss */
+    ul.tree li span.tree-item .label {
+      left: 0;
+      right: 35px;
+      line-height: 35px; }
+      /* line 46, ../sass/mobile/_tree.scss */
+      ul.tree li span.tree-item .label .type-icon {
+        top: 9px;
+        bottom: auto;
+        height: 16px; }
+  /* line 57, ../sass/mobile/_tree.scss */
+  ul.tree ul.tree {
+    margin-left: 20px; } }
diff --git a/platform/commonUI/general/res/fonts/symbols/wtdsymbols.eot b/platform/commonUI/general/res/fonts/symbols/wtdsymbols.eot
index 3087b1c7a5..aaab92d345 100755
Binary files a/platform/commonUI/general/res/fonts/symbols/wtdsymbols.eot and b/platform/commonUI/general/res/fonts/symbols/wtdsymbols.eot differ
diff --git a/platform/commonUI/general/res/fonts/symbols/wtdsymbols.svg b/platform/commonUI/general/res/fonts/symbols/wtdsymbols.svg
index 6d9fbdd714..a6f2bae8ea 100755
--- a/platform/commonUI/general/res/fonts/symbols/wtdsymbols.svg
+++ b/platform/commonUI/general/res/fonts/symbols/wtdsymbols.svg
@@ -83,7 +83,8 @@
 <glyph unicode="&#xe604;" glyph-name="icon-tabular" d="M0 896v-192h448v256h-384c-35.2 0-64-28.8-64-64zM960 960h-384v-256h448v192c0 35.2-28.8 64-64 64zM576 576h448v-256h-448v256zM0 576h448v-256h-448v256zM0 0c0-35.2 28.8-64 64-64h384v256h-448v-192zM576-64h384c35.2 0 64 28.8 64 64v192h-448v-256z" />
 <glyph unicode="&#xe605;" glyph-name="icon-calendar" d="M896 960h-768c-70.4 0-128-57.6-128-128v-768c0-70.4 57.6-128 128-128h768c70.4 0 128 57.6 128 128v768c0 70.4-57.6 128-128 128zM640 512h-256v192h256v-192zM384 448h256v-192h-256v192zM320 256h-256v192h256v-192zM320 704v-192h-256v192h256zM128 0c-17 0-33 6.6-45.2 18.8s-18.8 28.2-18.8 45.2v128h256v-192h-192zM384 0v192h256v-192h-256zM960 64c0-17-6.6-33-18.8-45.2s-28.2-18.8-45.2-18.8h-192v192h256v-128zM960 256h-256v192h256v-192zM960 512h-256v192h256v-192z" />
 <glyph unicode="&#xe606;" glyph-name="icon-paint-bucket" d="M896 320c0 0-130-188-128-256 2-70.6 57.4-128 128-128s126 57.4 128 128c2 68-128 256-128 256zM449 831l0.2 64.8c0 35.4-28.4 64-63.8 64.2 0 0-0.2 0-0.2 0-35.2 0-63.8-28.6-64-63.8l-0.6-190.8-294-292.6c-50-50-12.4-215.2 112.4-340s290-162.4 340-112.4l417 423.6-447 447zM384 320c-70.6 0-128 57.4-128 128 0 47.4 25.8 89 64.4 111l-0.4-110.8c0-35.4 28.4-64 63.8-64.2 0 0 0.2 0 0.2 0 35.2 0 63.8 28.6 64 63.8l0.4 110.8c38-22.2 63.6-63.4 63.6-110.6 0-70.6-57.4-128-128-128z" />
-<glyph unicode="&#xe607;" glyph-name="icon-x-in-circle" d="M512 960c-282.8 0-512-229.2-512-512s229.2-512 512-512 512 229.2 512 512-229.2 512-512 512zM832 256l-128-128-192 192-192-192-128 128 192 192-192 192 128 128 192-192 192 192 128-128-192-192 192-192z" />
+<glyph unicode="&#xe607;" glyph-name="icon-x-in-circle-heavy" d="M512 960c-282.8 0-512-229.2-512-512s229.2-512 512-512 512 229.2 512 512-229.2 512-512 512zM832 256l-128-128-192 192-192-192-128 128 192 192-192 192 128 128 192-192 192 192 128-128-192-192 192-192z" />
+<glyph unicode="&#xe608;" glyph-name="icon-info" d="M512 960c-282.8 0-512-229.2-512-512s229.2-512 512-512 512 229.2 512 512-229.2 512-512 512zM512 832c70.6 0 128-57.4 128-128s-57.4-128-128-128c-70.6 0-128 57.4-128 128s57.4 128 128 128zM704 128h-384v128h128v128h-128v128h320v-256h64v-128z" />
 <glyph unicode="&#xe60d;" glyph-name="icon-arrows-right-left" d="M1024 448l-448-512v1024zM448 960l-448-512 448-512z" />
 <glyph unicode="&#xe642;" glyph-name="icon-x" d="M384 448l-365.332-365.332c-24.89-24.89-24.89-65.62 0-90.51l37.49-37.49c24.89-24.89 65.62-24.89 90.51 0 0 0 365.332 365.332 365.332 365.332l365.332-365.332c24.89-24.89 65.62-24.89 90.51 0l37.49 37.49c24.89 24.89 24.89 65.62 0 90.51l-365.332 365.332c0 0 365.332 365.332 365.332 365.332 24.89 24.89 24.89 65.62 0 90.51l-37.49 37.49c-24.89 24.89-65.62 24.89-90.51 0 0 0-365.332-365.332-365.332-365.332l-365.332 365.332c-24.89 24.89-65.62 24.89-90.51 0l-37.49-37.49c-24.89-24.89-24.89-65.62 0-90.51 0 0 365.332-365.332 365.332-365.332z" />
 </font></defs></svg>
\ No newline at end of file
diff --git a/platform/commonUI/general/res/fonts/symbols/wtdsymbols.ttf b/platform/commonUI/general/res/fonts/symbols/wtdsymbols.ttf
index a2a5aa3bfd..f6cf40ef12 100755
Binary files a/platform/commonUI/general/res/fonts/symbols/wtdsymbols.ttf and b/platform/commonUI/general/res/fonts/symbols/wtdsymbols.ttf differ
diff --git a/platform/commonUI/general/res/fonts/symbols/wtdsymbols.woff b/platform/commonUI/general/res/fonts/symbols/wtdsymbols.woff
index fba91366e9..aaf58a7f76 100755
Binary files a/platform/commonUI/general/res/fonts/symbols/wtdsymbols.woff and b/platform/commonUI/general/res/fonts/symbols/wtdsymbols.woff differ
diff --git a/platform/commonUI/general/res/sass/_constants.scss b/platform/commonUI/general/res/sass/_constants.scss
index 66a9b08626..87583ecdf1 100644
--- a/platform/commonUI/general/res/sass/_constants.scss
+++ b/platform/commonUI/general/res/sass/_constants.scss
@@ -47,6 +47,8 @@ $colorPausedBg: #c56f01;
 $colorPausedFg: #fff;
 $colorCreateBtn: $colorKey;
 $colorGridLines: rgba(#fff, 0.05);
+$colorFormLines: rgba(#fff, 0.1);
+$colorFormSectionHeader: rgba(#000, 0.2);
 // Menu colors
 $colorMenuBg: lighten($colorBodyBg, 23%);
 $colorMenuFg: lighten($colorMenuBg, 70%);
@@ -104,6 +106,7 @@ $treeSearchInputBarH: 25px;
 // Overlay
 $ovrTopBarH: 60px;
 $ovrFooterH: 40px;
+$overlayMargin: 25px;
 // Items
 $ueBrowseGridItemLg: 200px;
 $ueBrowseGridItemTopBarH: 20px;
@@ -111,6 +114,7 @@ $ueBrowseGridItemBottomBarH: 30px;
 $itemPadLR: 5px;
 // Tree
 $treeVCW: 10px;
+$treeTypeIconH: 16px;
 $treeTypeIconW: 20px;
 $treeContextTriggerW: 20px;
 $colorItemTreeIcon: $colorKey;
@@ -144,10 +148,13 @@ $reqSymbolFontSize: 0.7em;
 
 /************************** CONTROLS */
 $controlDisabledOpacity: 0.3;
-$formLabelW: 20%;
+$formLabelW: 30%;
 $formInputH: 22px;
 $formRowCtrlsH: 14px;
+$formTBPad: $interiorMargin;
+$formLRPad: $interiorMargin;
 $menuLineH: 1.5rem;
+$menuLineHPx: 24px;
 $scrollbarTrackSize: 10px;
 $scrollbarTrackColorBg: rgba(#000, 0.4);
 $btnStdH: 25px;
diff --git a/platform/commonUI/general/res/sass/_flex.scss b/platform/commonUI/general/res/sass/_flex.scss
new file mode 100644
index 0000000000..61e8007676
--- /dev/null
+++ b/platform/commonUI/general/res/sass/_flex.scss
@@ -0,0 +1,37 @@
+.l-flex {
+    &.l-flex-justify {
+        justify-content: space-between;
+    }
+    .l-flex-row,
+    &.l-flex-row {
+        display: flex;
+        flex-flow: row nowrap;
+        div, span {
+            //@include tmpBorder();
+        }
+        > div, > span {
+            //flex: 1 1 0;
+        }
+    }
+    .l-flex-max {
+        flex: 1 0 !important;
+    }
+
+    .flex-ignore {
+        display: flex;
+        flex-flow: row nowrap;
+        flex: 0 1 auto;
+    }
+}
+
+// TEMP, move out of here once working
+.object-browse-bar.bar > div.abs {
+    @include test(green);
+}
+
+
+.l-flex-row .title-label {
+    @include test(blue);
+    flex: 1 0 !important;
+}
+
diff --git a/platform/commonUI/general/res/sass/_global.scss b/platform/commonUI/general/res/sass/_global.scss
index 94fe8e151c..a6b8ff63c8 100644
--- a/platform/commonUI/general/res/sass/_global.scss
+++ b/platform/commonUI/general/res/sass/_global.scss
@@ -71,12 +71,6 @@ p {
 	margin-bottom: $interiorMarginLg;
 }
 
-span {
-	/* 618 DEBUG
-	box-sizing: border-box;
-	*/
-}
-
 mct-container {
 	display: block;
 }
diff --git a/platform/commonUI/general/res/sass/_icons.scss b/platform/commonUI/general/res/sass/_icons.scss
index e37aaba143..9c71b49331 100644
--- a/platform/commonUI/general/res/sass/_icons.scss
+++ b/platform/commonUI/general/res/sass/_icons.scss
@@ -45,7 +45,7 @@
 	}
 }
 
-.bar .icon {
+.bar .ui-symbol {
 	display: inline-block;
 }
 
@@ -65,9 +65,9 @@
 	position: absolute;
 }
 
-.tree-item .type-icon {
-	font-size: 16px; // 16px is crisp size
-}
+//.tree-item .type-icon {
+//	font-size: 16px; // 16px is crisp size
+//}
 
 .l-icon-link:before {
 	content: "\f4";
diff --git a/platform/commonUI/general/res/sass/_mixins.scss b/platform/commonUI/general/res/sass/_mixins.scss
index 4f2c1901af..bc97b6a521 100644
--- a/platform/commonUI/general/res/sass/_mixins.scss
+++ b/platform/commonUI/general/res/sass/_mixins.scss
@@ -23,154 +23,158 @@
 @mixin absPosDefault($offset: 0px, $overflowHidden: hidden) {
     overflow: $overflowHidden;
     position: absolute;
-    top: $offset; right: $offset; bottom: $offset; left: $offset;
-    width: auto; height: auto;
+    top: $offset;
+    right: $offset;
+    bottom: $offset;
+    left: $offset;
+    width: auto;
+    height: auto;
 }
 
 @mixin ancillaryIcon($d, $c) {
-	// Used for small icons used in combination with larger icons,
-	// like the link and alert icons in tree items.
-	color: $c;
-	font-size: $d;
-	line-height: $d;
-	height: $d;
-	width: $d;
+    // Used for small icons used in combination with larger icons,
+    // like the link and alert icons in tree items.
+    color: $c;
+    font-size: $d;
+    line-height: $d;
+    height: $d;
+    width: $d;
 }
 
 @mixin trans-prop-nice($props, $t: 500ms) {
-	@if $t == 0 {
-		@include transition-property(none);
-	} @else {
-		@include transition-property($props);
-		@include transition-duration($t);
-		@include transition-timing-function(ease-in-out);
-	}
+    @if $t == 0 {
+        @include transition-property(none);
+    } @else {
+        @include transition-property($props);
+        @include transition-duration($t);
+        @include transition-timing-function(ease-in-out);
+    }
 }
 
 @mixin trans-prop-nice-fade($t: 0.5s) {
-	@if $t == 0 {
-		@include transition-property(none);
-	} @else {
-		@include transition-property(visibility, opacity, background-color, border-color);
-		@include transition-duration($t);
-		@include transition-timing-function(ease-in-out);
-	}
+    @if $t == 0 {
+        @include transition-property(none);
+    } @else {
+        @include transition-property(visibility, opacity, background-color, border-color);
+        @include transition-duration($t);
+        @include transition-timing-function(ease-in-out);
+    }
 }
 
 @mixin trans-prop-nice-resize-h($t: 0.5s) {
-	@include transition-property(height, bottom, top);
-	@include transition-duration($t);
-	@include transition-timing-function(ease-in-out);
+    @include transition-property(height, bottom, top);
+    @include transition-duration($t);
+    @include transition-timing-function(ease-in-out);
 }
 
 @mixin trans-prop-nice-resize-w($t: 0.5s) {
-	@include transition-property(width, left, right);
-	@include transition-duration($t);
-	@include transition-timing-function(ease-in-out);
+    @include transition-property(width, left, right);
+    @include transition-duration($t);
+    @include transition-timing-function(ease-in-out);
 }
 
 @mixin triangle-right($size, $color) {
-	$size: $size/2;
-	$ratio: 1;
-	width: 0;
-	height: 0;
-	border-top: $size/$ratio solid transparent;
-	border-left: $size solid $color;
-	border-bottom: $size/$ratio solid transparent;
+    $size: $size/2;
+    $ratio: 1;
+    width: 0;
+    height: 0;
+    border-top: $size/$ratio solid transparent;
+    border-left: $size solid $color;
+    border-bottom: $size/$ratio solid transparent;
 }
 
 @mixin triangle-down($size, $color) {
-	$size: $size/2;
-	$ratio: 1;
-	width: 0;
-	height: 0;
-	border-left: $size/$ratio solid transparent;
-	border-top: $size solid $color;
-	border-right: $size/$ratio solid transparent;
+    $size: $size/2;
+    $ratio: 1;
+    width: 0;
+    height: 0;
+    border-left: $size/$ratio solid transparent;
+    border-top: $size solid $color;
+    border-right: $size/$ratio solid transparent;
 }
 
 @mixin triangle($dir: "left", $size: 5px, $ratio: 1, $color: red) {
-	//$size: $size*2;
-	width: 0;
-	height: 0;
-	$slopedB: $size/$ratio solid transparent;
-	$straightB: $size solid $color;
-	@if $dir == "up" {
-		border-left: $slopedB;
-		border-right: $slopedB;
-		border-bottom: $straightB;
-	} @else if $dir == "right" {
-		border-top: $slopedB;
-		border-bottom: $slopedB;
-		border-left: $straightB;
-	} @else if $dir == "down"  {
-		border-left: $slopedB;
-		border-right: $slopedB;
-		border-top: $straightB;
-	} @else {
-		border-top: $slopedB;
-		border-bottom: $slopedB;
-		border-right: $straightB;
-	}
+    //$size: $size*2;
+    width: 0;
+    height: 0;
+    $slopedB: $size/$ratio solid transparent;
+    $straightB: $size solid $color;
+    @if $dir == "up" {
+        border-left: $slopedB;
+        border-right: $slopedB;
+        border-bottom: $straightB;
+    } @else if $dir == "right" {
+        border-top: $slopedB;
+        border-bottom: $slopedB;
+        border-left: $straightB;
+    } @else if $dir == "down" {
+        border-left: $slopedB;
+        border-right: $slopedB;
+        border-top: $straightB;
+    } @else {
+        border-top: $slopedB;
+        border-bottom: $slopedB;
+        border-right: $straightB;
+    }
 }
 
 @mixin bgDiagonalStripes($c: yellow, $a: 0.1, $d: 40px) {
-	@include background-image(linear-gradient(-45deg,
-		rgba($c, $a) 25%, transparent 25%,
-		transparent 50%, rgba($c, $a) 50%,
-		rgba($c, $a) 75%, transparent 75%,
-		transparent 100%
-	));
-	background-repeat: repeat;
-	background-size: $d $d;
+    @include background-image(linear-gradient(-45deg,
+        rgba($c, $a) 25%, transparent 25%,
+        transparent 50%, rgba($c, $a) 50%,
+        rgba($c, $a) 75%, transparent 75%,
+        transparent 100%
+    ));
+    background-repeat: repeat;
+    background-size: $d $d;
 }
 
 @mixin bgTicks($c: $colorBodyFg, $repeatDir: 'x') {
-	$deg: 90deg;
-	@if ($repeatDir != 'x') {
-		$deg: 0deg;
-		$repeatDir: repeat-y;
-	} @else {
-		$repeatDir: repeat-x;
-	}
+    $deg: 90deg;
+    @if ($repeatDir != 'x') {
+        $deg: 0deg;
+        $repeatDir: repeat-y;
+    } @else {
+        $repeatDir: repeat-x;
+    }
 
-	@include background-image(linear-gradient($deg,
-		$c 1px, transparent 1px,
-		transparent 100%
-	));
-	background-repeat: $repeatDir;
+    @include background-image(linear-gradient($deg,
+        $c 1px, transparent 1px,
+        transparent 100%
+    ));
+    background-repeat: $repeatDir;
 }
 
 @mixin containerSubtle($bg: $colorBodyBg, $fg: $colorBodyFg, $hover: false) {
-	$ltnRatio: 7%;
-	$gradRatio: 5%;
-	$hovRatio: 7%;
-	$bgBase: lighten($bg, $ltnRatio);
-	$fgBase: lighten($fg, $ltnRatio);
-	$gradC1: lighten($bgBase, $gradRatio);
-	$gradC2: $bgBase;
-	$cInvokeBase: lighten($gradC1, $ltnRatio*2);
+    $ltnRatio: 7%;
+    $gradRatio: 5%;
+    $hovRatio: 7%;
+    $bgBase: lighten($bg, $ltnRatio);
+    $fgBase: lighten($fg, $ltnRatio);
+    $gradC1: lighten($bgBase, $gradRatio);
+    $gradC2: $bgBase;
+    $cInvokeBase: lighten($gradC1, $ltnRatio*2);
 
-	@include background-image(linear-gradient($gradC1, $gradC2));
-	@include border-radius($controlCr);
-	@include box-sizing(border-box);
-	@include boxShdwSubtle();
-	border: none;
-	border-top: 1px solid lighten($gradC1, 2%);
-	color: $fg;
-	display: inline-block;
-	@if $hover == true {
-		&:not(.disabled):hover {
-			@include background-image(linear-gradient(lighten($gradC1, $hovRatio), lighten($gradC2, $hovRatio)));
-			color: lighten($fgBase, $hovRatio);
-			&.btn-menu .invoke-menu {
-				color: lighten($cInvokeBase, $hovRatio);
-			}
-		}
-	}
-	&.btn-menu .invoke-menu {
-		color: $cInvokeBase;
-	}
+    @include background-image(linear-gradient($gradC1, $gradC2));
+    @include border-radius($controlCr);
+    @include box-sizing(border-box);
+    @include boxShdwSubtle();
+    border: none;
+    border-top: 1px solid lighten($gradC1, 2%);
+    color: $fg;
+    display: inline-block;
+    @if $hover == true {
+        &:not(.disabled):hover {
+            @include background-image(linear-gradient(lighten($gradC1, $hovRatio), lighten($gradC2, $hovRatio)));
+            color: lighten($fgBase, $hovRatio);
+            &.btn-menu .invoke-menu {
+                color: lighten($cInvokeBase, $hovRatio);
+            }
+        }
+    }
+    &.btn-menu .invoke-menu {
+        color: $cInvokeBase;
+    }
 }
 
 @mixin sliderTrack($bg: $scrollbarTrackColorBg) {
@@ -184,45 +188,45 @@
 }
 
 @mixin controlGrippy($b, $direction: horizontal, $w: 1px, $style: dotted) {
-	&:before {
-		@include trans-prop-nice("border-color",0.75s);
-		content: '';
-		display: block;
-		height: auto;
-		pointer-events: none;
-		position: absolute;
-		z-index: 2;
+    &:before {
+        @include trans-prop-nice("border-color", 0.75s);
+        content: '';
+        display: block;
+        height: auto;
+        pointer-events: none;
+        position: absolute;
+        z-index: 2;
 
-		@if $direction == "horizontal" {
-			border-top: $w $style darken($b, 15%);
-			top: 2px;
-			left: 5px;
-			right: 5px;
+        @if $direction == "horizontal" {
+            border-top: $w $style darken($b, 15%);
+            top: 2px;
+            left: 5px;
+            right: 5px;
 
-		} @else if $direction == "vertical" {
-			border-left: $w $style darken($b, 15%);
-			left: 2px;
-			bottom: 5px;
-			top: 5px;
-		}
-	}
-	&:not(.disabled):hover:before {
-		@include trans-prop-nice("border-color",50ms);
-		border-color: $colorKey;
-	}
+        } @else if $direction == "vertical" {
+            border-left: $w $style darken($b, 15%);
+            left: 2px;
+            bottom: 5px;
+            top: 5px;
+        }
+    }
+    &:not(.disabled):hover:before {
+        @include trans-prop-nice("border-color", 50ms);
+        border-color: $colorKey;
+    }
 }
 
 @mixin btnSubtle($bg: $colorBodyBg, $fg: $colorBodyFg) {
-	@include containerSubtle($bg, $fg, true);
+    @include containerSubtle($bg, $fg, true);
 }
 
 @mixin btnNoticeable($bg: $colorBodyBg, $fg: $colorBodyFg) {
-	// No longer should be used; use btnSubtle instead
-	//@include containerSubtle($bg, $fg, true);
-	//@include background-image(linear-gradient(lighten($bg, 20%), $bg));
-/*	&:not(.disabled):hover {
-		@include background-image(linear-gradient(lighten($bg, 30%), lighten($bg, 10%)));
-	}*/
+    // No longer should be used; use btnSubtle instead
+    //@include containerSubtle($bg, $fg, true);
+    //@include background-image(linear-gradient(lighten($bg, 20%), $bg));
+    /*	&:not(.disabled):hover {
+            @include background-image(linear-gradient(lighten($bg, 30%), lighten($bg, 10%)));
+        }*/
 }
 
 @mixin boxIncised($sVal: 0.6) {
@@ -238,59 +242,60 @@
 }
 
 @mixin boxShdwLarge($sVal: 0.7) {
-	@include box-shadow(rgba(black, $sVal) 0 3px 10px);
+    @include box-shadow(rgba(black, $sVal) 0 3px 10px);
 }
 
 @mixin outerGlow($color: #fff, $sVal: 0.3) {
-	@include box-shadow(rgba($color, $sVal) 0 0 30px);
+    @include box-shadow(rgba($color, $sVal) 0 0 30px);
 }
 
 @mixin linearGlow($deg: 0, $c: red, $a: 0.4) {
-    @include background-image(linear-gradient($deg, rgba($c,0), rgba($c, $a) 100%));
+    @include background-image(linear-gradient($deg, rgba($c, 0), rgba($c, $a) 100%));
 }
 
 @mixin subtleGrad($deg: 0, $c: red, $a0: 0.2, $a1: 0.3) {
-	@include background-image(linear-gradient($deg, rgba($c,$a0), rgba($c, $a1) 100%));
+    @include background-image(linear-gradient($deg, rgba($c, $a0), rgba($c, $a1) 100%));
 }
 
 @mixin txtShdwSubtle($sVal: 0.1) {
-	@include text-shadow(rgba(black, $sVal) 0 1px 2px);
+    @include text-shadow(rgba(black, $sVal) 0 1px 2px);
 }
+
 @mixin txtShdwLarge($sVal: 0.7) {
-	@include text-shadow(rgba(black, $sVal) 0 3px 7px);
+    @include text-shadow(rgba(black, $sVal) 0 3px 7px);
 }
 
 /*********************************************** FORM ELEMENTS */
 @mixin input-base($bg: $colorBodyBg, $fg: $colorBodyFg) {
-	@include appearance(none);
-	@include border-radius($controlCr);
-	@include box-sizing(border-box);
-	@include box-shadow(inset rgba(black, 0.65) 0 1px 4px);
-	//	background: lighten($bg, 20%);
-	background: rgba(#fff, 0.1);
-	border: none;
-	//border-bottom: 1px solid rgba(#fff, 0.1);
-	color: lighten($fg, 20%);
-	outline: none;
-	&.error {
-		background: rgba(red, 0.5);
-	}
+    @include appearance(none);
+    @include border-radius($controlCr);
+    @include box-sizing(border-box);
+    @include box-shadow(inset rgba(black, 0.65) 0 1px 4px);
+    //	background: lighten($bg, 20%);
+    background: rgba(#fff, 0.1);
+    border: none;
+    //border-bottom: 1px solid rgba(#fff, 0.1);
+    color: lighten($fg, 20%);
+    outline: none;
+    &.error {
+        background: rgba(red, 0.5);
+    }
 }
 
 @mixin nice-input($bg: $colorBodyBg, $fg: $colorBodyFg) {
-	@include input-base($bg, $fg);
-	padding: 0 $interiorMarginSm;
+    @include input-base($bg, $fg);
+    padding: 0 $interiorMarginSm;
 }
 
 @mixin nice-textarea($bg: $colorBodyBg, $fg: $colorBodyFg) {
-	@include input-base($bg, $fg);
-	padding: $interiorMargin;
+    @include input-base($bg, $fg);
+    padding: $interiorMargin;
 }
 
 @mixin subdued-input($bg: $colorBodyBg, $fg: $colorBodyFg) {
-	@include nice-input($bg, $fg);
-	background: lighten($bg, 3%);
-	border-bottom: 1px solid lighten($bg, 10%);
+    @include nice-input($bg, $fg);
+    background: lighten($bg, 3%);
+    border-bottom: 1px solid lighten($bg, 10%);
 }
 
 /*
@@ -308,24 +313,30 @@
     padding: 0;
     li {
         list-style-type: none;
-        margin:0;
+        margin: 0;
         padding: 0;
     }
 }
 
-@mixin vertical-align {
-	/* This doesn't work on an element inside an element with absolute positioning that has height: auto */
-	position: relative;
-	top: 50%;
-	-webkit-transform: translateY(-50%);
-	-ms-transform: translateY(-50%);
-	transform: translateY(-50%);
+@mixin verticalCenter {
+    /* This doesn't work on an element inside an element with absolute positioning that has height: auto */
+    //position: relative;
+    top: 50%;
+    -webkit-transform: translateY(-50%);
+    -ms-transform: translateY(-50%);
+    transform: translateY(-50%);
+}
+
+@mixin verticalCenterBlock($holderH, $itemH) {
+    top: floor(($holderH - $itemH) / 2);
+    bottom: auto;
+    height: $itemH;
 }
 
 @mixin ellipsize() {
-	overflow: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
 }
 
 @mixin scrollH($showBar: auto) {
@@ -339,21 +350,26 @@
 }
 
 @mixin wait-spinner($b: 5px, $c: $colorAlt1) {
-	display: block;
-	position: absolute;
-	-webkit-animation: rotation .6s infinite linear;
-	-moz-animation: rotation .6s infinite linear;
-	-o-animation: rotation .6s infinite linear;
-	animation: rotation .6s infinite linear;
-	border-color: rgba($c, 0.25);
-	border-top-color: rgba($c, 1.0);
-	border-style: solid;
-	border-width: $b;
-	border-radius: 100%;
+    display: block;
+    position: absolute;
+    -webkit-animation: rotation .6s infinite linear;
+    -moz-animation: rotation .6s infinite linear;
+    -o-animation: rotation .6s infinite linear;
+    animation: rotation .6s infinite linear;
+    border-color: rgba($c, 0.25);
+    border-top-color: rgba($c, 1.0);
+    border-style: solid;
+    border-width: $b;
+    border-radius: 100%;
 }
 
 @mixin test($c: #ffcc00, $a: 0.2) {
-	background-color: rgba($c, $a);
+    background-color: rgba($c, $a);
+}
+
+@mixin tmpBorder($c: #ffcc00, $a: 0.75) {
+    @inlude box-sizing(border-box);
+    border: 1px dotted rgba($c, $a);
 }
 
 @mixin testObj($w: 2000px, $h: 1000px, $c: black, $a: 0.1) {
@@ -374,6 +390,6 @@
 }
 
 @mixin s-stale($a: 0.5) {
-	color: rgba($colorTelemFresh, $a) !important;
-	font-style: italic;
+    color: rgba($colorTelemFresh, $a) !important;
+    font-style: italic;
 }
\ No newline at end of file
diff --git a/platform/commonUI/general/res/sass/controls/_buttons.scss b/platform/commonUI/general/res/sass/controls/_buttons.scss
index ab2285ab5c..fcb168466a 100644
--- a/platform/commonUI/general/res/sass/controls/_buttons.scss
+++ b/platform/commonUI/general/res/sass/controls/_buttons.scss
@@ -26,7 +26,8 @@ $pad: $interiorMargin * $baseRatio;
 .btn,
 .l-btn {
 	@include user-select(none);
-	line-height: 1.5em; // Was 1.25em
+	//line-height: 1.5em; // Was 1.25em
+	line-height: 150%;
 	padding: 0 $pad;
 	text-decoration: none;
 	&.lg,
diff --git a/platform/commonUI/general/res/sass/controls/_controls.scss b/platform/commonUI/general/res/sass/controls/_controls.scss
index 3f15a69491..2e7a0e09d3 100644
--- a/platform/commonUI/general/res/sass/controls/_controls.scss
+++ b/platform/commonUI/general/res/sass/controls/_controls.scss
@@ -102,7 +102,7 @@
 
 .btn-bar {
 	//	position: relative;
-	.btn,
+/*	.btn,
 	.btn-set,
 	.t-btn {
 		display: inline-block;
@@ -113,7 +113,7 @@
 		&:first-child {
 			//			margin-left: 0;
 		}
-	}
+	}*/
 }
 
 .l-composite-control {
@@ -153,6 +153,7 @@
 	font-size: 0.7rem;
 }
 
+/*
 .btn-set {
 	// Buttons that have a very tight conceptual grouping - no internal space between them.
 	display: inline-block;
@@ -171,37 +172,33 @@
 		}
 	}
 }
+*/
 
 .object-browse-bar .btn,
 .object-browse-bar .t-btn,
+.object-browse-bar .view-switcher,
 .top-bar .buttons-main .btn,
 .top-bar .buttons-main .t-btn,
+.top-bar .view-switcher,
 .tool-bar .btn,
 .tool-bar .t-btn {
 	$h: $btnToolbarH;
 	display: inline-block;
 	font-size: $h * $btnFontSizeToH;
-	height: $h;
-	line-height: $h - 3;
-	.icon:not(.invoke-menu) {
-		//		position: relative;
-		//		top: -0.04em;
-		//font-size: 150%;
-		//vertical-align: middle;
-	}
+	line-height: 200%;
+	vertical-align: top;
 }
 
 label.checkbox.custom {
 	$bg: lighten($colorBodyBg, $ltGamma);
 	$d: $formRowCtrlsH;
-	//	@include vertical-align();
 	cursor: pointer;
 	display: inline-block;
 	line-height: $d;
 	margin-right: $interiorMargin * 4;
 	padding-left: $d + $interiorMargin;
 	position: relative;
-	vertical-align: top;
+	vertical-align: middle; // was top
 	em {
 		color: $colorBodyFg;
 		display: inline-block;
@@ -326,9 +323,9 @@ label.checkbox.custom {
 	$p: 10px;
 	$badgeM: $interiorMargin;
 	$badgeD: $h - ($badgeM * 2);
-	height: $h;
-	line-height: $h;
-	padding-right: 10px;
+	//height: $h;
+	//line-height: $h;
+	//padding-right: 10px;
 	&.browse-btn {
 		margin-right: $interiorMargin;
 		padding-left: $badgeD + $badgeM * 2;
@@ -351,7 +348,6 @@ label.checkbox.custom {
 .context-available {
 	$c: $colorKey;
 	color: $c;
-	//padding: 0 5px;
 	&:hover {
 		color: lighten($c, 10%);
 	}
@@ -359,24 +355,53 @@ label.checkbox.custom {
 
 .view-switcher {
 	@include trans-prop-nice-fade($controlFadeMs);
+	.type-icon {
+		//vertical-align: top;
+	}
 }
 
 /******************************************************** OBJECT-HEADER */
 .object-header {
-	display: inline-block;
+	//@include test();
 	font-size: 1em;
-	.label {
-		.title-label {
-			color: lighten($colorBodyFg, 40%);
-		}
-		.type-icon {
-			font-size: 120%;
-			margin-right: $interiorMargin;
-			vertical-align: middle;
-		}
+
+	> .title-label,
+	> .type-icon,
+	> .context-available {
+		//@include tmpBorder(#6666ff);
+		//vertical-align: middle;
+	}
+	> .type-icon {
+		font-size: 120%;
+		float: left;
+		margin-right: $interiorMargin;
+	}
+
+	.l-elem-wrapper {
+		display: flex;
+		flex-flow: row nowrap;
+		justify-content: flex-start;
+	}
+
+	.action {
+		margin-right: $interiorMargin;
+	}
+
+	.title-label {
+		@include ellipsize();
+		color: lighten($colorBodyFg, 40%);
+		padding-right: 0.35em; // For context arrow. Done with em's so pad is relative to the scale of the text.
+		//position: relative;
+	}
+
+	.context-available {
+		font-size: 0.7em;
+	}
+
+	@include desktop {
 		.context-available {
+			@include trans-prop-nice(opacity, 0.25s);
 			opacity: 0;
-			font-size: 0.8em;
 		}
 		&:hover {
 			.context-available {
@@ -386,16 +411,6 @@ label.checkbox.custom {
 	}
 }
 
-.top-bar,
-.object-browse-bar {
-	.object-header {
-		font-size: 1.1em;
-		span {
-			display: inline-block;
-		}
-	}
-}
-
 /******************************************************** SLIDERS */
 
 .slider {
@@ -449,24 +464,26 @@ label.checkbox.custom {
 
 /******************************************************** BROWSER ELEMENTS */
 
-::-webkit-scrollbar {
-	@include sliderTrack();
-	height: $scrollbarTrackSize;
-	width: $scrollbarTrackSize;
-}
-
-::-webkit-scrollbar-thumb {
-	$bg: lighten($colorBodyBg, 10%);
-	@include background-image(linear-gradient(lighten($bg, 10%), lighten($bg, 5%) 20px));
-	@include border-radius(1px);
-	@include box-sizing(border-box);
-	@include boxShdwSubtle();
-	border-top: 1px solid lighten($bg, 20%);
-	&:hover {
-		@include background-image(linear-gradient(lighten($bg, 20%), lighten($bg, 15%) 20px));
+@include desktop {
+	::-webkit-scrollbar {
+		@include sliderTrack();
+		height: $scrollbarTrackSize;
+		width: $scrollbarTrackSize;
 	}
-}
 
-::-webkit-scrollbar-corner {
-	background: rgba(#000, 0.4);
+	::-webkit-scrollbar-thumb {
+		$bg: lighten($colorBodyBg, 10%);
+		@include background-image(linear-gradient(lighten($bg, 10%), lighten($bg, 5%) 20px));
+		@include border-radius(1px);
+		@include box-sizing(border-box);
+		@include boxShdwSubtle();
+		border-top: 1px solid lighten($bg, 20%);
+		&:hover {
+			@include background-image(linear-gradient(lighten($bg, 20%), lighten($bg, 15%) 20px));
+		}
+	}
+
+	::-webkit-scrollbar-corner {
+		background: rgba(#000, 0.4);
+	}
 }
\ No newline at end of file
diff --git a/platform/commonUI/general/res/sass/forms/_elems.scss b/platform/commonUI/general/res/sass/forms/_elems.scss
index 9a2adab2e3..3971036983 100644
--- a/platform/commonUI/general/res/sass/forms/_elems.scss
+++ b/platform/commonUI/general/res/sass/forms/_elems.scss
@@ -20,28 +20,30 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 .section-header {
-	@include border-radius(3px);
-	background: rgba(white, 0.1);
+	@include border-radius($basicCr);
+	background: rgba(#fff, 0.1);
+	$c: lighten($colorBodyFg, 20%);
+	//border-bottom: 1px solid rgba(#fff, 0.3);
+	color: $c;
 	font-size: 0.8em;
-	margin-top: $interiorMargin;
-	padding: $interiorMargin;
-	&:first-child {
-		margin-top: 0;
-	}
+	padding: $formTBPad $formLRPad;
+	text-transform: uppercase;
 }
 
 .form {
 //	@include test(orange);
 	.form-section {
 		position: relative;
+		margin-bottom: $interiorMarginLg * 2;
 	}
 
 	.form-row {
+		$m: $interiorMargin;
 		@include box-sizing(border-box);
 		@include clearfix;
-		border-top: 1px solid $colorInteriorBorder;
-		margin-top: $interiorMargin;
-		padding: $interiorMargin;
+		border-top: 1px solid $colorFormLines;
+		margin-top: $m;
+		padding: $formTBPad $formLRPad;
 		position: relative;
 		&.first {
 			border-top: none;
@@ -49,18 +51,18 @@
 
 		.label,
 		.controls {
-//			@include test(orange);
 			@include box-sizing(border-box);
 			@include clearfix;
-			box-sizing: border-box;
-			font-size: 0.75rem;
+			font-size: 0.8rem;
 			line-height: $formInputH;
             min-height: $formInputH;
 		}
 
 		>.label {
 			// Only style this way for immediate children of .form-row; prevents problems when .label is used in .controls section of a form
+			//@include test(orange, 0.05);
 			float: left;
+			min-width: 120px;
             position: relative;
 			white-space: nowrap;
 			width: $formLabelW;
diff --git a/platform/commonUI/general/res/sass/forms/_validation.scss b/platform/commonUI/general/res/sass/forms/_validation.scss
index eba95840c5..07f15cb660 100644
--- a/platform/commonUI/general/res/sass/forms/_validation.scss
+++ b/platform/commonUI/general/res/sass/forms/_validation.scss
@@ -25,18 +25,18 @@
         padding-right: $reqSymbolW + $reqSymbolM; // Keep room for validation element
         &::after {
             //            @include test(yellow, 0.3);
-            display: block;
+/*            display: block;
             position: absolute;
             top: 0;
             right: $reqSymbolM;
             bottom: 0;
             left: auto;
             height: auto;
-            width: $reqSymbolW;
+            width: $reqSymbolW;*/
             font-family: symbolsfont;
             font-size: $reqSymbolFontSize;
-            text-align: right;
-            vertical-align: middle;
+            //text-align: right;
+            //vertical-align: middle;
         }
     }
     &.invalid,
diff --git a/platform/commonUI/general/res/sass/items/_item.scss b/platform/commonUI/general/res/sass/items/_item.scss
index 86592f77de..55c37b2884 100644
--- a/platform/commonUI/general/res/sass/items/_item.scss
+++ b/platform/commonUI/general/res/sass/items/_item.scss
@@ -44,7 +44,7 @@
             position: relative;
             &:hover .item-main {
 	            .item-type {
-		            color: $colorKey !important;
+		            color: lighten($colorKey, 10%) !important;
                     .l-icon-link {
                         color: $colorIconLink;
                     }
@@ -55,13 +55,16 @@
 	            }
             }
 	        .contents {
-		        top: $interiorMargin; right: $interiorMargin; bottom: $interiorMargin; left: $interiorMargin;
+                //@include test(red);
+                $m: $interiorMarginLg;
+		        top: $m; right: $m; bottom: $m; left: $m;
 	        }
             .bar {
-                &.top-bar.abs {
+                &.top-bar {
                     bottom: auto;
                     height: $ueBrowseGridItemTopBarH;
                     line-height: $ueBrowseGridItemTopBarH;
+                    text-align: right;
 	                z-index: 5;
 	                .left, .right {
 		                width: auto;
@@ -73,10 +76,10 @@
 		                }
 	                }
                 }
-                &.bottom-bar.abs {
+                &.bottom-bar {
                     top: auto;
-                    height: $ueBrowseGridItemBottomBarH;
-	                padding: $interiorMargin;
+                    //height: $ueBrowseGridItemBottomBarH;
+                    line-height: 110%;
                 }
             }
             .item-main {
@@ -89,7 +92,7 @@
                     //@include trans-prop-nice("color", $transTime);
                     @include absPosDefault($iconMargin, false);
                     //@include test(red);
-                    color: $colorItemFg;
+                    //color: $colorItemFg;
                     text-align: center;
                     font-size: $iconD * 0.95; //6em;
                     line-height: $iconD;
@@ -99,11 +102,12 @@
                     //line-height: $lh;
                     .l-icon-link {
                         // When the link icon is in the item-type icon holder
-                        color: darken($colorIconLink, 25%);
-                        height: 36px;
-                        line-height: 36px;
+                        //color: darken($colorIconLink, 25%);
+                        color: $colorIconLink;
+                        height: auto;
+                        line-height: 100%;
                         position: absolute;
-                        font-size: 32px;
+                        font-size: 0.3em;
                         left: 0px;
                         bottom: 10px;
                         z-index: 2;
@@ -123,13 +127,11 @@
             }
             .title {
 	            @include txtShdwSubtle();
+                @include ellipsize();
                 color: lighten($colorBodyFg, 20%);
-	            overflow: hidden;
-	            white-space: nowrap;
-	            text-overflow: ellipsis;
-//                font-weight: bold;
             }
             .details {
+                @include ellipsize();
                 font-size: 0.8em;
             }
 	        &.selected {
diff --git a/platform/commonUI/general/res/sass/mobile/_constants.scss b/platform/commonUI/general/res/sass/mobile/_constants.scss
index 6a3a32c0db..f4fe4ceaad 100644
--- a/platform/commonUI/general/res/sass/mobile/_constants.scss
+++ b/platform/commonUI/general/res/sass/mobile/_constants.scss
@@ -20,18 +20,20 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 
-/************************** MOBILE REPRESENTATION ITEMS DIMENSIONS */
-$mobile-listIcon: 30px;
-$mobile-listRight: 10px;
+/************************** STYLE */
+$colorMobilePaneLeft: #222;
 
-$phone-itemHeight: $ueBrowseGridItemLg/4;
-$tablet-itemHeight: $ueBrowseGridItemLg/3;
+/************************** MOBILE REPRESENTATION ITEMS DIMENSIONS */
+$mobileListIconSize: 30px;
+$mobileTitleDescH: 35px;
+$mobileOverlayMargin: 10px;
+$phoneItemH: floor($ueBrowseGridItemLg/4);
+$tabletItemH: floor($ueBrowseGridItemLg/3);
 
 /************************** MOBILE TREE MENU DIMENSIONS */
-$mobile-treeHeight: 38px;
-$mobile-startingTreeLeft: 3px;
-$mobile-runningTreeLeft: 7px;
-$mobile-treeRight: 13px;
+$mobileTreeItemH: 35px;
+$mobileTreeItemIndent: 20px;
+$mobileTreeRightArrowW: 30px;
 
 /************************** WINDOW DIMENSIONS FOR RWD */
 $phoMaxW: 514px;
@@ -80,8 +82,5 @@ $desktopPortrait: "screen and #{$desktopPortraitCheck}";
 $desktopLandscape: "screen and #{$desktopLandscapeCheck}";
 
 /************************** DEVICE PARAMETERS FOR MENUS/REPRESENTATIONS */
-$phoneRepSizePortrait: 19px;
-$phoneRepSizeLandscape: 66%;
-$tabletRepSizePortrait: 500px;
-$tabletRepSizeLandscape: 78%;
-$desktopMenuSize: 25%;
+$proporMenuOnly: 90%;
+$proporMenuWithView: 40%;
diff --git a/platform/commonUI/general/res/sass/mobile/_item.scss b/platform/commonUI/general/res/sass/mobile/_item.scss
index 88f08cb343..717e589cb5 100644
--- a/platform/commonUI/general/res/sass/mobile/_item.scss
+++ b/platform/commonUI/general/res/sass/mobile/_item.scss
@@ -27,103 +27,92 @@
 .items-holder {
     .item {
         &.grid-item {
-            $dWid: $ueBrowseGridItemLg;
-            $dHei: $ueBrowseGridItemLg;
+            $titleH: 30px;
             @include phoneandtablet {
-                $dWid: 100%;
-                .mobile-grid-nav {
-                    top: 0px;
-                    bottom: 0px;
-                    right: 55px;
-                }
-                .mobile-info {
-                    text-align: center;
-                    width: 50px;
-                    right: 0px;
-                    left: auto;
-                    font-size: 1.3em;
+                width: 100%;
+                >.contents {
+                    top: 0px; right: $interiorMarginLg; bottom: 0px; left: $interiorMarginLg;
                 }
                 .bar {
-                    &.bottom-bar.abs {
-                        top: 0px;
-                        height: auto;
+                    &.top-bar {
+                        // Becomes the right side of the item
+                        //@include test(blue);
+                        bottom: 0 !important; left: auto !important; right: 20px !important;
+                        width: 40px !important; height: auto !important;
+                        text-align: right;
+                    }
+                    &.bottom-bar {
+                        // Becomes the left side of the item
+                        left: $mobileListIconSize + $interiorMarginLg;
+                        right: 60px;
                     }
                     
                 }
                 .item-main {
                     .item-type {
-                        font-size: $mobile-listIcon;
-                        top: 0px;
-                        left: 0px;
+                        //@include test(blue);
+                        font-size: $mobileListIconSize;
+                        right: auto;
+                        bottom: auto;
+                        left: 0;
+                        line-height: 100%;
                         text-align: left;
-                        height: auto
+                        width: $mobileListIconSize;
+                        .l-icon-link {
+                            bottom: 0;
+                        }
                     }
                     .item-open {
-                       display: none;
+                        display: block;
+                        opacity: 1;
+                        font-size: 1em;
+                        width: auto;
                     }
                 }
-                .title, .details {
-                    margin-left: $mobile-listIcon;
-                }
             }
 
             @include phone {
-                $dHei: $phone-itemHeight;
-                width: $dWid;
+                $dHei: $phoneItemH;
                 height: $dHei;
-                .mobile-right {
-                    top: 100%;
-                }
-                .mobile-info {
-                    line-height: $phone-itemHeight * .5;
+                .bar {
+                    &.top-bar {
+                        // Becomes the right side of the item
+                        line-height: $dHei !important;
+                    }
+                    &.bottom-bar {
+                        @include verticalCenterBlock($dHei, $mobileTitleDescH);
+                    }
                 }
                 .item-main {
                     .item-type {
-                        line-height: $phone-itemHeight * .8;
+                        @include verticalCenterBlock($dHei, $mobileListIconSize);
+                    }
+                    .item-open {
+                        line-height: $dHei;
                     }
                 }
-                .title {
-                    margin-right: $mobile-listRight;
-                    line-height: $phone-itemHeight * .5;
-                }
-                .details {
-                    margin-right: $mobile-listRight;
-                    line-height: 0px;
-                }                
             }
             
             @include tablet {
-                $dHei: $tablet-itemHeight;
-                width: $dWid;
+                $dHei: $tabletItemH;
                 height: $dHei;
-                .mobile-right {
-                    top: 100%;
-                }
-                
-                .mobile-info {
-                    line-height: $tablet-itemHeight * .57;
+                .bar {
+                    &.top-bar {
+                        // Becomes the right side of the item
+                        line-height: $dHei !important;
+                    }
+                    &.bottom-bar {
+                        @include verticalCenterBlock($dHei, $mobileTitleDescH);
+                    }
                 }
                 .item-main {
                     .item-type {
-                        font-size: $mobile-listIcon;
-                        line-height: $tablet-itemHeight * .75;
+                        @include verticalCenterBlock($dHei, $mobileListIconSize);
+                    }
+                    .item-open {
+                        line-height: $dHei;
                     }
                 }
-                .title {
-                    margin-right: $mobile-listRight;
-                    line-height: $tablet-itemHeight * .57;
-                }
-                .details {
-                    margin-right: $mobile-listRight;
-                    line-height: 0px;
-                }
-            }
-            
-            @include desktop {
-                $dWid: $ueBrowseGridItemLg;
-                $dHei: $ueBrowseGridItemLg;
-                width: $dWid;
-                height: $dHei; 
             }
         }
     }
diff --git a/platform/commonUI/general/res/sass/mobile/_layout.scss b/platform/commonUI/general/res/sass/mobile/_layout.scss
index ebbc059918..9a88c64a6a 100644
--- a/platform/commonUI/general/res/sass/mobile/_layout.scss
+++ b/platform/commonUI/general/res/sass/mobile/_layout.scss
@@ -20,203 +20,155 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 
-// Wrapper of the entire 2 panes, only enacted on
-// phone and tablet. Also for the panes
-
-.browse-wrapper,
-.mobile-pane {
-    @include phoneandtablet {
-        position: absolute;
-        left: 0; top: 0;
-        right: 0;
-        white-space: nowrap;
+@include phoneandtablet {
+    // Wrapper of the entire 2 panes, only enacted on
+    // phone and tablet. Also for the panes
+    .browse-wrapper,
+    .pane {
+        top: 0 !important; right: 0; bottom: 0; left: 0;
     }
-}
 
-// Default views of the panels
-// if in desktop browser
-.desktop-browse {
-    @include desktop {
-        min-width: 150px;
-        max-width: 800px;
-        width: $desktopMenuSize;   
-    }   
-}
+    .pane.left.treeview {
+        background-color: $colorMobilePaneLeft;
+    }
 
-// When the tree is hidden, these are the
-// classes used for the left menu and the
-// right representation.
-.browse-hidetree {
-    // NOTE: DISABLED SELECTION
-    // Selection disabled in both panes
-    // causing cut/copy/paste menu to
-    // not appear. Should me moved in
-    // future to properly work
-    @include phoneandtablet {
+    .pane.right-repr {
+        //@include test();
+        @include slMenuTransitions;
+        margin-left: 0 !important;
+        #content-area {
+            @include slMenuTransitions;
+            opacity: 1;
+        }
+    }
+
+    .user-environ .browse-area,
+    .user-environ .edit-area,
+    .user-environ .editor {
+        top: 0; left: 0; right: 0; bottom: $ueFooterH;
+    }
+
+    .holder.l-mobile {
+        top: $bodyMargin !important;
+        right: $bodyMargin !important;
+        bottom: $bodyMargin !important;
+        left: $bodyMargin !important;
+    }
+
+    // When the tree is hidden, these are the
+    // classes used for the left menu and the
+    // right representation.
+    .browse-hidetree {
         @include user-select(none);
-    }
-    // Sets the left tree menu when the tree
-    // is hidden. 
-    .mobile-pane.left-menu {
-        @include phoneandtablet {
-            @include trans-prop-nice(opacity, .4s);
+        // Sets the left tree menu when the tree
+        // is hidden.
+        .pane.left.treeview {
             opacity: 0;
             right: 100% !important;
             width: auto !important;
             overflow-y: hidden;
-            overflow-x: hidden;       
+            overflow-x: hidden;
+        }
+        // Sets the right represenation when
+        // the tree is hidden.
+        .pane.right-repr {
+            left: 0 !important;
         }
     }
-
-    // Sets the right represenation when
-    // the tree is hidden. 
-    .mobile-pane.right-repr {       
-        @include phoneandtablet {         
-            @include slMenuTransitions;
-            left: auto !important;
-            width: 100% !important;
-        }
-    }    
-}
-
-.mobile-tree-holder {
-    top: 50px;
-}
-
-// When the tree is shown, these are
-// the classes used for the left menu
-// and the right menu (for each device &
-// orientation combination, separate 
-// parameters are used)
-.browse-showtree {
-    // NOTE: DISABLED SELECTION
-    // Selection disabled in both panes
-    // causing cut/copy/paste menu to
-    // not appear. Should me moved in
-    // future to properly work
-    @include phoneandtablet {
+    
+    .browse-showtree {
+        // NOTE: DISABLED SELECTION
+        // Selection disabled in both panes
+        // causing cut/copy/paste menu to
+        // not appear. Should me moved in
+        // future to properly work
         @include user-select(none);
-    }
-    // Sets the left tree menu when the tree
-    // is shown.     
-    .mobile-pane.left-menu {
-        @include phoneandtablet {
+
+        // Sets the left tree menu when the tree is shown.
+        .pane.left.treeview {
             @include trans-prop-nice(opacity, .4s);
+            @include background-image(linear-gradient(90deg, rgba(black, 0) 98%, rgba(black, 0.3) 100%));
             opacity: 1;
             display: block !important;
-            width: auto !important;
+            //width: auto !important; // CH CO
+            right: auto !important;
+            width: $proporMenuWithView !important;
         }
-        // On both phones and tablets, the amount of
-        // space allowed for the right pane is specified
-        @include phonePortrait {
-            right: $phoneRepSizePortrait !important;
-        }
-        @include phoneLandscape {
-            right: $phoneRepSizeLandscape !important;
-        }
-        @include tabletPortrait {
-            right: $tabletRepSizePortrait !important;
-        }
-        @include tabletLandscape {
-            right: $tabletRepSizeLandscape !important;
-        }
-    }
-    // Sets the right represenation when
-    // the tree is shown.     
-    .mobile-pane.right-repr {
-        @include phoneandtablet {
-            @include slMenuTransitions;
-            left: auto !important;
-        }
-        // On both phones and tablets, the width of
-        // the right pane is specified
-        @include phonePortrait {
-            width: $phoneRepSizePortrait !important;
-        }
-        @include phoneLandscape {
-            width: $phoneRepSizeLandscape !important;
-        }
-        @include tabletPortrait {
-            width: $tabletRepSizePortrait !important;
-        }
-        @include tabletLandscape {
-            width: $tabletRepSizeLandscape !important;
-        }
-    }
-}
+        // Sets the right representation when the tree is shown.
+        .pane.right-repr {
+            left: $proporMenuWithView !important;
+            //width: auto !important;
 
-// Button position is set as absolute with transitions
-.button-pos {
-    @include phoneandtablet {
+            //left: 0 !important;
+            //transform: translateX($proporMenuWithView);
+        }
+    }
+
+    .mobile-menu-icon {
+        font-size: 110%;
         position: absolute;
+        top: $bodyMargin + 2;
+        left: $bodyMargin;
     }
-}
 
-// Object header must be moved
-// over to make space for the 
-// hamburger icon
-.object-header {
-    @include phoneandtablet {
-        position: relative;
-        left: 44px;        
-        .label {
-            .context-available {
-                opacity: 1 !important;
+    .object-browse-bar {
+        //@include test();
+        left: 30px !important;
+        .context-available {
+            opacity: 1 !important;
+        }
+        .view-switcher {
+            margin-right: 0 !important;
+            .name {
+                // Hide the name in mobile
+                display: none;
             }
         }
     }
-}
 
-.desktop-hide {
-    @include desktop {
-        display: none;
+    .tree-holder {
+        overflow-x: hidden !important;
     }
-}
 
-// Hides objects on phone and tablet
-.mobile-hide {
-    @include phoneandtablet {
-        display: none;
+    .mobile-disable-select {
+        @include user-select(none);
     }
-}
 
-.mobile-important-hide {
-    @include phoneandtablet {
+    // Hides objects on phone and tablet
+    .mobile-hide,
+    .mobile-hide-important {
         display: none !important;
     }
-}
 
-.mobile-back-hide {
-    @include phoneandtablet {
+    .mobile-back-hide {
         pointer-events: none;
         @include trans-prop-nice(opacity, .4s);
         opacity: 0;
     }
-}
-
-// Hides objects on phone and tablet
-.mobile-back-unhide {
-    @include phoneandtablet {
+    .mobile-back-unhide {
         pointer-events: all;
         @include trans-prop-nice(opacity, .4s);
         opacity: 1;
     }
 }
 
-// Hides objects only on the phone
-.phone-hide {
-    @include phone {
-        display: none;
+@include phonePortrait {
+    .browse-showtree {
+        .pane.left.treeview {
+            width: $proporMenuOnly !important;
+        }
+        .pane.right-repr {
+            left: 0 !important;
+            transform: translateX($proporMenuOnly);
+            #content-area {
+                opacity: 0;
+            }
+        }
     }
 }
 
-.tree-holder {
-    @include phoneandtablet {
-        overflow-x: hidden !important;
+@include desktop {
+    .desktop-hide {
+        display: none;
     }
-}
-.mobile-disable-select {
-    @include phoneandtablet {
-        @include user-select(none);
-    }
-}
+}
\ No newline at end of file
diff --git a/platform/commonUI/general/res/sass/mobile/_tree.scss b/platform/commonUI/general/res/sass/mobile/_tree.scss
index d7f62f16b0..03e8051a14 100644
--- a/platform/commonUI/general/res/sass/mobile/_tree.scss
+++ b/platform/commonUI/general/res/sass/mobile/_tree.scss
@@ -20,48 +20,42 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 
-
-ul.tree {
-    // Only applies to phones and tablets
-    @include phoneandtablet {
-        @include menuUlReset();
+@include phoneandtablet {
+    ul.tree {
+        //@include menuUlReset();
         li {
+            //border-top: 1px solid $colorInteriorBorder; // TEMP
             span.tree-item {
-                // Adds some space to the top of each tree item
-                height: $mobile-treeHeight;
-                line-height: $mobile-treeHeight;
-                padding-top: $interiorMarginSm;
-                padding-bottom: $interiorMarginSm;
+                height: $mobileTreeItemH;
+                line-height: $mobileTreeItemH;
                 margin-bottom: 0px;
                 .view-control {
+                    //@include test(red);
                     position: absolute;
-                    right: $mobile-treeRight;
-                    font-size: 1.8em;
+                    font-size: 1.1em;
                     right: 0px;
-                    width: 35px;
+                    width: $mobileTreeRightArrowW;
                     text-align: center;
-                }                   
+                }
 
                 .label {
-                    // Designates the starting left margin
-                    // (indentation) of 'My Items'
-                    // Also adds right space for selection button
-                    left: $mobile-startingTreeLeft;
-                    right: 45px;
-                    font-size: 1.2em;
-                    // Allows tree item name to stop prior
-                    // to the arrow
-                    .title-label {
-                        right: $mobile-treeRight * 1.3;
+                    left: 0;
+                    right: $mobileTreeRightArrowW + $interiorMargin; // Allows tree item name to stop prior to the arrow
+                    line-height: $mobileTreeItemH;
+                    //font-size: 1.1em; // CH CO
+                    .type-icon {
+                        @include verticalCenterBlock($mobileTreeItemH, $treeTypeIconH);
                     }
-                }             
+                    .title-label {
+                    }
+                }
             }
         }
 
         // Sets the margin on the left, which causes the
         // running indentation after each folder is made
         ul.tree {
-            margin-left: $mobile-runningTreeLeft;
+            margin-left: $mobileTreeItemIndent;
         }
     }
 }
diff --git a/platform/commonUI/general/res/sass/mobile/controls/_menus.scss b/platform/commonUI/general/res/sass/mobile/controls/_menus.scss
index 40aef796ee..3c8ea79917 100644
--- a/platform/commonUI/general/res/sass/mobile/controls/_menus.scss
+++ b/platform/commonUI/general/res/sass/mobile/controls/_menus.scss
@@ -20,15 +20,24 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 
-// Mobile hamburger icon is
-// sized according to the device
-.mobile-menu-icon {
-    display: inline-block;
-    @include phoneandtablet {
-        font-size: 21px;
-        padding-top: $imageThumbPad;
+// Override the Create menu for mobile
+@include phoneandtablet {
+    .menu-element {
+        .super-menu {
+            $d: 250px;
+            width: $d;
+            height: $d;
+
+            .pane {
+                &.left {
+                    border-right: none;
+                    padding-right: 0;
+                    width: 100%;
+                }
+                &.right {
+                    display: none;
+                }
+            }
+        }
     }
-    @include desktop {
-        display: none;
-    }       
 }
diff --git a/platform/commonUI/general/res/sass/mobile/overlay/_overlay.scss b/platform/commonUI/general/res/sass/mobile/overlay/_overlay.scss
index ac99a36d17..2c455a9941 100644
--- a/platform/commonUI/general/res/sass/mobile/overlay/_overlay.scss
+++ b/platform/commonUI/general/res/sass/mobile/overlay/_overlay.scss
@@ -1,11 +1,51 @@
-.overlay {
-    @include phoneandtablet {
+@include phoneandtablet {
+    .overlay {
         $m: 0;
-        // Removes curved edges on the dialog box
-        // and makes it take up fullscreen
-        >.holder {
-          @include border-radius($m);
-          top: $m; right: $m; bottom: $m; left: $m;
+        .clk-icon.close {
+            top: $mobileOverlayMargin; right: $mobileOverlayMargin;
+        }
+
+        > .holder {
+            @include border-radius($m);
+            top: $m;
+            right: $m;
+            bottom: $m;
+            left: $m;
+            > .contents {
+                top: $mobileOverlayMargin;
+                right: $mobileOverlayMargin;
+                bottom: $mobileOverlayMargin;
+                left: $mobileOverlayMargin;
+
+                .top-bar {
+                    > .title {
+                        margin-right: 1.2em;
+                    }
+                }
+
+                .form.editor {
+                    border: none;
+
+                    .contents {
+                        top: 0;
+                        right: 0;
+                        bottom: 0;
+                        left: 0;
+                    }
+                }
+            }
+        }
+    }
+}
+
+@include phone {
+    .overlay > .holder > .contents .form.editor .contents .form-row {
+        > .label,
+        > .controls {
+            //@include test(blue);
+            display: block;
+            float: none;
+            width: 100%;
         }
     }
 }
\ No newline at end of file
diff --git a/platform/commonUI/general/res/sass/overlay/_overlay.scss b/platform/commonUI/general/res/sass/overlay/_overlay.scss
index 692db103e1..f5c9cd477f 100644
--- a/platform/commonUI/general/res/sass/overlay/_overlay.scss
+++ b/platform/commonUI/general/res/sass/overlay/_overlay.scss
@@ -24,16 +24,10 @@
 		background: $colorOvrBlocker;
 		z-index: 100;
 	}
-    .btn.close {
-	    @include border-radius($basicCr * 2);
-	    padding: 3px 6px;
+    .clk-icon.close {
         position: absolute;
-	    border: none;
-        top: $interiorMarginSm; right: $interiorMarginSm; bottom: auto; left: auto;
+        top: $interiorMarginLg; right: $interiorMarginLg; bottom: auto; left: auto;
 	    z-index: 100;
-    }
-    .editor {
-//        background: $colorBodyBg;
     }
 	>.holder {
 		$i: 15%;
@@ -43,13 +37,13 @@
 		top: $i; right: $i; bottom: $i; left: $i;
 		z-index: 101;
         >.contents {
-            $m: 25px;
+            $m: $overlayMargin;
             top: $m; right: $m; bottom: $m; left: $m;
         }
 	}
     .title {
 	    @include ellipsize();
-        font-size: 1.3em;
+        font-size: 1.2em;
 	    margin-bottom: $interiorMargin;
     }
     
diff --git a/platform/commonUI/general/res/sass/tree/_tree.scss b/platform/commonUI/general/res/sass/tree/_tree.scss
index def2526c61..65ddab2a63 100644
--- a/platform/commonUI/general/res/sass/tree/_tree.scss
+++ b/platform/commonUI/general/res/sass/tree/_tree.scss
@@ -27,6 +27,7 @@ ul.tree {
 		position: relative;
 		span.tree-item {
 			$runningItemW: 0;
+			@include box-sizing(border-box);
 			@include border-radius($basicCr);
 			@include single-transition(background-color, 0.25s);
 			display: block;
@@ -55,14 +56,20 @@ ul.tree {
 //				@include test(orange);
 				@include absPosDefault();
 				//left: $runningItemW + $interiorMargin; // Adding pad to left to make room for link icon
+				line-height: $menuLineH;
 				left: $runningItemW;
 
 				.type-icon {
-					@include absPosDefault(0, false);
+					//@include absPosDefault(0, false);
+					$d: $treeTypeIconH; // 16px is crisp size
 					@include txtShdwSubtle(0.6);
+					font-size: $d;
 					color: $colorItemTreeIcon;
 					left: $interiorMargin;
-                    right: auto; width: 1em;
+					position: absolute;
+					@include verticalCenterBlock($menuLineHPx, $d);
+					line-height: 100%;
+                    right: auto; width: $d;
 
 					.icon {
 						&.l-icon-link,
@@ -81,8 +88,7 @@ ul.tree {
 							$d: 8px;
 							@include ancillaryIcon($d, $colorIconLink);
 							left: -3px;
-							bottom: 5px;
-
+							bottom: 0px;
 						}
 					}
 				}
@@ -126,7 +132,7 @@ ul.tree {
                 // NOTE: [Mobile] Removed Hover on Mobile
                 @include desktop {
                     &:hover {
-                        background: lighten($colorBodyBg, 5%);
+                        background: rgba(#fff, 0.1); //lighten($colorBodyBg, 5%);
                         color: lighten($colorBodyFg, 20%);
                         .context-trigger {
                             display: block;
diff --git a/platform/commonUI/general/res/sass/user-environ/_frame.scss b/platform/commonUI/general/res/sass/user-environ/_frame.scss
index 3fdc925b5b..f04071fa0e 100644
--- a/platform/commonUI/general/res/sass/user-environ/_frame.scss
+++ b/platform/commonUI/general/res/sass/user-environ/_frame.scss
@@ -20,25 +20,23 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 .frame {
-	$ohH: 20px;
+	$ohH: 16px;
 	$bc: $colorInteriorBorder;
 	&.child-frame.panel {
 		background: $colorBodyBg;
 		border: 1px solid $bc;
 		&:hover {
 			border-color: lighten($bc, 10%);
-			//z-index: 2;
-		}
-		.contents {
-//			overflow: hidden;
 		}
 	}
 	>.object-header.abs {
+		//@include test(red);
 		font-size: 0.75em;
 		height: $ohH;
+		line-height: $ohH;
 	}
 	>.object-holder.abs {
-		top: $ohH + $interiorMarginSm;
+		top: $ohH + $interiorMargin;
 	}
 	.contents {
 		$myM: $interiorMargin;
@@ -48,16 +46,20 @@
 		left: $myM;
 	}
 	&.frame-template {
-		// Hide the view switcher by default when it's in an element that's in a frame context
-		// Frame template is used because we need to target the lowest nested frame
 		.view-switcher {
-			opacity: 0;
+			line-height: $ohH;
 			z-index: 10;
 		}
-		&:hover .view-switcher {
-			// Show the view switcher on frame hover
-			//display: inline-block !important;
-			opacity: 1;
+		// Hide the view switcher by default when it's in an element that's in a frame context
+		// Frame template is used because we need to target the lowest nested frame
+		@include desktop {
+			.view-switcher {
+				opacity: 0;
+			}
+			&:hover .view-switcher {
+				// Show the view switcher on frame hover
+				opacity: 1;
+			}
 		}
 	}
 	.view-switcher {
diff --git a/platform/commonUI/general/res/sass/user-environ/_layout.scss b/platform/commonUI/general/res/sass/user-environ/_layout.scss
index aaaceec3bd..bcb441237f 100644
--- a/platform/commonUI/general/res/sass/user-environ/_layout.scss
+++ b/platform/commonUI/general/res/sass/user-environ/_layout.scss
@@ -70,19 +70,27 @@
     &.abs {
 	    text-wrap: none;
 	    white-space: nowrap;
+        &.left,
+        .left {
+            width: 45%;
+            right: auto;
+        }
+        &.right,
+        .right {
+            width: 45%;
+            left: auto;
+            text-align: right;
+            .icon.major {
+                margin-left: $interiorMargin * 3;
+            }
+        }
     }
-    &.left,
-    .left {
-        width: 45% !important;
-        right: auto !important;
-    }
-    &.right,
-    .right {
-        width: 45% !important;
-        left: auto !important;
-        text-align: right;
-        .icon.major {
-            margin-left: $interiorMargin * 3;
+    &.l-flex {
+        display: flex;
+        flex-flow: row nowrap;
+        .left {
+            //@include test(green);
+            flex: 1 1 0;
         }
     }
 }
@@ -118,7 +126,7 @@
 		}
 	}
 
-	.bottom-bar {
+	.ue-bottom-bar {
         //@include absPosDefault($bodyMargin);
 		@include absPosDefault(0);// New status bar design
 		top: auto;
@@ -200,7 +208,8 @@
     .split-layout {
         .split-pane-component.pane.left {
             min-width: 150px;
-            max-width: 50%;
+            max-width: 800px;
+            width: $ueBrowseLeftPaneW;
         }
     }
 }
@@ -208,8 +217,8 @@
 .edit-mode {
     .split-layout {
         .split-pane-component.pane.right {
-            min-width: 150px;
-            max-width: 50%;
+            //min-width: 150px;
+            //max-width: 50%;
             .split-pane-component.pane.bottom {
                 min-height: 50px;
                 max-height: 80%;
@@ -243,6 +252,12 @@
 	        .right.abs {
 		        top: auto;
 	        }
+            //.left.abs {
+            //    @include tmpBorder(green);
+            //}
+            //.right.abs {
+            //    @include tmpBorder(red);
+            //}
         }
         .object-holder {
             top: $ueTopBarH + $interiorMarginLg;
@@ -284,6 +299,28 @@
 	}
 }
 
+.object-browse-bar .btn,
+.object-browse-bar .t-btn,
+.object-browse-bar .view-switcher,
+.top-bar .buttons-main .btn,
+.top-bar .buttons-main .t-btn,
+.top-bar .view-switcher,
+.tool-bar .btn,
+.tool-bar .t-btn {
+    $h: $btnToolbarH;
+    display: inline-block;
+    font-size: $h * $btnFontSizeToH;
+    line-height: 200%;
+    vertical-align: top;
+}
+
+.object-browse-bar,
+.top-bar {
+    .view-switcher {
+        margin-right: $interiorMarginLg * 2;
+    }
+}
+
 .vscroll {
     overflow-y: auto;
 }
diff --git a/platform/commonUI/general/res/sass/user-environ/_object-browse.scss b/platform/commonUI/general/res/sass/user-environ/_object-browse.scss
index 3ab3f8c5f7..602a8adeae 100644
--- a/platform/commonUI/general/res/sass/user-environ/_object-browse.scss
+++ b/platform/commonUI/general/res/sass/user-environ/_object-browse.scss
@@ -20,11 +20,19 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 .object-browse-bar {
+    //@include test(blue);
+    @include absPosDefault(0, visible);
+    @include box-sizing(border-box);
     height: $ueTopBarH;
     line-height: $ueTopBarH;
-    .items-select {
-        .btn-menu {
-            margin-right: $interiorMargin * 3;
+    white-space: nowrap;
+
+    .left {
+        padding-right: $interiorMargin;
+        .l-back {
+            display: inline-block;
+            float: left;
+            margin-right: $interiorMarginLg;
         }
     }
 }
\ No newline at end of file
diff --git a/platform/commonUI/general/res/sass/user-environ/_top-bar.scss b/platform/commonUI/general/res/sass/user-environ/_top-bar.scss
index e2ee1f105c..7bb5ecd852 100644
--- a/platform/commonUI/general/res/sass/user-environ/_top-bar.scss
+++ b/platform/commonUI/general/res/sass/user-environ/_top-bar.scss
@@ -20,23 +20,16 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 .top-bar {
-//	$h: $ueTopBarH - 5px;
-//	background: rgba(#ff0000, 0.2);
-//	line-height: $ueTopBarBtnH;
-
     &.browse,
     &.edit {
 	    border-bottom: 1px solid $colorInteriorBorder;
         top: $bodyMargin; right: $bodyMargin; bottom: auto; left: $bodyMargin;
         height: $ueTopBarEditH;
+		line-height: $ueTopBarH;
     }
 	
-	.action {
-	}
-	
 	.title {
 		color: #fff;
-//		font-weight: bold;
 	}
 	
 	.buttons-main {
@@ -44,9 +37,9 @@
 		left: auto;
 		text-align: right;
 //		width: 200px;
-		.btn {
-			margin-left: $interiorMargin;
-		}
+//		.btn {
+//			margin-left: $interiorMargin;
+//		}
 	}
 }
 
diff --git a/platform/commonUI/general/res/templates/controls/switcher.html b/platform/commonUI/general/res/templates/controls/switcher.html
index 3dec71ab6c..beaf497709 100644
--- a/platform/commonUI/general/res/templates/controls/switcher.html
+++ b/platform/commonUI/general/res/templates/controls/switcher.html
@@ -21,7 +21,7 @@
 -->
 <span ng-controller="ViewSwitcherController">
     <div
-	    class="view-switcher menu-element btn btn-menu dropdown click-invoke"
+	    class="view-switcher menu-element s-btn l-btn btn-menu dropdown click-invoke"
 	    ng-if="view.length > 1"
 	    ng-controller="ClickAwayController as toggle"
 	    >
diff --git a/platform/commonUI/general/res/templates/tree-node.html b/platform/commonUI/general/res/templates/tree-node.html
index 54aef8edbc..1d5559e668 100644
--- a/platform/commonUI/general/res/templates/tree-node.html
+++ b/platform/commonUI/general/res/templates/tree-node.html
@@ -21,14 +21,16 @@
 -->
 <span ng-controller="ToggleController as toggle">
     <span ng-controller="TreeNodeController as treeNode">
-        <span class="tree-item menus-to-left"
+        <span
+	        class="tree-item menus-to-left"
 	        ng-class="{selected: treeNode.isSelected()}"
 	        >
-            <mct-representation                                
+            <mct-representation
                 key="'label'"
 				mct-object="domainObject"
 				ng-model="ngModel"
-				ng-click="!treeNode.checkMobile() ? treeNode.setObject(ngModel, domainObject) : toggle.toggle(); treeNode.trackExpansion()"
+				ng-click="!treeNode.checkMobile() || model.composition == undefined ?
+				ngModel.selectedObject = domainObject : toggle.toggle(); treeNode.trackExpansion()"
 				>
             </mct-representation>
             <span
diff --git a/platform/commonUI/inspect/res/templates/info-button.html b/platform/commonUI/inspect/res/templates/info-button.html
index bfc43a8fa4..f41d48262b 100644
--- a/platform/commonUI/inspect/res/templates/info-button.html
+++ b/platform/commonUI/inspect/res/templates/info-button.html
@@ -21,6 +21,5 @@
 -->
 
 <!--The icon for the info button appearing in a grid item (list in folder)-->
-<div>
-    <a class='ui-symbol icon mobile-info'>i</a>
-</div>
+<a class='ui-symbol icon mobile-info'>&#xe608;</a>
+
diff --git a/platform/commonUI/inspect/src/gestures/InfoButtonGesture.js b/platform/commonUI/inspect/src/gestures/InfoButtonGesture.js
index d128392534..9dd3cf251c 100644
--- a/platform/commonUI/inspect/src/gestures/InfoButtonGesture.js
+++ b/platform/commonUI/inspect/src/gestures/InfoButtonGesture.js
@@ -68,7 +68,7 @@ define(
             // and then on any body touch the bubble is dismissed
             function showBubble(event) {
                 trackPosition(event);
-                
+                event.stopPropagation();
                 // Show the bubble, but on any touchstart on the
                 // body (anywhere) call hidebubble
                 dismissBubble = infoService.display(
diff --git a/platform/core/bundle.json b/platform/core/bundle.json
index 4b33f48f35..0643be2646 100644
--- a/platform/core/bundle.json
+++ b/platform/core/bundle.json
@@ -117,12 +117,6 @@
                         "pattern": "\\S+",
                         "required": true,
                         "cssclass": "l-med"
-                    },
-                    {
-                        "control": "checkbox",
-                        "name": "Display title by default",
-                        "key": "displayTitle",
-                        "property": [ "display", "title" ]
                     }
                 ]
             },
@@ -142,7 +136,11 @@
             {
                 "key": "unknown",
                 "name": "Unknown Type",
-                "glyph": "?"
+                "glyph": "\u003f"
+            },
+            {
+                "name": "Unknown Type",
+                "glyph": "\u003f"
             }
         ],
         "capabilities": [
diff --git a/platform/features/layout/res/templates/frame.html b/platform/features/layout/res/templates/frame.html
index df4e3390ad..0643f1645b 100644
--- a/platform/features/layout/res/templates/frame.html
+++ b/platform/features/layout/res/templates/frame.html
@@ -20,13 +20,12 @@
  at runtime from the About dialog for additional information.
 -->
 <div class="frame frame-template abs">
-    <div class="bar abs object-header object-top-bar">
-        <div class="title left abs">
-            <mct-representation key="'node'"
-                                mct-object="domainObject">
+    <div class="bar abs l-flex object-header object-top-bar">
+        <div class="left">
+            <mct-representation key="'object-header'" mct-object="domainObject">
             </mct-representation>
         </div>
-        <div class="btn-bar right abs">
+        <div class="btn-bar right">
             <mct-representation key="'switcher'"
                                 ng-model="representation"
                                 mct-object="domainObject">