diff --git a/platform/commonUI/general/res/css/forms.css b/platform/commonUI/general/res/css/forms.css
index 113a906725..903a2694f0 100644
--- a/platform/commonUI/general/res/css/forms.css
+++ b/platform/commonUI/general/res/css/forms.css
@@ -374,7 +374,7 @@ input[type="text"] {
   margin: 0 0 2px 2px;
   overflow: hidden;
   position: relative; }
-  /* line 148, ../sass/_mixins.scss */
+  /* line 173, ../sass/_mixins.scss */
   .form-control.select:not(.disabled):hover {
     background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
     background-size: 100%;
diff --git a/platform/commonUI/general/res/css/items.css b/platform/commonUI/general/res/css/items.css
index 92d6f49101..875fe8488f 100644
--- a/platform/commonUI/general/res/css/items.css
+++ b/platform/commonUI/general/res/css/items.css
@@ -119,7 +119,7 @@
     margin-bottom: 3px;
     margin-right: 3px;
     position: relative; }
-    /* line 148, ../sass/_mixins.scss */
+    /* line 173, ../sass/_mixins.scss */
     .items-holder .item.grid-item:not(.disabled):hover {
       background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzczNzM3MyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU5NTk1OSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
       background-size: 100%;
@@ -210,7 +210,7 @@
       background-image: -webkit-linear-gradient(#33ccff, #0099cc);
       background-image: linear-gradient(#33ccff, #0099cc);
       color: #80dfff; }
-      /* line 156, ../sass/_mixins.scss */
+      /* line 181, ../sass/_mixins.scss */
       .items-holder .item.grid-item.selected:not(.disabled):hover {
         background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2ZDlmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwYmZmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
         background-size: 100%;
diff --git a/platform/commonUI/general/res/css/theme-espresso.css b/platform/commonUI/general/res/css/theme-espresso.css
index c3dd06eed9..0a8a992ab4 100644
--- a/platform/commonUI/general/res/css/theme-espresso.css
+++ b/platform/commonUI/general/res/css/theme-espresso.css
@@ -217,17 +217,17 @@ a.disabled {
 
 @-moz-keyframes pulse {
   0% {
-    opacity: 0.2; }
+    opacity: 0.5; }
   100% {
     opacity: 1; } }
 @-webkit-keyframes pulse {
   0% {
-    opacity: 0.2; }
+    opacity: 0.5; }
   100% {
     opacity: 1; } }
 @keyframes pulse {
   0% {
-    opacity: 0.2; }
+    opacity: 0.5; }
   100% {
     opacity: 1; } }
 /* line 59, ../sass/_effects.scss */
@@ -235,9 +235,9 @@ a.disabled {
   -moz-animation-name: pulse;
   -webkit-animation-name: pulse;
   animation-name: pulse;
-  -moz-animation-duration: 1000ms;
-  -webkit-animation-duration: 1000ms;
-  animation-duration: 1000ms;
+  -moz-animation-duration: 750ms;
+  -webkit-animation-duration: 750ms;
+  animation-duration: 750ms;
   -moz-animation-direction: alternate;
   -webkit-animation-direction: alternate;
   animation-direction: alternate;
@@ -367,7 +367,12 @@ span {
 .hidden {
   display: none !important; }
 
-/* line 120, ../sass/_global.scss */
+/* line 121, ../sass/_global.scss */
+.paused:not(.s-btn):not(.s-icon-btn) {
+  border-color: #c56f01 !important;
+  color: #c56f01 !important; }
+
+/* line 127, ../sass/_global.scss */
 .sep {
   color: rgba(255, 255, 255, 0.2); }
 
@@ -466,27 +471,23 @@ span {
 .bar.abs, .btn-menu span.bar.l-click-area {
   text-wrap: none;
   white-space: nowrap; }
-  /* 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;
-    right: 0;
-    text-align: right; }
-    /* line 84, ../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 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 95, ../sass/user-environ/_layout.scss */
+/* line 91, ../sass/user-environ/_layout.scss */
 .user-environ .browse-area,
 .user-environ .edit-area,
 .user-environ .editor {
@@ -494,42 +495,42 @@ span {
   right: 5px;
   bottom: 30px;
   left: 5px; }
-/* line 106, ../sass/user-environ/_layout.scss */
+/* line 102, ../sass/user-environ/_layout.scss */
 .user-environ .browse-area > .contents,
 .user-environ .edit-area > .contents {
   left: 0;
   right: 0; }
-/* line 112, ../sass/user-environ/_layout.scss */
+/* line 108, ../sass/user-environ/_layout.scss */
 .user-environ .edit-area {
   top: 40px; }
-  /* line 115, ../sass/user-environ/_layout.scss */
+  /* line 111, ../sass/user-environ/_layout.scss */
   .user-environ .edit-area .tool-bar {
     bottom: auto;
     height: 30px;
     line-height: 25px; }
-  /* line 120, ../sass/user-environ/_layout.scss */
+  /* line 116, ../sass/user-environ/_layout.scss */
   .user-environ .edit-area .work-area {
     top: 40px; }
-/* line 125, ../sass/user-environ/_layout.scss */
+/* line 121, ../sass/user-environ/_layout.scss */
 .user-environ .bottom-bar {
   top: auto;
   right: 5px;
   bottom: 5px;
   left: 5px;
   height: 20px; }
-  /* line 131, ../sass/user-environ/_layout.scss */
+  /* line 127, ../sass/user-environ/_layout.scss */
   .user-environ .bottom-bar .status-holder {
     right: 110px; }
-  /* line 134, ../sass/user-environ/_layout.scss */
+  /* line 130, ../sass/user-environ/_layout.scss */
   .user-environ .bottom-bar .app-logo {
     left: auto;
     width: 105px; }
 
-/* line 141, ../sass/user-environ/_layout.scss */
+/* line 137, ../sass/user-environ/_layout.scss */
 .cols {
   overflow: hidden;
   *zoom: 1; }
-  /* line 143, ../sass/user-environ/_layout.scss */
+  /* line 139, ../sass/user-environ/_layout.scss */
   .cols .col {
     -moz-box-sizing: border-box;
     -webkit-box-sizing: border-box;
@@ -540,103 +541,103 @@ span {
     margin-left: 1.5%;
     padding-left: 5px;
     position: relative; }
-    /* line 151, ../sass/user-environ/_layout.scss */
+    /* line 147, ../sass/user-environ/_layout.scss */
     .cols .col:first-child {
       margin-left: 0;
       padding-left: 0; }
-  /* line 158, ../sass/user-environ/_layout.scss */
+  /* line 154, ../sass/user-environ/_layout.scss */
   .cols.cols-2 .col-1 {
     min-width: 250px;
     width: 48.5%; }
-  /* line 164, ../sass/user-environ/_layout.scss */
+  /* line 160, ../sass/user-environ/_layout.scss */
   .cols.cols-2-ff .col-100px {
     width: 100px; }
-  /* line 171, ../sass/user-environ/_layout.scss */
+  /* line 167, ../sass/user-environ/_layout.scss */
   .cols.cols-6 .col-1 {
     min-width: 83.33333px;
     width: 15.16667%; }
-  /* line 177, ../sass/user-environ/_layout.scss */
+  /* line 173, ../sass/user-environ/_layout.scss */
   .cols.cols-16 .col-1 {
     min-width: 31.25px;
     width: 4.75%; }
-  /* line 180, ../sass/user-environ/_layout.scss */
+  /* line 176, ../sass/user-environ/_layout.scss */
   .cols.cols-16 .col-2 {
     min-width: 62.5px;
     width: 11%; }
-  /* line 183, ../sass/user-environ/_layout.scss */
+  /* line 179, ../sass/user-environ/_layout.scss */
   .cols.cols-16 .col-7 {
     min-width: 218.75px;
     width: 42.25%; }
-  /* line 189, ../sass/user-environ/_layout.scss */
+  /* line 185, ../sass/user-environ/_layout.scss */
   .cols.cols-32 .col-2 {
     min-width: 31.25px;
     width: 4.75%; }
-  /* line 192, ../sass/user-environ/_layout.scss */
+  /* line 188, ../sass/user-environ/_layout.scss */
   .cols.cols-32 .col-15 {
     min-width: 234.375px;
     width: 45.375%; }
-  /* line 196, ../sass/user-environ/_layout.scss */
+  /* line 192, ../sass/user-environ/_layout.scss */
   .cols .l-row {
     overflow: hidden;
     *zoom: 1;
     padding: 5px 0; }
 
-/* line 202, ../sass/user-environ/_layout.scss */
+/* line 198, ../sass/user-environ/_layout.scss */
 .pane {
   position: absolute; }
-  /* line 205, ../sass/user-environ/_layout.scss */
+  /* line 201, ../sass/user-environ/_layout.scss */
   .pane.treeview .create-btn-holder {
     bottom: auto;
     top: 0;
     height: 30px; }
-    /* line 208, ../sass/user-environ/_layout.scss */
+    /* line 204, ../sass/user-environ/_layout.scss */
     .pane.treeview .create-btn-holder .wrapper.menu-element {
       position: absolute;
       bottom: 5px; }
-  /* line 213, ../sass/user-environ/_layout.scss */
+  /* line 209, ../sass/user-environ/_layout.scss */
   .pane.treeview .tree-holder {
     overflow: auto;
     top: 35px; }
-  /* line 221, ../sass/user-environ/_layout.scss */
+  /* line 217, ../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 225, ../sass/user-environ/_layout.scss */
+  /* line 221, ../sass/user-environ/_layout.scss */
   .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 {
     bottom: 5px; }
-  /* line 229, ../sass/user-environ/_layout.scss */
+  /* line 225, ../sass/user-environ/_layout.scss */
   .pane.items .object-holder {
     top: 35px; }
-  /* line 234, ../sass/user-environ/_layout.scss */
+  /* line 230, ../sass/user-environ/_layout.scss */
   .pane.edit-main .object-holder {
     top: 0; }
-  /* line 240, ../sass/user-environ/_layout.scss */
+  /* line 236, ../sass/user-environ/_layout.scss */
   .pane .object-holder {
     overflow: auto; }
 
-/* line 248, ../sass/user-environ/_layout.scss */
+/* line 244, ../sass/user-environ/_layout.scss */
 .split-layout.horizontal > .pane {
   margin-top: 5px; }
-  /* line 251, ../sass/user-environ/_layout.scss */
+  /* line 247, ../sass/user-environ/_layout.scss */
   .split-layout.horizontal > .pane:first-child {
     margin-top: 0; }
-/* line 258, ../sass/user-environ/_layout.scss */
+/* line 254, ../sass/user-environ/_layout.scss */
 .split-layout.vertical > .pane {
   margin-left: 5px; }
-  /* line 260, ../sass/user-environ/_layout.scss */
+  /* line 256, ../sass/user-environ/_layout.scss */
   .split-layout.vertical > .pane > .holder {
     left: 0;
     right: 0; }
-  /* line 264, ../sass/user-environ/_layout.scss */
+  /* line 260, ../sass/user-environ/_layout.scss */
   .split-layout.vertical > .pane:first-child {
     margin-left: 0; }
-    /* line 266, ../sass/user-environ/_layout.scss */
+    /* line 262, ../sass/user-environ/_layout.scss */
     .split-layout.vertical > .pane:first-child .holder {
       right: 5px; }
 
-/* line 275, ../sass/user-environ/_layout.scss */
+/* line 271, ../sass/user-environ/_layout.scss */
 .vscroll {
   overflow-y: auto; }
 
@@ -1042,7 +1043,7 @@ span {
   display: inline-block;
   font-size: 1rem;
   vertical-align: middle; }
-  /* line 200, ../sass/_mixins.scss */
+  /* line 225, ../sass/_mixins.scss */
   .invoke-menu:hover {
     color: #33ccff; }
 
@@ -1054,7 +1055,7 @@ span {
 /* line 70, ../sass/_icons.scss */
 .icon-buttons-main .invoke-menu {
   color: #666666; }
-  /* line 200, ../sass/_mixins.scss */
+  /* line 225, ../sass/_mixins.scss */
   .icon-buttons-main .invoke-menu:hover {
     color: #999999; }
 
@@ -1343,7 +1344,7 @@ span {
   cursor: pointer; }
 
 /*********************************** STYLE STYLES */
-/* line 31, ../sass/controls/_buttons.scss */
+/* line 30, ../sass/controls/_buttons.scss */
 .s-btn, .s-icon-btn {
   -moz-border-radius: 3px;
   -webkit-border-radius: 3px;
@@ -1353,9 +1354,8 @@ span {
   box-sizing: border-box;
   text-shadow: rgba(0, 0, 0, 0.3) 0 1px 1px;
   line-height: 1.2em;
-  padding: 0 10px;
   text-decoration: none; }
-  /* line 39, ../sass/controls/_buttons.scss */
+  /* line 36, ../sass/controls/_buttons.scss */
   .s-btn.s-very-subtle, .s-very-subtle.s-icon-btn {
     background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzQwNDA0MCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
     background-size: 100%;
@@ -1376,7 +1376,7 @@ span {
     border-top: 1px solid #666666;
     color: #999;
     display: inline-block; }
-    /* line 103, ../sass/_mixins.scss */
+    /* line 128, ../sass/_mixins.scss */
     .s-btn.s-very-subtle:hover, .s-very-subtle.s-icon-btn:hover {
       background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU5NTk1OSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
       background-size: 100%;
@@ -1384,34 +1384,102 @@ span {
       background-image: -moz-linear-gradient(#666666, #595959);
       background-image: -webkit-linear-gradient(#666666, #595959);
       background-image: linear-gradient(#666666, #595959); }
+    /* line 38, ../sass/controls/_buttons.scss */
+    .s-btn.s-very-subtle.paused, .s-very-subtle.paused.s-icon-btn {
+      background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y4OGMwMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2RlN2QwMSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
+      background-size: 100%;
+      background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f88c01), color-stop(100%, #de7d01));
+      background-image: -moz-linear-gradient(#f88c01, #de7d01);
+      background-image: -webkit-linear-gradient(#f88c01, #de7d01);
+      background-image: linear-gradient(#f88c01, #de7d01);
+      -moz-border-radius: 3px;
+      -webkit-border-radius: 3px;
+      border-radius: 3px;
+      -moz-box-sizing: border-box;
+      -webkit-box-sizing: border-box;
+      box-sizing: border-box;
+      -moz-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
+      -webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
+      box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
+      border: none;
+      border-top: 1px solid #fea32e;
+      color: #fff;
+      display: inline-block; }
+      /* line 128, ../sass/_mixins.scss */
+      .s-btn.s-very-subtle.paused:hover, .s-very-subtle.paused.s-icon-btn:hover {
+        background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZlYTMyZSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZlOTgxNSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
+        background-size: 100%;
+        background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fea32e), color-stop(100%, #fe9815));
+        background-image: -moz-linear-gradient(#fea32e, #fe9815);
+        background-image: -webkit-linear-gradient(#fea32e, #fe9815);
+        background-image: linear-gradient(#fea32e, #fe9815); }
+      /* line 40, ../sass/controls/_buttons.scss */
+      .s-btn.s-very-subtle.paused .icon:before, .s-very-subtle.paused.s-icon-btn .icon:before {
+        content: "\0000EF"; }
 
-/* line 44, ../sass/controls/_buttons.scss */
+/* line 47, ../sass/controls/_buttons.scss */
 .s-icon-btn {
   font-size: 1.2em; }
-  /* line 47, ../sass/controls/_buttons.scss */
+  /* line 50, ../sass/controls/_buttons.scss */
   .s-icon-btn .icon {
     color: #0099cc; }
-  /* line 51, ../sass/controls/_buttons.scss */
-  .s-icon-btn:not(.disabled):hover .icon {
+  /* line 54, ../sass/controls/_buttons.scss */
+  .s-icon-btn.paused .icon {
+    color: #fff; }
+  /* line 62, ../sass/controls/_buttons.scss */
+  .s-icon-btn:not(.disabled):not(.paused):hover .icon {
     color: #33ccff; }
-  /* line 55, ../sass/controls/_buttons.scss */
+  /* line 69, ../sass/controls/_buttons.scss */
   .s-icon-btn.labeled {
-    padding: 0 5px; }
-    /* line 57, ../sass/controls/_buttons.scss */
+    padding: 0 3.75px; }
+    /* line 71, ../sass/controls/_buttons.scss */
     .s-icon-btn.labeled .icon {
       font-size: 1.5em; }
-    /* line 60, ../sass/controls/_buttons.scss */
+    /* line 74, ../sass/controls/_buttons.scss */
     .s-icon-btn.labeled .title-label {
       margin-left: 5px; }
+  /* line 80, ../sass/controls/_buttons.scss */
+  .s-icon-btn.pause-play.paused {
+    -moz-animation-name: pulse;
+    -webkit-animation-name: pulse;
+    animation-name: pulse;
+    -moz-animation-duration: 500ms;
+    -webkit-animation-duration: 500ms;
+    animation-duration: 500ms;
+    -moz-animation-direction: alternate;
+    -webkit-animation-direction: alternate;
+    animation-direction: alternate;
+    -moz-animation-iteration-count: infinite;
+    -webkit-animation-iteration-count: infinite;
+    animation-iteration-count: infinite;
+    -moz-animation-timing-function: ease-in-out;
+    -webkit-animation-timing-function: ease-in-out;
+    animation-timing-function: ease-in-out; }
+  /* line 83, ../sass/controls/_buttons.scss */
+  .s-icon-btn.pause-play .icon:before {
+    content: "\0000F1"; }
+  /* line 89, ../sass/controls/_buttons.scss */
+  .s-icon-btn.show-thumbs .icon:before {
+    content: "\000039"; }
 
 /*********************************** LAYOUT STYLES */
-/* line 68, ../sass/controls/_buttons.scss */
+/* line 96, ../sass/controls/_buttons.scss */
 span.l-btn,
 span.l-btn span,
 a.l-btn,
 a.l-btn span {
   display: inline-block; }
 
+/* line 103, ../sass/controls/_buttons.scss */
+.l-btn {
+  padding: 0 7.5px; }
+  /* line 105, ../sass/controls/_buttons.scss */
+  .l-btn.sm {
+    padding: 0 5px; }
+  /* line 108, ../sass/controls/_buttons.scss */
+  .l-btn.vsm {
+    padding: 0 2.5px; }
+
 /*****************************************************************************
  * Open MCT Web, Copyright (c) 2014-2015, United States Government
  * as represented by the Administrator of the National Aeronautics and Space
@@ -1640,7 +1708,7 @@ a.l-btn span {
     background-image: -webkit-linear-gradient(#33ccff, #0099cc);
     background-image: linear-gradient(#33ccff, #0099cc);
     color: #ccf2ff; }
-    /* line 156, ../sass/_mixins.scss */
+    /* line 181, ../sass/_mixins.scss */
     .btn.major:not(.disabled):hover {
       background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2ZDlmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwYmZmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
       background-size: 100%;
@@ -1676,7 +1744,7 @@ a.l-btn span {
       background-image: -webkit-linear-gradient(#4dd2ff, #00ace6);
       background-image: linear-gradient(#4dd2ff, #00ace6);
       color: #ccf2ff; }
-      /* line 156, ../sass/_mixins.scss */
+      /* line 181, ../sass/_mixins.scss */
       .btn.major:hover:not(.disabled):hover {
         background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzgwZGZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzFhYzZmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
         background-size: 100%;
@@ -1714,7 +1782,7 @@ a.l-btn span {
     border-top: 1px solid #999999;
     color: #cccccc;
     display: inline-block; }
-    /* line 148, ../sass/_mixins.scss */
+    /* line 173, ../sass/_mixins.scss */
     .btn.subtle:not(.disabled):hover {
       background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzk5OTk5OSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzgwODA4MCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
       background-size: 100%;
@@ -1743,7 +1811,7 @@ a.l-btn span {
     border-top: 1px solid #666666;
     color: #b3b3b3;
     display: inline-block; }
-    /* line 148, ../sass/_mixins.scss */
+    /* line 173, ../sass/_mixins.scss */
     .btn.very-subtle:not(.disabled):hover {
       background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
       background-size: 100%;
@@ -1946,7 +2014,7 @@ label.checkbox.custom {
   display: inline-block;
   height: 20px;
   line-height: 20px; }
-  /* line 148, ../sass/_mixins.scss */
+  /* line 173, ../sass/_mixins.scss */
   .btn-menu:not(.disabled):hover {
     background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
     background-size: 100%;
@@ -2100,7 +2168,7 @@ label.checkbox.custom {
   auto: 0;
   bottom: auto;
   left: auto; }
-  /* line 148, ../sass/_mixins.scss */
+  /* line 173, ../sass/_mixins.scss */
   .slider .knob:not(.disabled):hover {
     background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
     background-size: 100%;
@@ -2108,7 +2176,7 @@ label.checkbox.custom {
     background-image: -moz-linear-gradient(#666666, #4d4d4d);
     background-image: -webkit-linear-gradient(#666666, #4d4d4d);
     background-image: linear-gradient(#666666, #4d4d4d); }
-  /* line 120, ../sass/_mixins.scss */
+  /* line 145, ../sass/_mixins.scss */
   .slider .knob:before {
     content: '';
     display: block;
@@ -2119,7 +2187,7 @@ label.checkbox.custom {
     left: 2px;
     bottom: 5px;
     top: 5px; }
-  /* line 141, ../sass/_mixins.scss */
+  /* line 166, ../sass/_mixins.scss */
   .slider .knob:not(.disabled):hover:before {
     border-color: rgba(0, 153, 204, 0.9); }
   /* line 466, ../sass/controls/_controls.scss */
@@ -2283,7 +2351,7 @@ label.checkbox.custom {
     .menu-element .menu ul {
       margin: 0;
       padding: 0; }
-      /* line 208, ../sass/_mixins.scss */
+      /* line 233, ../sass/_mixins.scss */
       .menu-element .menu ul li {
         list-style-type: none;
         margin: 0;
@@ -2448,6 +2516,171 @@ label.checkbox.custom {
   right: 0;
   width: auto; }
 
+/* line 1, ../sass/features/_imagery.scss */
+.l-image-main-wrapper,
+.l-image-main,
+.l-image-main-controlbar,
+.l-image-main-controlbar .left,
+.l-image-main-controlbar .right,
+.l-image-thumbs-wrapper {
+  overflow: false;
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  width: auto;
+  height: auto; }
+
+/*************************************** MAIN LAYOUT */
+/* line 11, ../sass/features/_imagery.scss */
+.l-image-main-wrapper {
+  bottom: 178px;
+  min-height: 100px;
+  min-width: 150px; }
+  /* line 16, ../sass/features/_imagery.scss */
+  .l-image-main-wrapper .l-image-main {
+    background-color: rgba(255, 255, 255, 0.1);
+    bottom: 25px; }
+  /* line 20, ../sass/features/_imagery.scss */
+  .l-image-main-wrapper .l-image-main-controlbar {
+    top: auto;
+    height: 20px; }
+
+/* line 26, ../sass/features/_imagery.scss */
+.l-image-thumbs-wrapper {
+  top: auto;
+  height: 168px; }
+
+/* line 32, ../sass/features/_imagery.scss */
+.l-date,
+.l-time,
+.l-timezone {
+  display: inline-block; }
+
+/*************************************** MAIN IMAGE */
+/* line 40, ../sass/features/_imagery.scss */
+.l-image-main,
+.l-image-thumb-item .l-thumb {
+  background-size: contain;
+  background-position: center;
+  background-repeat: no-repeat; }
+
+/* line 47, ../sass/features/_imagery.scss */
+.l-image-main-controlbar {
+  font-size: 0.8em;
+  line-height: 20px; }
+  /* line 51, ../sass/features/_imagery.scss */
+  .l-image-main-controlbar .left, .l-image-main-controlbar .right {
+    direction: rtl;
+    overflow: hidden; }
+  /* line 55, ../sass/features/_imagery.scss */
+  .l-image-main-controlbar .left {
+    text-align: left;
+    width: 75% !important; }
+  /* line 60, ../sass/features/_imagery.scss */
+  .l-image-main-controlbar .right {
+    min-width: 40px;
+    width: 25% !important;
+    z-index: 2; }
+  /* line 66, ../sass/features/_imagery.scss */
+  .l-image-main-controlbar .l-date,
+  .l-image-main-controlbar .l-time {
+    color: #fff; }
+  /* line 70, ../sass/features/_imagery.scss */
+  .l-image-main-controlbar .l-mag {
+    direction: ltr;
+    display: inline-block; }
+    /* line 74, ../sass/features/_imagery.scss */
+    .l-image-main-controlbar .l-mag:before {
+      content: "\000058"; }
+  /* line 78, ../sass/features/_imagery.scss */
+  .l-image-main-controlbar .s-mag {
+    color: #666666; }
+  /* line 81, ../sass/features/_imagery.scss */
+  .l-image-main-controlbar .l-btn.show-thumbs {
+    display: none; }
+
+/* line 86, ../sass/features/_imagery.scss */
+.s-image-main {
+  border: 1px solid transparent; }
+  /* line 88, ../sass/features/_imagery.scss */
+  .s-image-main.paused {
+    border-color: #c56f01; }
+
+/*************************************** THUMBS */
+/* line 98, ../sass/features/_imagery.scss */
+.l-image-thumbs-wrapper {
+  direction: rtl;
+  overflow-x: auto;
+  overflow-y: hidden;
+  padding-bottom: 5px;
+  white-space: nowrap;
+  z-index: 70; }
+
+/* line 108, ../sass/features/_imagery.scss */
+.l-image-thumb-item {
+  -moz-transition: background-color 0.25s;
+  -o-transition: background-color 0.25s;
+  -webkit-transition: background-color 0.25s;
+  transition: background-color 0.25s;
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+  padding: 1px;
+  position: relative;
+  cursor: pointer;
+  direction: ltr;
+  display: inline-block;
+  font-size: 0.8em;
+  margin-left: 3px;
+  text-align: left;
+  width: 122px;
+  white-space: normal; }
+  /* line 113, ../sass/features/_imagery.scss */
+  .l-image-thumb-item .l-thumb,
+  .l-image-thumb-item .l-date,
+  .l-image-thumb-item .l-time {
+    display: inline-block; }
+  /* line 118, ../sass/features/_imagery.scss */
+  .l-image-thumb-item .l-date,
+  .l-image-thumb-item .l-time {
+    padding: 2px 3px; }
+  /* line 130, ../sass/features/_imagery.scss */
+  .l-image-thumb-item:hover {
+    background: rgba(255, 255, 255, 0.2); }
+    /* line 132, ../sass/features/_imagery.scss */
+    .l-image-thumb-item:hover .l-date,
+    .l-image-thumb-item:hover .l-time {
+      color: #fff; }
+  /* line 137, ../sass/features/_imagery.scss */
+  .l-image-thumb-item.selected {
+    background: #005177; }
+    /* line 139, ../sass/features/_imagery.scss */
+    .l-image-thumb-item.selected .l-date,
+    .l-image-thumb-item.selected .l-time {
+      color: #fff; }
+  /* line 144, ../sass/features/_imagery.scss */
+  .l-image-thumb-item .l-thumb {
+    background-color: rgba(255, 255, 255, 0.1);
+    height: 120px;
+    width: 120px;
+    margin-top: 0; }
+
+/*************************************** WHEN IN FRAME */
+/* line 154, ../sass/features/_imagery.scss */
+.frame .t-imagery .l-image-main-wrapper {
+  bottom: 0; }
+  /* line 156, ../sass/features/_imagery.scss */
+  .frame .t-imagery .l-image-main-wrapper .l-image-main-controlbar {
+    font-size: 0.7em; }
+  /* line 159, ../sass/features/_imagery.scss */
+  .frame .t-imagery .l-image-main-wrapper .l-btn.show-thumbs {
+    display: inline-block; }
+/* line 163, ../sass/features/_imagery.scss */
+.frame .t-imagery .l-image-thumbs-wrapper {
+  display: none; }
+
 /*****************************************************************************
  * Open MCT Web, Copyright (c) 2014-2015, United States Government
  * as represented by the Administrator of the National Aeronautics and Space
@@ -2769,7 +3002,7 @@ input[type="text"] {
   margin: 0 0 2px 2px;
   overflow: hidden;
   position: relative; }
-  /* line 148, ../sass/_mixins.scss */
+  /* line 173, ../sass/_mixins.scss */
   .form-control.select:not(.disabled):hover {
     background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
     background-size: 100%;
@@ -3699,106 +3932,168 @@ 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/helpers/_bubbles.scss */
-.l-infobubble-wrapper {
-  -moz-box-shadow: rgba(0, 0, 0, 0.4) 0 1px 5px;
-  -webkit-box-shadow: rgba(0, 0, 0, 0.4) 0 1px 5px;
-  box-shadow: rgba(0, 0, 0, 0.4) 0 1px 5px;
+/* line 24, ../sass/helpers/_bubbles.scss */
+.l-bubble-wrapper {
   position: absolute;
   z-index: 70; }
-  /* line 32, ../sass/helpers/_bubbles.scss */
-  .l-infobubble-wrapper .l-infobubble {
-    display: inline-block;
-    max-width: 250px;
+  /* line 27, ../sass/helpers/_bubbles.scss */
+  .l-bubble-wrapper .l-bubble {
     padding: 5px 10px; }
-    /* line 36, ../sass/helpers/_bubbles.scss */
-    .l-infobubble-wrapper .l-infobubble:before {
+    /* line 29, ../sass/helpers/_bubbles.scss */
+    .l-bubble-wrapper .l-bubble .l-btn.close {
+      padding: 0 2px;
+      position: absolute;
+      right: 5px;
+      top: 5px; }
+  /* line 36, ../sass/helpers/_bubbles.scss */
+  .l-bubble-wrapper .arw {
+    position: absolute; }
+    /* line 38, ../sass/helpers/_bubbles.scss */
+    .l-bubble-wrapper .arw.arw-up {
+      bottom: 100%; }
+    /* line 42, ../sass/helpers/_bubbles.scss */
+    .l-bubble-wrapper .arw.arw-down {
+      top: 100%; }
+  /* line 47, ../sass/helpers/_bubbles.scss */
+  .l-bubble-wrapper .l-infobubble {
+    display: inline-block;
+    max-width: 250px; }
+    /* line 51, ../sass/helpers/_bubbles.scss */
+    .l-bubble-wrapper .l-infobubble:before {
       content: "";
       position: absolute;
       width: 0;
       height: 0; }
-    /* line 42, ../sass/helpers/_bubbles.scss */
-    .l-infobubble-wrapper .l-infobubble table {
+    /* line 57, ../sass/helpers/_bubbles.scss */
+    .l-bubble-wrapper .l-infobubble table {
       width: 100%; }
-      /* line 45, ../sass/helpers/_bubbles.scss */
-      .l-infobubble-wrapper .l-infobubble table tr td {
+      /* line 60, ../sass/helpers/_bubbles.scss */
+      .l-bubble-wrapper .l-infobubble table tr td {
         padding: 2px 0;
         vertical-align: top; }
-        /* line 52, ../sass/helpers/_bubbles.scss */
-        .l-infobubble-wrapper .l-infobubble table tr td.label {
+        /* line 67, ../sass/helpers/_bubbles.scss */
+        .l-bubble-wrapper .l-infobubble table tr td.label {
           padding-right: 10px;
           white-space: nowrap; }
-        /* line 56, ../sass/helpers/_bubbles.scss */
-        .l-infobubble-wrapper .l-infobubble table tr td.value {
+        /* line 71, ../sass/helpers/_bubbles.scss */
+        .l-bubble-wrapper .l-infobubble table tr td.value {
           white-space: nowrap; }
-        /* line 60, ../sass/helpers/_bubbles.scss */
-        .l-infobubble-wrapper .l-infobubble table tr td.align-wrap {
+        /* line 75, ../sass/helpers/_bubbles.scss */
+        .l-bubble-wrapper .l-infobubble table tr td.align-wrap {
           white-space: normal; }
-    /* line 66, ../sass/helpers/_bubbles.scss */
-    .l-infobubble-wrapper .l-infobubble .title {
+    /* line 81, ../sass/helpers/_bubbles.scss */
+    .l-bubble-wrapper .l-infobubble .title {
       overflow: hidden;
       text-overflow: ellipsis;
       white-space: nowrap;
       margin-bottom: 5px; }
-  /* line 73, ../sass/helpers/_bubbles.scss */
-  .l-infobubble-wrapper.arw-left {
-    margin-left: 10px; }
-    /* line 75, ../sass/helpers/_bubbles.scss */
-    .l-infobubble-wrapper.arw-left .l-infobubble::before {
+  /* line 88, ../sass/helpers/_bubbles.scss */
+  .l-bubble-wrapper.arw-left {
+    margin-left: 20px; }
+    /* line 90, ../sass/helpers/_bubbles.scss */
+    .l-bubble-wrapper.arw-left .l-infobubble::before {
       right: 100%;
-      border-top: 5px solid transparent;
-      border-bottom: 5px solid transparent;
-      border-right: 7.5px solid #ddd; }
-  /* line 83, ../sass/helpers/_bubbles.scss */
-  .l-infobubble-wrapper.arw-right {
-    margin-right: 10px; }
-    /* line 85, ../sass/helpers/_bubbles.scss */
-    .l-infobubble-wrapper.arw-right .l-infobubble::before {
+      width: 0;
+      height: 0;
+      border-top: 6.66667px solid transparent;
+      border-bottom: 6.66667px solid transparent;
+      border-right: 10px solid #ddd; }
+  /* line 96, ../sass/helpers/_bubbles.scss */
+  .l-bubble-wrapper.arw-right {
+    margin-right: 20px; }
+    /* line 98, ../sass/helpers/_bubbles.scss */
+    .l-bubble-wrapper.arw-right .l-infobubble::before {
       left: 100%;
-      border-top: 5px solid transparent;
-      border-bottom: 5px solid transparent;
-      border-left: 7.5px solid #ddd; }
-  /* line 94, ../sass/helpers/_bubbles.scss */
-  .l-infobubble-wrapper.arw-top .l-infobubble::before {
-    top: 10px; }
-  /* line 100, ../sass/helpers/_bubbles.scss */
-  .l-infobubble-wrapper.arw-btm .l-infobubble::before {
-    bottom: 10px; }
+      width: 0;
+      height: 0;
+      border-top: 6.66667px solid transparent;
+      border-bottom: 6.66667px solid transparent;
+      border-left: 10px solid #ddd; }
   /* line 105, ../sass/helpers/_bubbles.scss */
-  .l-infobubble-wrapper.arw-down {
-    margin-bottom: 10px; }
-    /* line 107, ../sass/helpers/_bubbles.scss */
-    .l-infobubble-wrapper.arw-down .l-infobubble::before {
-      left: 50%;
-      top: 100%;
-      margin-left: -5px;
-      border-left: 5px solid transparent;
-      border-right: 5px solid transparent;
-      border-top: 7.5px solid #ddd; }
+  .l-bubble-wrapper.arw-top .l-infobubble::before {
+    top: 20px; }
+  /* line 111, ../sass/helpers/_bubbles.scss */
+  .l-bubble-wrapper.arw-btm .l-infobubble::before {
+    bottom: 20px; }
 
-/* line 120, ../sass/helpers/_bubbles.scss */
-.s-infobubble {
+/* line 121, ../sass/helpers/_bubbles.scss */
+.l-thumbsbubble-wrapper {
+  position: absolute;
+  height: 183px;
+  width: 100%; }
+  /* line 126, ../sass/helpers/_bubbles.scss */
+  .l-thumbsbubble-wrapper .l-thumbsbubble {
+    overflow: hidden;
+    position: absolute;
+    top: 0px;
+    right: 0px;
+    bottom: 0px;
+    left: 0px;
+    width: auto;
+    height: auto; }
+    /* line 128, ../sass/helpers/_bubbles.scss */
+    .l-thumbsbubble-wrapper .l-thumbsbubble .l-image-thumbs-wrapper {
+      height: auto;
+      top: 5px !important;
+      right: 25px;
+      bottom: 5px !important;
+      left: 5px; }
+  /* line 133, ../sass/helpers/_bubbles.scss */
+  .l-thumbsbubble-wrapper .arw {
+    z-index: 2; }
+  /* line 138, ../sass/helpers/_bubbles.scss */
+  .l-thumbsbubble-wrapper.arw-up .arw.arw-down, .l-thumbsbubble-wrapper.arw-down .arw.arw-up {
+    display: none; }
+
+/* line 148, ../sass/helpers/_bubbles.scss */
+.s-bubble {
   -moz-border-radius: 3px;
   -webkit-border-radius: 3px;
   border-radius: 3px;
+  -moz-box-shadow: rgba(0, 0, 0, 0.4) 0 1px 5px;
+  -webkit-box-shadow: rgba(0, 0, 0, 0.4) 0 1px 5px;
+  box-shadow: rgba(0, 0, 0, 0.4) 0 1px 5px; }
+
+/* line 154, ../sass/helpers/_bubbles.scss */
+.l-thumbsbubble-wrapper .arw-up {
+  width: 0;
+  height: 0;
+  border-left: 6.66667px solid transparent;
+  border-right: 6.66667px solid transparent;
+  border-bottom: 10px solid #4d4d4d; }
+/* line 157, ../sass/helpers/_bubbles.scss */
+.l-thumbsbubble-wrapper .arw-down {
+  width: 0;
+  height: 0;
+  border-left: 6.66667px solid transparent;
+  border-right: 6.66667px solid transparent;
+  border-top: 10px solid #4d4d4d; }
+
+/* line 161, ../sass/helpers/_bubbles.scss */
+.s-infobubble {
   background: #ddd;
   color: #666;
   font-size: 0.8rem; }
-  /* line 126, ../sass/helpers/_bubbles.scss */
+  /* line 166, ../sass/helpers/_bubbles.scss */
   .s-infobubble .title {
     color: #333333;
     font-weight: bold; }
-  /* line 131, ../sass/helpers/_bubbles.scss */
+  /* line 171, ../sass/helpers/_bubbles.scss */
   .s-infobubble tr td {
     border-top: 1px solid #c4c4c4;
     font-size: 0.9em; }
-  /* line 135, ../sass/helpers/_bubbles.scss */
+  /* line 175, ../sass/helpers/_bubbles.scss */
   .s-infobubble tr:first-child td {
     border-top: none; }
-  /* line 139, ../sass/helpers/_bubbles.scss */
+  /* line 179, ../sass/helpers/_bubbles.scss */
   .s-infobubble .value {
     color: #333333; }
 
+/* line 184, ../sass/helpers/_bubbles.scss */
+.s-thumbsbubble {
+  background: #4d4d4d;
+  color: #b3b3b3; }
+
 /*****************************************************************************
  * Open MCT Web, Copyright (c) 2014-2015, United States Government
  * as represented by the Administrator of the National Aeronautics and Space
@@ -3849,7 +4144,7 @@ input[type="text"] {
     right: 0;
     width: auto;
     height: 5px; }
-    /* line 120, ../sass/_mixins.scss */
+    /* line 145, ../sass/_mixins.scss */
     .split-layout.horizontal > .splitter:before {
       content: '';
       display: block;
@@ -3860,7 +4155,7 @@ input[type="text"] {
       top: 2px;
       left: 5px;
       right: 5px; }
-    /* line 141, ../sass/_mixins.scss */
+    /* line 166, ../sass/_mixins.scss */
     .split-layout.horizontal > .splitter:not(.disabled):hover:before {
       border-color: rgba(0, 153, 204, 0.9); }
 /* line 63, ../sass/helpers/_splitter.scss */
@@ -3878,7 +4173,7 @@ input[type="text"] {
   bottom: 0;
   cursor: col-resize;
   width: 5px; }
-  /* line 120, ../sass/_mixins.scss */
+  /* line 145, ../sass/_mixins.scss */
   .split-layout.vertical > .splitter:before {
     content: '';
     display: block;
@@ -3889,7 +4184,7 @@ input[type="text"] {
     left: 2px;
     bottom: 5px;
     top: 5px; }
-  /* line 141, ../sass/_mixins.scss */
+  /* line 166, ../sass/_mixins.scss */
   .split-layout.vertical > .splitter:not(.disabled):hover:before {
     border-color: rgba(0, 153, 204, 0.9); }
 
diff --git a/platform/commonUI/general/res/css/tree.css b/platform/commonUI/general/res/css/tree.css
index d39b47ef87..90e1957f25 100644
--- a/platform/commonUI/general/res/css/tree.css
+++ b/platform/commonUI/general/res/css/tree.css
@@ -86,7 +86,7 @@
 ul.tree {
   margin: 0;
   padding: 0; }
-  /* line 208, ../sass/_mixins.scss */
+  /* line 233, ../sass/_mixins.scss */
   ul.tree li {
     list-style-type: none;
     margin: 0;
diff --git a/platform/commonUI/general/res/fonts/symbols/wtdsymbols.eot b/platform/commonUI/general/res/fonts/symbols/wtdsymbols.eot
index bf781e614b..8d88908396 100644
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 2ca77321a4..36a0c4856f 100644
--- a/platform/commonUI/general/res/fonts/symbols/wtdsymbols.svg
+++ b/platform/commonUI/general/res/fonts/symbols/wtdsymbols.svg
@@ -2,7 +2,7 @@
 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
 <svg>
 <metadata>
-Created by FontForge 20090622 at Mon May  4 20:21:42 2015
+Created by FontForge 20090622 at Fri Jun  5 15:37:46 2015
  By deploy user
 Copyright 2015 Adobe Systems Incorporated. All rights reserved.
 </metadata>
@@ -62,8 +62,10 @@ q52 -180 95 -231q42 53 88 212z" />
 d="M193 787v-193h-193v193h193zM193 491v-195h-193v195h193zM193 193v-193h-193v193h193zM671 732v-82h-388v82h388zM671 435v-81h-388v81h388zM671 138v-82h-388v82h388z" />
     <glyph glyph-name="eight" unicode="8" horiz-adv-x="636" 
 d="M625 735v-318h-625v318h625zM625 315v-315h-625v315h625z" />
-    <glyph glyph-name="nine" unicode="9" horiz-adv-x="636" 
-d="M267 735v-319h-267v319h267zM267 315v-315h-267v315h267zM630 735v-319h-267v319h267zM630 315v-315h-267v315h267z" />
+    <glyph glyph-name="nine" unicode="9" 
+d="M328 469q0 -20 -13.5 -33.5t-33.5 -13.5h-234q-20 0 -33.5 13.5t-13.5 33.5v234q0 19 14 33t33 14h234q20 0 33.5 -13.5t13.5 -33.5v-234zM750 469q0 -20 -13.5 -33.5t-33.5 -13.5h-234q-20 0 -33.5 13.5t-13.5 33.5v234q0 20 13.5 33.5t33.5 13.5h234q19 0 33 -14
+t14 -33v-234zM328 47q0 -20 -13.5 -33.5t-33.5 -13.5h-234q-19 0 -33 14t-14 33v234q0 20 13.5 33.5t33.5 13.5h234q20 0 33.5 -13.5t13.5 -33.5v-234zM750 47q0 -19 -14 -33t-33 -14h-234q-20 0 -33.5 13.5t-13.5 33.5v234q0 20 13.5 33.5t33.5 13.5h234q20 0 33.5 -13.5
+t13.5 -33.5v-234z" />
     <glyph glyph-name="colon" unicode=":" horiz-adv-x="625" 
 d="M625 -19l-397 397l397 397v-794zM173 756v-735h-173v735h173z" />
     <glyph glyph-name="semicolon" unicode=";" horiz-adv-x="624" 
@@ -163,8 +165,8 @@ d="M123 367l-123 123v147l123 -123l220 221v-147zM123 0l-123 123v147l123 -123l220
 d="M123 93l-123 123v147l123 -123l220 220v-147zM485 262v71h313v-71h-313z" />
     <glyph glyph-name="l" unicode="l" horiz-adv-x="617" 
 d="M551 386h66v-386h-617v386h63v106q0 100 72 171.5t173 71.5q99 0 171 -71.5t72 -171.5v-106zM173 492v-106h267v106q0 56 -38.5 94.5t-93.5 38.5q-56 0 -95.5 -39t-39.5 -94z" />
-    <glyph glyph-name="m" unicode="m" horiz-adv-x="804" 
-d="M804 729v-156h-804v156h804zM804 445v-160h-804v160h804zM804 158v-158h-804v158h804z" />
+    <glyph glyph-name="m" unicode="m" horiz-adv-x="751" 
+d="M751 563h-751v188h751v-188zM751 282h-751v187h751v-187zM751 0h-751v188h751v-188z" />
     <glyph glyph-name="n" unicode="n" horiz-adv-x="738" 
 d="M690 697q48 -50 48 -88q0 -18 -10 -26l-243 -243l-3 -3l-4 -2l-227 -78l77 228l2 4l3 3l242 243q22 19 57 3q29 -14 58 -41zM461 371l1 2l-3 50l-34 2h-9v10v28l-51 6l-2 -1l-32 -97l33 -33zM249 512l-134 -389l304 104v-215q-136 -8 -246.5 29t-172.5 93v561
 q48 -42 125 -75.5t172 -43.5l-24 -25l-17 -17z" />
@@ -232,6 +234,19 @@ d="M748 750l-375 -750l-374 750h749z" />
 d="M-1 0l375 750l374 -750h-749z" />
     <glyph glyph-name="icircumflex" unicode="&#xee;" horiz-adv-x="748" 
 d="M748 750l-375 -375l-374 375h749zM748 375l-375 -374l-374 374h749z" />
+    <glyph glyph-name="idieresis" unicode="&#xef;" 
+d="M0 749l750 -375l-750 -374v749z" />
+    <glyph glyph-name="ntilde" unicode="&#xf1;" 
+d="M283 751v-751h-188v751h188zM658 751v-751h-188v751h188z" />
+    <glyph glyph-name="ograve" unicode="&#xf2;" horiz-adv-x="751" 
+d="M469 563h-102q-74 0 -126.5 -52.5t-52.5 -126.5v-102h-94q-38 0 -66 27.5t-28 65.5v282q0 38 28 66t66 28h281q39 0 66.5 -28t27.5 -66v-94zM657 469q38 0 66 -27.5t28 -66.5v-281q0 -38 -28 -66t-66 -28h-282q-38 0 -65.5 28t-27.5 66v281q0 39 27.5 66.5t65.5 27.5h282
+z" />
+    <glyph glyph-name="oacute" unicode="&#xf3;" horiz-adv-x="751" 
+d="M216 375l187 -187h-309q-38 0 -66 27.5t-28 66.5v375q0 38 28 66t66 28h375q39 0 66.5 -28t27.5 -66v-309l-188 187zM751 422v-422h-422v94h234l-281 281l93 94l282 -281v234h94z" />
+    <glyph glyph-name="ocircumflex" unicode="&#xf4;" horiz-adv-x="751" 
+d="M610 751q58 0 99.5 -41.5t41.5 -99.5v-469q0 -59 -41.5 -100t-99.5 -41h-469q-59 0 -100 41t-41 100v469q0 58 41 99.5t100 41.5h469zM610 282v328h-328l93 -94l-234 -375l375 234z" />
+    <glyph glyph-name="odieresis" unicode="&#xf6;" 
+d="M328 562v-375h-328v375h328zM750 562v-375h-328v375h328z" />
     <glyph glyph-name="fraction" unicode="&#x2044;" horiz-adv-x="761" 
 d="M380 751q158 0 269.5 -111.5t111.5 -268.5q0 -133 -82.5 -236.5t-209.5 -134.5l-4 491l-176 -490q-126 31 -207.5 134.5t-81.5 235.5q0 157 111.5 268.5t268.5 111.5zM168 488l55 20l-34 94l-56 -20zM410 530v100h-59v-100h59zM593 488l34 94l-55 20l-34 -94z" />
     <glyph glyph-name="H.002" horiz-adv-x="803" 
diff --git a/platform/commonUI/general/res/fonts/symbols/wtdsymbols.ttf b/platform/commonUI/general/res/fonts/symbols/wtdsymbols.ttf
index 58c3c8df75..1aac4ff008 100644
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 c028a58cff..a92850ddd3 100644
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 725c0c29b9..c966431b1f 100644
--- a/platform/commonUI/general/res/sass/_constants.scss
+++ b/platform/commonUI/general/res/sass/_constants.scss
@@ -34,9 +34,12 @@ $colorBodyBg: #333;
 $colorBodyFg: #999;
 $colorFooterBg: #000;
 $colorKey: #0099cc;
+$colorKeySelectedBg: #005177;
 $colorKeyFg: #fff;
 $colorAlt1: #ffc700;
 $colorAlert: #ff3c00;
+$colorPausedBg: #c56f01;
+$colorPausedFg: #fff;
 $colorCheck: $colorKey;
 $colorCreateBtn: $colorKey;
 $colorInteriorBorder: lighten($colorBodyBg, 10%);
@@ -50,7 +53,11 @@ $colorLimitYellow: #9d7500;
 $colorLimitRed: #aa0000;
 $colorTelemFresh: #fff;
 $colorTelemStale: #888;
-$styleTelemState: italic;
+$styleTelemStale: italic;
+$colorInfoBubbleFg: #666;
+$colorInfoBubbleBg: #ddd;
+$colorThumbsBubbleFg: lighten($colorBodyFg, 10%);
+$colorThumbsBubbleBg: lighten($colorBodyBg, 10%);
 
 // Ratios
 $ltGamma: 20%;
@@ -124,3 +131,13 @@ $tickLblH: 15px;
 $tickLblW: 50px;
 $tickH: $ticksH - $tickLblVMargin - $tickLblH;
 $tickW: 1px;
+
+// Imagery
+$imageMainControlBarH: 20px;
+$imageThumbsD: 120px;
+$imageThumbsWrapperH: $imageThumbsD * 1.4;
+$imageThumbPad: 1px;
+
+// Bubbles
+$bubbleArwSize: 10px;
+$bubblePad: $interiorMargin;
diff --git a/platform/commonUI/general/res/sass/_effects.scss b/platform/commonUI/general/res/sass/_effects.scss
index 40a1a24414..c90a035c82 100644
--- a/platform/commonUI/general/res/sass/_effects.scss
+++ b/platform/commonUI/general/res/sass/_effects.scss
@@ -44,7 +44,7 @@ a.disabled {
 }
 
 @include keyframes(pulse) {
-	0%   { opacity: 0.2; }
+	0%   { opacity: 0.5; }
 	100% { opacity: 1; }
 }
 
@@ -57,5 +57,5 @@ a.disabled {
 }
 
 .pulse {
-	@include pulse(1000ms);
+	@include pulse(750ms);
 }
\ No newline at end of file
diff --git a/platform/commonUI/general/res/sass/_global.scss b/platform/commonUI/general/res/sass/_global.scss
index 5a7293e4f2..0ada165ec9 100644
--- a/platform/commonUI/general/res/sass/_global.scss
+++ b/platform/commonUI/general/res/sass/_global.scss
@@ -117,6 +117,13 @@ span {
 	display: none !important;
 }
 
+.paused {
+	&:not(.s-btn) {
+		border-color: $colorPausedBg !important;
+		color: $colorPausedBg !important;
+	}
+}
+
 .sep {
 	color: rgba(#fff, 0.2);
 }
\ No newline at end of file
diff --git a/platform/commonUI/general/res/sass/_main.scss b/platform/commonUI/general/res/sass/_main.scss
index 3eb4397f91..ec2160048b 100644
--- a/platform/commonUI/general/res/sass/_main.scss
+++ b/platform/commonUI/general/res/sass/_main.scss
@@ -45,6 +45,7 @@
 @import "controls/controls";
 @import "controls/lists";
 @import "controls/menus";
+@import "features/imagery";
 @import "forms/mixins";
 @import "forms/elems";
 @import "forms/validation";
diff --git a/platform/commonUI/general/res/sass/_mixins.scss b/platform/commonUI/general/res/sass/_mixins.scss
index 3a99d6115c..107726e992 100644
--- a/platform/commonUI/general/res/sass/_mixins.scss
+++ b/platform/commonUI/general/res/sass/_mixins.scss
@@ -62,6 +62,31 @@
 	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;
+	}
+}
+
 @mixin bgDiagonalStripes($c: yellow, $a: 0.1, $d: 40px) {
 	@include background-image(linear-gradient(-45deg,
 		rgba($c, $a) 25%, transparent 25%,
diff --git a/platform/commonUI/general/res/sass/controls/_buttons.scss b/platform/commonUI/general/res/sass/controls/_buttons.scss
index abbe655810..f8328dcdb5 100644
--- a/platform/commonUI/general/res/sass/controls/_buttons.scss
+++ b/platform/commonUI/general/res/sass/controls/_buttons.scss
@@ -19,25 +19,28 @@
  * this source code distribution or the Licensing information page available
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
-$pad: $interiorMargin * 2;
+$pad: $interiorMargin * 1.5;
 
 /*********************************** TYPE STYLES */
 .t-btn {
 	cursor: pointer;
 }
 
-
 /*********************************** STYLE STYLES */
 .s-btn {
-	$base: lighten($colorBodyBg, 20%);
 	@include border-radius($controlCr);
 	@include box-sizing(border-box);
 	@include text-shadow(rgba(black, 0.3) 0 1px 1px);
 	line-height: 1.2em;
-	padding: 0 $pad;
 	text-decoration: none;
 	&.s-very-subtle {
 		@include containerSubtle($colorBodyBg, $colorBodyFg, true);
+		&.paused {
+			@include containerSubtle($colorPausedBg, $colorPausedFg, true);
+			.icon:before {
+				content:"\0000EF";
+			}
+		}
 	}
 }
 
@@ -47,9 +50,20 @@ $pad: $interiorMargin * 2;
 	.icon {
 		color: $colorKey;
 	}
+	&.paused {
+		.icon {
+			color: $colorPausedFg;
+		}
+	}
 
-	&:not(.disabled):hover .icon {
-		color: lighten($colorKey, $ltGamma);
+	&:not(.disabled) {
+		&:not(.paused) {
+			&:hover {
+				.icon {
+					color: lighten($colorKey, $ltGamma);
+				}
+			}
+		}
 	}
 
 	&.labeled {
@@ -61,8 +75,22 @@ $pad: $interiorMargin * 2;
 			margin-left: $interiorMargin;
 		}
 	}
-}
 
+	&.pause-play {
+		&.paused {
+			@include pulse(500ms);
+		}
+		.icon:before {
+			content:"\0000F1";
+		}
+	}
+
+	&.show-thumbs {
+		.icon:before {
+			content:"\000039";
+		}
+	}
+}
 
 /*********************************** LAYOUT STYLES */
 span.l-btn,
@@ -70,4 +98,14 @@ span.l-btn span,
 a.l-btn,
 a.l-btn span {
 	display: inline-block;
+}
+
+.l-btn {
+	padding: 0 $pad;
+	&.sm {
+		padding: 0 $interiorMargin;
+	}
+	&.vsm {
+		padding: 0 $interiorMargin/2;
+	}
 }
\ No newline at end of file
diff --git a/platform/commonUI/general/res/sass/features/_imagery.scss b/platform/commonUI/general/res/sass/features/_imagery.scss
new file mode 100644
index 0000000000..d31b296868
--- /dev/null
+++ b/platform/commonUI/general/res/sass/features/_imagery.scss
@@ -0,0 +1,166 @@
+.l-image-main-wrapper,
+.l-image-main,
+.l-image-main-controlbar,
+.l-image-main-controlbar .left,
+.l-image-main-controlbar .right,
+.l-image-thumbs-wrapper {
+	@include absPosDefault(0, false);
+}
+
+/*************************************** MAIN LAYOUT */
+.l-image-main-wrapper {
+	//@include test();
+	bottom: $interiorMargin*2 +  $imageThumbsWrapperH;
+	min-height: 100px;
+	min-width: 150px;
+	.l-image-main {
+		background-color: rgba(#fff, 0.1);
+		bottom: $imageMainControlBarH + $interiorMargin;
+	}
+	.l-image-main-controlbar {
+		top: auto;
+		height: $imageMainControlBarH;
+	}
+}
+
+.l-image-thumbs-wrapper {
+	//@include test(red);
+	top: auto;
+	height: $imageThumbsWrapperH;
+}
+
+.l-date,
+.l-time,
+.l-timezone {
+	display: inline-block;
+}
+
+/*************************************** MAIN IMAGE */
+
+.l-image-main,
+.l-image-thumb-item .l-thumb {
+	background-size: contain;
+	background-position: center;
+	background-repeat: no-repeat;
+}
+
+.l-image-main-controlbar {
+	//@include test();
+	font-size: 0.8em;
+	line-height: $imageMainControlBarH;
+	.left, .right {
+		direction: rtl;
+		overflow: hidden;
+	}
+	.left {
+		//@include test(red);
+		text-align: left;
+		width: 75% !important;
+	}
+	.right {
+		//@include test(green);
+		min-width: 40px;
+		width: 25% !important;
+		z-index: 2;
+	}
+	.l-date,
+	.l-time {
+		color: #fff;
+	}
+	.l-mag {
+		direction: ltr;
+		display: inline-block;
+		//white-space: nowrap;
+		&:before {
+			content: "\000058";
+		}
+	}
+	.s-mag {
+		color: darken($colorBodyFg, 20%);
+	}
+	.l-btn.show-thumbs {
+		display: none;
+	}
+}
+
+.s-image-main {
+	border: 1px solid transparent;
+	&.paused {
+		border-color: $colorPausedBg;
+	}
+}
+
+/*************************************** THUMBS */
+
+.l-image-thumb-item {
+}
+
+.l-image-thumbs-wrapper {
+	//@include test(green);
+	direction: rtl;
+	overflow-x: auto;
+	overflow-y: hidden;
+	padding-bottom: $interiorMargin;
+	white-space: nowrap;
+	z-index: 70;
+}
+
+.l-image-thumb-item {
+	@include single-transition(background-color, 0.25s);
+	@include box-sizing(border-box);
+	padding: 1px;
+	position: relative;
+	.l-thumb,
+	.l-date,
+	.l-time {
+		display: inline-block;
+	}
+	.l-date,
+	.l-time {
+		padding: 2px 3px;
+	}
+	cursor: pointer;
+	direction: ltr;
+	display: inline-block;
+	font-size: 0.8em;
+	margin-left: $interiorMarginSm;
+	text-align: left;
+	width: $imageThumbsD + $imageThumbPad*2;
+	white-space: normal;
+	&:hover {
+		background: rgba(#fff, 0.2);
+		.l-date,
+		.l-time {
+			color: #fff;
+		}
+	}
+	&.selected {
+		background: $colorKeySelectedBg;
+		.l-date,
+		.l-time {
+			color: #fff;
+		}
+	}
+	.l-thumb {
+		background-color: rgba(#fff, 0.1);
+		height: $imageThumbsD;
+		width: $imageThumbsD;
+		margin-top: 0;
+	}
+}
+
+/*************************************** WHEN IN FRAME */
+.frame .t-imagery {
+	.l-image-main-wrapper {
+		bottom: 0;
+		.l-image-main-controlbar {
+			font-size: 0.7em;
+		}
+		.l-btn.show-thumbs {
+			display: inline-block;
+		}
+	}
+	.l-image-thumbs-wrapper {
+		display: none;
+	}
+}
\ No newline at end of file
diff --git a/platform/commonUI/general/res/sass/helpers/_bubbles.scss b/platform/commonUI/general/res/sass/helpers/_bubbles.scss
index 61980cf554..2a499339ce 100644
--- a/platform/commonUI/general/res/sass/helpers/_bubbles.scss
+++ b/platform/commonUI/general/res/sass/helpers/_bubbles.scss
@@ -21,18 +21,33 @@
  *****************************************************************************/
 //************************************************* LAYOUT
 
-$infoBubbleFg: #666;
-$infoBubbleBg: #ddd;
-
-.l-infobubble-wrapper {
-	$arwSize: 5px;
-	@include box-shadow(rgba(black, 0.4) 0 1px 5px);
+.l-bubble-wrapper {
 	position: absolute;
 	z-index: 70;
+	.l-bubble {
+		padding: $bubblePad $bubblePad*2;
+		.l-btn.close {
+			padding: 0 2px;
+			position: absolute;
+			right: $interiorMargin;
+			top: $interiorMargin;
+		}
+	}
+	.arw {
+		position: absolute;
+		&.arw-up {
+			bottom: 100%;
+
+		}
+		&.arw-down {
+			top: 100%;
+		}
+	}
+
 	.l-infobubble {
 		display: inline-block;
 		max-width: 250px;
-		padding: 5px 10px;
+		//padding: 5px 10px;
 		&:before {
 			content:"";
 			position: absolute;
@@ -71,57 +86,82 @@ $infoBubbleBg: #ddd;
 	}
 
 	&.arw-left {
-		margin-left: $arwSize*2;
+		margin-left: $bubbleArwSize*2;
 		.l-infobubble::before {
 			right: 100%;
-			border-top: $arwSize solid transparent;
-			border-bottom: $arwSize solid transparent;
-			border-right: ($arwSize * 1.5) solid $infoBubbleBg;
+			@include triangle('left', $bubbleArwSize, 1.5, $colorInfoBubbleBg);
 		}
 	}
 
 	&.arw-right {
-		margin-right: $arwSize*2;
+		margin-right: $bubbleArwSize*2;
 		.l-infobubble::before {
 			left: 100%;
-			border-top: $arwSize solid transparent;
-			border-bottom: $arwSize solid transparent;
-			border-left: ($arwSize * 1.5) solid $infoBubbleBg;
+			@include triangle('right', $bubbleArwSize, 1.5, $colorInfoBubbleBg);
 		}
 	}
 
 	&.arw-top {
 		.l-infobubble::before {
-			top: $arwSize * 2;
+			top: $bubbleArwSize * 2;
 		}
 	}
 
 	&.arw-btm {
 		.l-infobubble::before {
-			bottom: $arwSize * 2;
+			bottom: $bubbleArwSize * 2;
 		}
 	}
 
 	&.arw-down {
-		margin-bottom: $arwSize*2;
-		.l-infobubble::before {
-			left: 50%;
-			top: 100%;
-			margin-left: -1 * $arwSize;
-			border-left: $arwSize solid transparent;
-			border-right: $arwSize solid transparent;
-			border-top: ($arwSize * 1.5) solid $infoBubbleBg;
+
+	}
+}
+
+.l-thumbsbubble-wrapper {
+	$closeBtnD: 15px;
+	position: absolute;
+	height: $imageThumbsWrapperH + $bubblePad*2 + $interiorMargin;
+	width: 100%;
+	.l-thumbsbubble {
+		@include absPosDefault();
+		.l-image-thumbs-wrapper {
+			height: auto;
+			top: $bubblePad !important; right: $closeBtnD + ($interiorMargin*2); bottom: $bubblePad !important; left: $bubblePad;
 		}
 	}
+	.arw {
+		//left: 50%;
+		//margin-left: $bubbleArwSize / -2;
+		z-index: 2;
+	}
+	&.arw-up .arw.arw-down,
+	&.arw-down .arw.arw-up { display: none; }
 }
 
 //************************************************* LOOK AND FEEL
 
-.s-infobubble {
-	$emFg: darken($infoBubbleFg, 20%);
+.s-bubble-wrapper {
+	//@include box-shadow(rgba(black, 0.4) 0 1px 5px);
+}
+
+.s-bubble {
 	@include border-radius($basicCr);
-	background: $infoBubbleBg;
-	color: $infoBubbleFg;
+	@include box-shadow(rgba(black, 0.4) 0 1px 5px);
+}
+
+.l-thumbsbubble-wrapper {
+	.arw-up {
+		@include triangle('up', $bubbleArwSize, 1.5, $colorThumbsBubbleBg);
+	}
+	.arw-down {
+		@include triangle('down', $bubbleArwSize, 1.5, $colorThumbsBubbleBg);
+	}
+}
+.s-infobubble {
+	$emFg: darken($colorInfoBubbleFg, 20%);
+	background: $colorInfoBubbleBg;
+	color: $colorInfoBubbleFg;
 	font-size: 0.8rem;
 	.title {
 		color: $emFg;
@@ -129,7 +169,7 @@ $infoBubbleBg: #ddd;
 	}
 	tr {
 		td {
-			border-top: 1px solid darken($infoBubbleBg, 10%);
+			border-top: 1px solid darken($colorInfoBubbleBg, 10%);
 			font-size: 0.9em;
 		}
 		&:first-child td {
@@ -139,5 +179,9 @@ $infoBubbleBg: #ddd;
 	.value {
 		color: $emFg;
 	}
+}
 
+.s-thumbsbubble {
+	background: $colorThumbsBubbleBg;
+	color: $colorThumbsBubbleFg;
 }
\ No newline at end of file
diff --git a/platform/commonUI/general/res/sass/tree/_tree.scss b/platform/commonUI/general/res/sass/tree/_tree.scss
index 483bada8f0..7df73f3bd8 100644
--- a/platform/commonUI/general/res/sass/tree/_tree.scss
+++ b/platform/commonUI/general/res/sass/tree/_tree.scss
@@ -99,7 +99,7 @@ ul.tree {
 
 			&.selected {
 				$c: #fff;
-				background: #005177;
+				background: $colorKeySelectedBg;
 				color: $c;
 				.view-control {
 					color: $colorItemTreeIcon;
diff --git a/platform/commonUI/general/res/sass/user-environ/_layout.scss b/platform/commonUI/general/res/sass/user-environ/_layout.scss
index c459adfa8d..8201597ca9 100644
--- a/platform/commonUI/general/res/sass/user-environ/_layout.scss
+++ b/platform/commonUI/general/res/sass/user-environ/_layout.scss
@@ -70,23 +70,19 @@
     &.abs {
 	    text-wrap: none;
 	    white-space: nowrap;
-        &.left,
-        .left {
-            width: 45%;
-            right: auto;
-        }
-        &.right,
-        .right {
-            width: 45%;
-            left: auto;
-            right: 0;
-            text-align: right;
-            .icon.major {
-                margin-left: $interiorMargin * 3;
-            }
-//            .icon.major {
-//                margin-left: $interiorMargin;
-//            }
+    }
+    &.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;
         }
     }
 }
diff --git a/platform/features/static-markup/res/markup.html b/platform/features/static-markup/res/markup.html
index 3aad99ac01..2a73186b31 100644
--- a/platform/features/static-markup/res/markup.html
+++ b/platform/features/static-markup/res/markup.html
@@ -19,27 +19,129 @@
  this source code distribution or the Licensing information page available
  at runtime from the About dialog for additional information.
 -->
-<h1>Static Markup Sandbox</h1>
+<div ng-init="images=[
+{date:'2020/04/27',time:'16:03:43',url:'http://www.hacskaylo.com/wedding/images/moon-surface-with-ice.jpg',selected:true},
+{date:'2020/04/27',time:'16:03:14',url:'http://www.lpi.usra.edu/lunar/lunar_flyovers/schrodinger/schrodinger.png',selected:false},
+{date:'2020/04/27',time:'16:02:49',url:'http://www.arcadiastreet.com/cgvistas/images/luna_southern_hemisphere_1280.jpg',selected:false},
+{date:'2020/04/27',time:'16:02:36',url:'https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcR0AIRCUQQ40JIImjwlp_uYAT7ftyqJcbYBytKpvp7iIFUkLbA6',selected:false},
+{date:'2020/04/27',time:'16:02:29',url:'http://www.virtualmicroscope.org/sites/default/files/styles/large_carousel/public/800-15499_a15pan1463033.jpg?itok=NMQhLnuY',selected:false},
+{date:'2020/04/27',time:'16:02:07',url:'http://www.virtualmicroscope.org/sites/default/files/styles/large_carousel/public/800-15499_a15pan1463033.jpg?itok=NMQhLnuY',selected:false},
+{date:'2020/04/27',time:'16:01:37',url:'http://www.lpi.usra.edu/lunar/lunar_flyovers/schrodinger/schrodinger.png',selected:false},
+{date:'2020/04/27',time:'16:01:25',url:'http://www.arcadiastreet.com/cgvistas/images/luna_southern_hemisphere_1280.jpg',selected:false},
+{date:'2020/04/27',time:'16:01:03',url:'https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcR0AIRCUQQ40JIImjwlp_uYAT7ftyqJcbYBytKpvp7iIFUkLbA6',selected:false},
+{date:'2020/04/27',time:'16:01:02',url:'http://www.virtualmicroscope.org/sites/default/files/styles/large_carousel/public/800-15499_a15pan1463033.jpg?itok=NMQhLnuY',selected:false},
+{date:'2020/04/27',time:'16:00:57',url:'http://www.virtualmicroscope.org/sites/default/files/styles/large_carousel/public/800-15499_a15pan1463033.jpg?itok=NMQhLnuY',selected:false},
+{date:'2020/04/27',time:'16:00:27',url:'http://www.arcadiastreet.com/cgvistas/images/luna_southern_hemisphere_1280.jpg',selected:false}
+];
+clipped=true;
+showThumbsBubble=false;
+"></div>
 
-<h2>Plot limits</h2>
-<div ng-init="limits=[
+<div class="t-imagery">
+	<!-- Main image -->
+	<div class="l-image-main-wrapper">
+		<div
+			class="l-image-main s-image-main"
+			ng-class="{ paused:paused, stale:false }"
+			style="background-image:url('http://www.hacskaylo.com/wedding/images/moon-surface-with-ice.jpg');"
+			></div>
+		<div class="l-image-main-controlbar bar">
+			<div class="left">
+				<a
+					class="t-btn l-btn s-btn s-icon-btn s-very-subtle show-thumbs sm"
+					ng-click="showThumbsBubble = (showThumbsBubble)? false:true"
+					><span class="ui-symbol icon"></span></a>
+				<span class="l-timezone">UTC</span>
+				<span class="l-time">16:03:43</span>
+				<span class="l-date">2020/04/27</span>
+			</div>
+			<div class="right">
+				<a
+					class="t-btn l-btn s-btn s-icon-btn s-very-subtle pause-play sm"
+					ng-click="paused = (paused)? false:true"
+					ng-class="{ paused:paused }"
+					><span class="ui-symbol icon"></span></a>
+                <a href=""
+	                class="l-btn s-btn s-icon-btn l-mag s-mag ui-symbol vsm"
+	                ng-click="clipped = false"
+	                ng-show="clipped === true"
+	                title="117%: Click to reset"
+	                ></a>
+			</div>
+		</div>
+	</div>
+
+	<div class="l-image-thumbs-wrapper">
+		<div
+			class="l-image-thumb-item s-image-thumb-item"
+			ng-repeat="thumb in images"
+			ng-class="{ selected : thumb.selected }"
+			>
+			<div class="l-thumb" style="background-image:url('{{thumb.url}}')"></div>
+			<div class="l-date">{{thumb.date}}</div>
+			<div class="l-time">{{thumb.time}}</div><span class="l-timezone">UTC</span>
+		</div>
+	</div>
+</div>
+
+<!-- NOTE: CANONICAL VERSION OF THIS MARKUP IS IN /platform/commonUI/inspect/res/thumbsbubble.html -->
+<div
+	class="l-bubble-wrapper s-bubble-wrapper l-thumbsbubble-wrapper"
+	ng-class="{ 'arw-up':true }"
+	ng-style="{ top: '258px' }"
+    ng-show="showThumbsBubble === true"
+	>
+	<div
+		class="arw arw-up"
+		ng-style="{ left: '215px' }"
+		></div>
+	<div class="l-bubble s-bubble l-thumbsbubble s-thumbsbubble">
+		<a
+			ng-click="showThumbsBubble = false"
+			class="s-btn l-btn normal ui-symbol close"
+			>x</a>
+		<div class="l-image-thumbs-wrapper">
+			<div
+				class="l-image-thumb-item s-image-thumb-item"
+				ng-repeat="thumb in images"
+				ng-class="{ selected : thumb.selected }"
+				>
+				<div class="l-thumb" style="background-image:url('{{thumb.url}}')"></div>
+				<div class="l-date">{{thumb.date}}</div>
+				<div class="l-time">{{thumb.time}}</div>
+			</div>
+		</div>
+	</div>
+	<div
+		class="arw arw-down"
+		ng-style="{ left: '613px' }"
+		></div>
+</div>
+
+
+<div class="hidden">
+	<h2>Plot limits</h2>
+
+	<div ng-init="limits=[
 				{type: 'upr', severity: 'red', top: 0, bottom: 90},
 				{type: 'upr', severity: 'yellow', top: 10, bottom: 80},
 				{type: 'lwr', severity: 'yellow', top: 70, bottom: 20},
 				{type: 'lwr', severity: 'red', top: 80, bottom: 0}
 	        ]"></div>
-<div style="width: 1000px; height: 500px">
-    <div class="gl-plot" style="height: 100%;">
-        <div class="gl-plot-display-area">
-	        <div
-		        ng-repeat="limit in limits"
-		        ng-show="1"
-		        class="t-limit l-limit s-limit-{{limit.type}}-{{limit.severity}}"
-		        style="top: {{limit.top}}%; bottom: {{limit.bottom}}%"
-		        ></div>
-        </div>
-    </div>
-</div>
+	<div style="width: 1000px; height: 500px">
+		<div class="gl-plot" style="height: 100%;">
+			<div class="gl-plot-display-area">
+				<div
+					ng-repeat="limit in limits"
+					ng-show="1"
+					class="t-limit l-limit s-limit-{{limit.type}}-{{limit.severity}}"
+					style="top: {{limit.top}}%; bottom: {{limit.bottom}}%"
+					></div>
+			</div>
+		</div>
+	</div>
 
-<h2>Animation</h2>
-<div class="pulse" style="background: #cc0000; color: #fff; padding: 10px;">This should pulse</div>
\ No newline at end of file
+	<h2>Animation</h2>
+
+	<div class="pulse" style="background: #cc0000; color: #fff; padding: 10px;">This should pulse</div>
+</div>
\ No newline at end of file