http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/bulletin-board.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/bulletin-board.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/bulletin-board.css
index 81a45f8..6a0db2f 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/bulletin-board.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/bulletin-board.css
@@ -18,43 +18,18 @@
     Bulletin Board Styles
 */
 
-#bulletin-board {
-    position: absolute;
-    top: 0px;
-    bottom: 0px;
-    left: 0px;
-    right: 0px;
-}
-
-#bulletin-board-header-and-filter {
-    height: 35px;
-    margin-top: 20px;
-    margin-left: 20px;
-    margin-right: 20px;
-}
-
 #bulletin-board-header-text {
-    float: left;
-    font-size: 16px;
+    font-size: 18px;
     font-weight: bold;
-    line-height: normal;
+    color: #728E9B;
+    font-family: Roboto Slab;
+    margin-bottom: 30px;
 }
 
 #bulletin-board-refresh-container {
-    height: 26px;
-    margin-left: 20px;
-    margin-right: 20px;
-    margin-top: 18px;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-}
-
-#bulletin-board-last-refreshed-container {
-    float: left;
-    color: #666;
-    font-weight: normal;
-    margin-top: 7px;
-    margin-left: 3px;
+    position: absolute;
+    width: 100%;
+    bottom: 0px;
 }
 
 #bulletin-board-loading-container {
@@ -74,65 +49,8 @@
     padding-top: 10px;
 }
 
-#refresh-button {
-    height: 24px;
-    width: 26px;
-    float: left;
-}
-
-div.bulletin-board-stopped {
-    background: transparent url(../images/iconAutoRefresh.png) no-repeat 
scroll 0 0;
-}
-
-div.bulletin-board-stopped-hover {
-    background: transparent url(../images/iconAutoRefresh.png) no-repeat 
scroll -52px 0;
-}
-
-div.bulletin-board-polling {
-    background: transparent url(../images/iconAutoRefresh.png) no-repeat 
scroll -26px 0;
-}
-
-div.bulletin-board-polling-hover {
-    background: transparent url(../images/iconAutoRefresh.png) no-repeat 
scroll -78px 0;
-}
-
-/* filter controls */
-
-#bulletin-board-filter-controls {
-    float: right;
-}
-
-#bulletin-board-filter-container {
-    height: 24px;
-    width: 318px;
-}
-
-#bulletin-board-filter {
-    padding: 3px 0px 1px 3px;
-    font-size: 12px;
-    height: 18px;
-    line-height: 20px;
-    width: 173px;
-    border: 1px solid #ccc;
-    margin-right: 3px;
-    float: left;
-}
-
-input.bulletin-board-filter-list {
-    color: #888;
-}
-
-#bulletin-board-filter-type {
-    width: 127px;
-    height: 18px;
-    line-height: 18px;
-    float: left;
-}
-
 #bulletin-board-status-container {
-    position: absolute;
-    right: 20px;
-    top: 75px;
+    float: right;
 }
 
 #bulletin-error-message {
@@ -147,33 +65,22 @@ input.bulletin-board-filter-list {
 }
 
 #clear-bulletins-button {
-    border: 1px solid #AAAAAA;
-    color: #525252;
-    float: left;
-    font-weight: bold;
-    height: 20px;
-    line-height: 20px;
-    text-align: center;
-    width: 55px;
+    margin-top: 8px;
 }
 
 /* bulletin board */
 
 #bulletin-board-container {
-    position: absolute;
-    top: 100px;
-    left: 20px;
-    bottom: 20px;
-    right: 20px;
-    border: 1px solid #666;
     overflow-y: auto;
-    padding: 3px;
+    width: 100%;
 }
 
 div.bulletin-action {
     font-weight: bold;
-    margin-top: 4px;
     margin-bottom: 4px;
+    font-family: Roboto;
+    font-size: 13px;
+    color: #728e9b;
 }
 
 div.bulletin {
@@ -235,4 +142,5 @@ div.bulletin-link {
 pre.bulletin-message {
     float: left;
     white-space: pre-wrap;
+    margin-top: 2px;
 }
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/cluster.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/cluster.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/cluster.css
index 8bb50bf..94a34df 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/cluster.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/cluster.css
@@ -24,36 +24,22 @@
     bottom: 0px;
     left: 0px;
     right: 0px;
-}
-
-#cluster-header-and-filter {
-    height: 35px;
-    margin-top: 20px;
-    margin-left: 20px;
-    margin-right: 20px;
+    height: 90%;
+    overflow: auto;
 }
 
 #cluster-header-text {
-    float: left;
-    font-size: 16px;
+    font-size: 18px;
     font-weight: bold;
+    color: #728E9B;
+    font-family: Roboto Slab;
+    margin-bottom: 30px;
 }
 
 #cluster-refresh-container {
-    height: 26px;
-    margin-left: 20px;
-    margin-right: 20px;
-    margin-top: 18px;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-}
-
-#cluster-last-refreshed-container {
-    float: left;
-    color: #666;
-    font-weight: normal;
-    margin-top: 6px;
-    margin-left: 3px;
+    position: absolute;
+    width: 100%;
+    bottom: 0px;
 }
 
 #cluster-loading-container {
@@ -86,17 +72,12 @@
 }
 
 #cluster-filter-container {
-    height: 24px;
+    height: 32px;
     width: 318px;
 }
 
 #cluster-filter {
-    padding: 3px 0px 1px 3px;
-    font-size: 12px;
-    height: 18px;
-    line-height: 20px;
     width: 173px;
-    border: 1px solid #ccc;
     margin-right: 3px;
     float: left;
 }
@@ -106,31 +87,16 @@ input.cluster-filter-list {
 }
 
 #cluster-filter-type {
-    width: 127px;
-    height: 18px;
-    line-height: 18px;
+    width: 120px;
     float: left;
 }
 
-#cluster-filter-stats {
-    font-size: 9px;
-    font-weight: bold;
-    color: #9f6000;
-    clear: left; 
-    line-height: normal;
-    margin-left: 5px;
-}
-
 /* counters table */
 
 #cluster-table {
-    position: absolute;
-    top: 100px;
-    left: 20px;
-    bottom: 20px;
-    right: 20px;
-    border: 1px solid #666;
     overflow: hidden;
+    height: 80%;
+    width: 100%;
 }
 
 span.sorted {
@@ -139,13 +105,6 @@ span.sorted {
 
 /* user details dialog */
 
-#node-details-dialog {
-    display: none;
-    width: 600px;
-    height: 400px;
-    z-index: 1301;
-}
-
 #node-events {
     max-height: 200px;
     overflow-y: auto;

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/component-state.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/component-state.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/component-state.css
index b3f321e..8c537db 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/component-state.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/component-state.css
@@ -16,26 +16,6 @@
  */
 
 /*
-    Component state
-*/
-
-#component-state-dialog {
-    position: absolute;
-    overflow: hidden;
-    width: 600px;
-    font-size: 10px;
-    z-index: 1301;
-    display: none;
-}
-
-#component-state-description {
-    width: 580px;
-    height: 50px;
-    font-size: 10px;
-    line-height: 12px;
-}
-
-/*
     Component state filter
 */
 
@@ -49,29 +29,11 @@
 }
 
 #component-state-filter-controls {
-    float: right;
     margin-top: 10px;
-    margin-right: 2px;
-    margin-bottom: 7px;
-}
-
-#component-state-filter-status {
-    font-size: 9px;
-    font-weight: bold;
-    color: #9f6000;
-    clear: left;
-    line-height: normal;
-    margin-left: 5px;
 }
 
 #component-state-filter {
-    padding: 3px 0px 1px 3px;
-    font-size: 12px;
-    height: 18px;
-    line-height: 20px;
     width: 173px;
-    border: 1px solid #ccc;
-    float: left;
 }
 
 /*
@@ -79,9 +41,10 @@
 */
 
 #component-state-table {
-    width: 578px;
-    height: 235px;
-    border: 1px solid #666;
+    overflow: hidden;
+    height: 55%;
+    width: 100%;
+    min-height: 150px;
 }
 
 /*
@@ -89,8 +52,8 @@
 */
 
 #clear-link-container {
-    margin-top: 16px;
-    margin-bottom: 18px;
+    position: absolute;
+    bottom: 10px;
 }
 
 #clear-link.disabled {

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/connection-configuration.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/connection-configuration.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/connection-configuration.css
index 5bcf010..be5f71e 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/connection-configuration.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/connection-configuration.css
@@ -21,23 +21,8 @@
     height: 400px;
 }
 
-div.connection-configuration-tab-container {
-    margin-top: -10px;
-    padding: 5px 11px;
-}
-
-#connection-configuration-tabs {
-    background-color: transparent;
-    border-bottom: 3px solid #666666;
-    height: 21px;
-    width: 678px;
-}
-
 #connection-configuration div.configuration-tab {
-    height: 275px;
     overflow: auto;
-    padding: 10px;
-    background: #eee url(../images/bgTabContainer.png) repeat-x;
     display: none;
 }
 
@@ -45,16 +30,6 @@ div.connection-configuration-tab-container {
     Connection details.
 */
 
-#output-port-options {
-    height: 18px;
-    width: 250px;
-}
-
-#input-port-options {
-    height: 18px;
-    width: 280px;
-}
-
 div.connection-terminal-label {
     height: 26px;
 }
@@ -63,26 +38,6 @@ div.connection-terminal-label {
     Connection settings.
 */
 
-#connection-configuration div.settings-left {
-    float: left;
-    width: 280px;
-}
-
-#connection-configuration div.spacer {
-    float: left;
-    margin-right: 40px;
-}
-
-#connection-configuration div.settings-right {
-    float: left;
-    width: 330px;
-}
-
-#connection-configuration .setting-input {
-    font-size: 11px !important;
-    width: 270px;
-}
-
 #relationship-names-container {
     height: 160px;
     padding-right: 0;
@@ -126,11 +81,12 @@ div.undefined {
 #prioritizer-available, #prioritizer-selected {
     list-style-type: none;
     margin: 0px;
-    background: #eee;
+    background: #eaeef0;
     width: 325px;
-    min-height: 28px;
+    min-height: 32px;
     margin-bottom: 5px;
-    border: 1px dashed #aaa;
+    width: 100%;
+    padding: 2px;
 }
 
 #prioritizer-available li, #prioritizer-selected li {
@@ -143,25 +99,31 @@ div.undefined {
 }
 
 #prioritizer-available li {
-    background: transparent url(../images/bgButton.png) repeat-x center center;
-    border-top: 1px solid #d1d1d1;
-    border-right: 1px solid #a7a7a7;
-    border-bottom: 1px solid #828282;
-    border-left: 1px solid #a7a7a7;
-    color: #666;
-    font-weight: bold;
-}
-
-li.available-hover {
-    background: transparent url(../images/bgButtonOver.png) repeat-x center 
center;
+    background: #fff;
+    border-top: 1px solid #CCDADB;
+    border-right: 1px solid #CCDADB;
+    border-bottom: 1px solid #CCDADB;
+    border-left: 1px solid #CCDADB;
+    color: #004849;
+    font-weight: 500;
+    cursor: grab;
+    cursor: -moz-grab;
+    cursor: -webkit-grab;
+    line-height: 32px;
+    height: 32px;
+    padding: 0px 10px;
+    box-shadow:0 1px 1px rgba(0,0,0,0.4);
 }
 
 #prioritizer-selected li {
-    background: transparent url(../images/bgButtonSelected.png) repeat-x 
center center;
+    background: #355B6A;
     border-top: 1px solid #AAC1CE;
     border-right: 1px solid #85A6B8;
     border-bottom: 1px solid #618BA3;
     border-left: 1px solid #85A6B8;
-    color: #355B6A;
+    color: #fff;
     font-weight: bold;
+    line-height: 32px;
+    height: 32px;
+    padding: 0px 10px;
 }
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/connection-details.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/connection-details.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/connection-details.css
index 3a3fdb9..b0807a0 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/connection-details.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/connection-details.css
@@ -25,41 +25,12 @@
     height: 400px;
 }
 
-div.connection-details-tab-container {
-    margin-top: -10px;
-    padding: 5px 11px;
-}
-
-#connection-details-tabs {
-    background-color: transparent;
-    border-bottom: 3px solid #666666;
-    height: 21px;
-    width: 678px;
-}
-
 #connection-details div.configuration-tab {
-    height: 275px;
     overflow: auto;
     padding: 10px;
-    background: #eee url(../images/bgTabContainer.png) repeat-x;
     display: none;
 }
 
-#connection-details div.settings-left {
-    float: left;
-    width: 280px;
-}
-
-#connection-details div.spacer {
-    float: left;
-    margin-right: 40px;
-}
-
-#connection-details div.settings-right {
-    float: left;
-    width: 330px;
-}
-
 #read-only-relationship-names {
     border: 0 solid #CCCCCC;
     height: 145px;

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/controller-service.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/controller-service.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/controller-service.css
index aebb57c..b9d87fa 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/controller-service.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/controller-service.css
@@ -29,47 +29,16 @@
     display: none;
 }
 
-div.controller-service-configuration-tab-container {
-    margin-top: -10px;
-    padding: 5px 11px;
-}
-
 #controller-service-configuration-advanced {
     display: none;
 }
 
-#controller-service-configuration-tabs {
-    background-color: transparent;
-    width: 778px;
-    height: 21px;
-    border-bottom: 3px solid #666;
-}
-
-#controller-service-configuration div.configuration-tab {
-    height: 320px;
-    overflow: auto;
-    padding: 10px;
-    background: #eee url(../images/bgTabContainer.png) repeat-x;
-    display: none;
+.controller-service-editable {
+    height: 32px;
 }
 
 /* controller-service settings */
 
-#controller-service-configuration div.settings-left {
-    float: left;
-    width: 330px;
-}
-
-#controller-service-configuration div.settings-right {
-    float: left;
-    width: 382px;
-}
-
-#controller-service-configuration div.spacer {
-    float: left;
-    margin-right: 40px;
-}
-
 #controller-service-configuration .setting-input {
     font-size: 11px !important;
 }
@@ -168,37 +137,12 @@ div.controller-service-canceling {
 
 #controller-service-comments {
     height: 250px;
-    width: 748px !important;
-    margin-top: 10px;
 }
 
 /*
     Disable dialog
 */
 
-#disable-controller-service-dialog {
-    z-index: 1301;
-    display: none;
-    width: 800px;
-    height: 450px;
-    line-height: normal;
-}
-
-#disable-controller-service-dialog div.settings-left {
-    float: left;
-    width: 300px;
-}
-
-#disable-controller-service-dialog div.settings-right {
-    float: left;
-    width: 435px;
-}
-
-#disable-controller-service-dialog div.spacer {
-    float: left;
-    margin-right: 40px;
-}
-
 #disable-controller-service-name {
     float: left;
     max-width: 280px;
@@ -227,27 +171,8 @@ div.controller-service-canceling {
     Enable dialog
 */
 
-#enable-controller-service-dialog {
-    z-index: 1301;
-    display: none;
-    width: 800px;
-    height: 450px;
-    line-height: normal;
-}
-
-#enable-controller-service-dialog div.settings-left {
-    float: left;
-    width: 300px;
-}
-
-#enable-controller-service-dialog div.settings-right {
-    float: left;
-    width: 435px;
-}
-
-#enable-controller-service-dialog div.spacer {
-    float: left;
-    margin-right: 40px;
+#enable-controller-service-scope-container {
+    height: 48px;
 }
 
 #enable-controller-service-name {
@@ -268,8 +193,6 @@ div.controller-service-canceling {
 #enable-controller-service-scope {
     float: left;
     width: 225px;
-    height: 18px;
-    line-height: 18px;
 }
 
 #enable-controller-service-referencing-components {

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/counters.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/counters.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/counters.css
index 73b948a..7abc802 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/counters.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/counters.css
@@ -24,36 +24,26 @@
     bottom: 0px;
     left: 0px;
     right: 0px;
+    height: 90%;
+    overflow: auto;
 }
 
 #counters-header-and-filter {
-    height: 35px;
-    margin-top: 20px;
-    margin-left: 20px;
-    margin-right: 20px;
+    height: 32px;
 }
 
 #counters-header-text {
-    float: left;
-    font-size: 16px;
+    font-size: 18px;
     font-weight: bold;
+    color: #728E9B;
+    font-family: Roboto Slab;
+    margin-bottom: 30px;
 }
 
 #counters-refresh-container {
-    height: 26px;
-    margin-left: 20px;
-    margin-right: 20px;
-    margin-top: 18px;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-}
-
-#counters-last-refreshed-container {
-    float: left;
-    color: #666;
-    font-weight: normal;
-    margin-top: 6px;
-    margin-left: 3px;
+    position: absolute;
+    width: 100%;
+    bottom: 0px;
 }
 
 #counters-loading-container {
@@ -73,62 +63,10 @@
     padding-top: 10px;
 }
 
-#refresh-button {
-    height: 24px;
-    width: 26px;
-    float: left;
-}
-
-/* filter controls */
-
-#counters-filter-controls {
-    float: right;
-}
-
-#counters-filter-container {
-    height: 24px;
-    width: 318px;
-}
-
-#counters-filter {
-    padding: 3px 0px 1px 3px;
-    font-size: 12px;
-    height: 18px;
-    line-height: 20px;
-    width: 173px;
-    border: 1px solid #ccc;
-    margin-right: 3px;
-    float: left;
-}
-
-input.counters-filter-list {
-    color: #888;
-}
-
-#counters-filter-type {
-    width: 127px;
-    height: 18px;
-    line-height: 18px;
-    float: left;
-}
-
-#counters-filter-stats {
-    font-size: 9px;
-    font-weight: bold;
-    color: #9f6000;
-    clear: left; 
-    line-height: normal;
-    margin-left: 5px;
-}
-
 /* counters table */
 
 #counters-table {
-    position: absolute;
-    top: 100px;
-    left: 20px;
-    bottom: 20px;
-    right: 20px;
-    border: 1px solid #666;
     overflow: hidden;
+    height: 80%;
+    width: 100%;
 }

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/dialog.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/dialog.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/dialog.css
index b338120..3826539 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/dialog.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/dialog.css
@@ -18,77 +18,12 @@
     Specific dialog settings.
 */
 
-#new-port-dialog {
-    z-index: 1301;
-    display: none;
-    width: 350px;
-    height: 150px;
-}
-
-#new-port-name {
-    width: 320px;
-}
-
-#new-process-group-dialog {
-    z-index: 1301;
-    display: none;
-    width: 350px;
-    height: 150px;
-}
-
-#new-process-group-name {
-    width: 320px;
-}
-
-#new-remote-process-group-dialog {
-    z-index: 1301;
-    display: none;
-    width: 400px;
-    height: 370px;
-}
-
-#new-remote-process-group-dialog .small-setting-input {
-    width: 160px;
-}
-
 #new-remote-process-group-transport-protocol-combo {
     width: 160px;
-    height: 18px;
-    line-height: 18px;
-}
-
-#new-remote-process-group-uri {
-    width: 370px;
-}
-
-
-#new-template-dialog {
-    z-index: 1301;
-    display: none;
-    width: 350px;
-    height: 300px;
-}
-
-.new-template-field {
-    width: 320px;
-}
-
-#alias-dialog {
-    z-index: 1301;
-    display: none;
-    width: 350px;
-    height: 195px;
-}
-
-#fill-color-dialog {
-    z-index: 1301;
-    display: none;
-    width: 195px;
-    height: 400px;
 }
 
 #fill-color-value {
-    width: 165px;
+    width: 100%;
 }
 
 #fill-color-processor-preview {
@@ -146,13 +81,6 @@
     float: left;
 }
 
-#connections-dialog {
-    z-index: 1301;
-    display: none;
-    height: 365px;
-    width: 646px;
-}
-
 div.connections-component-name {
     float: left;
     width: 390px;
@@ -253,40 +181,6 @@ div.go-to-link {
     cursor: pointer;
 }
 
-#system-diagnostics-dialog {
-    z-index: 1301;
-    display: none;
-    height: 450px;
-    width: 420px;
-}
-
-#instantiate-template-dialog {
-    z-index: 1301;
-    display: none;
-    width: 355px;
-    height: 120px;
-}
-
-#available-templates {
-    width: 325px;
-    height: 18px;
-    line-height: 18px;
-}
-
-#remote-port-configuration {
-    z-index: 1301;
-    display: none;
-    width: 350px;
-    height: 195px;
-}
-
-#drop-request-status-dialog {
-    display: none;
-    width: 400px;
-    height: 125px;
-    z-index: 1301;
-}
-
 #drop-request-percent-complete {
     margin-top: 10px;
     width: 378px;
@@ -297,13 +191,6 @@ div.go-to-link {
     border-radius: 0;
 }
 
-#listing-request-status-dialog {
-    display: none;
-    width: 400px;
-    height: 125px;
-    z-index: 1301;
-}
-
 #listing-request-percent-complete {
     margin-top: 10px;
     width: 378px;
@@ -319,37 +206,10 @@ div.progress-label {
     display: block;
     font-weight: bold;
     text-align: center;
-    width: 378px;
+    /*width: 378px;*/
     margin-top: 4px;
 }
 
-#nf-ok-dialog {
-    z-index: 1302;
-    display: none;
-    height: 225px;
-    width: 375px;
-}
-
-#nf-ok-dialog-content {
-    width: 355px;
-    height: 130px;
-    overflow: auto;
-}
-
-#nf-yes-no-dialog {
-    z-index: 1302;
-    display: none;
-    height: 175px;
-    width: 350px;
-}
-
-#nf-yes-no-dialog-content {
-    width: 330px;
-    height: 180px;
-    overflow: auto;
-    margin-top: -10px;
-}
-
 /*
     General dialog styles.
 */
@@ -368,19 +228,51 @@ ul.result li {
 }
 
 .setting-name {
-    font-size: 10px;
-    font-weight: bold;
+    font-size: 12px;
+    font-weight: 500;
+    font-family: Roboto Slab;
     padding-bottom: 4px;
-    color: #527991;
+    color: #262626;
+}
+
+.setting-name .fa {
+    color: #004849;
+    margin-left: 5px;
+}
+
+.setting-field .fa {
+    color: #004849;
+    margin-left: 5px;
 }
 
 .setting-field {
-    overflow: hidden;
     line-height: normal;
+    width: 100%;
+    color: #775351;
+    font-size: 13px;
+}
+
+.setting-header{
+    color: #728e9b;
+    font-size: 12pt;
+    font-family: 'Roboto Slab';
+    font-style: normal;
+    font-weight: bold;
+    line-height: 56px;
+    text-overflow: ellipsis;
+}
+
+.dialog-content div.settings-left {
+    float: left;
+    width: 49%;
 }
 
-img.icon-info {
-    position: relative;
-    left: 3px;
-    top: 1px;
+.dialog-content div.settings-right {
+    float: left;
+    width: 49%;
+}
+
+.dialog-content div.spacer {
+    float: left;
+    width: 2%;
 }

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/flow-status.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/flow-status.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/flow-status.css
index e8ee677..0012deb 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/flow-status.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/flow-status.css
@@ -90,6 +90,7 @@
 
 #bulletin-button {
     background-color: #728E9B; /*base-color*/
+    cursor: default;
 }
 
 #bulletin-button.has-bulletins {
@@ -124,6 +125,7 @@ div.search-result-icon {
     background: #FFFFFF;
     border: 0px;
     padding: 0px;
+    box-shadow: none;
 }
 
 input.search-flow {

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/graph.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/graph.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/graph.css
index 9ae72be..bab817a 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/graph.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/graph.css
@@ -28,6 +28,7 @@
     background-size: 14px 14px;
     background-image: linear-gradient(to right, rgba(229, 235, 237, 1) 1px, 
transparent 1px), linear-gradient(to bottom, rgba(229, 235, 237, 1) 1px, 
transparent 1px);
     z-index: 1;
+    overflow: hidden;
 }
 
 .tooltip {

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/header.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/header.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/header.css
index 13f7851..72a34fa 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/header.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/header.css
@@ -57,6 +57,10 @@ md-toolbar.md-small .md-toolbar-tools {
     font-size: 12px;
 }
 
+#users-link {
+    padding-left: 7px;
+}
+
 #nifi-logo {
     height: 37px;
     margin: 0 20px 0 15px;
@@ -69,6 +73,8 @@ md-toolbar.md-small .md-toolbar-tools {
     border-top-right-radius:2px;
     margin:0 10px;
     cursor: pointer;
+    height: 40px;
+    width: 40px;
 }
 
 #global-menu-button:hover {
@@ -129,6 +135,8 @@ md-toolbar.md-small .md-toolbar-tools {
     background-color:#AABBC3; /*tint base-color 40%*/
     border-radius:2px;
     border: none;
+    height: 40px;
+    width: 40px;
 }
 
 #header .component-button:hover {

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/history.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/history.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/history.css
index f3518d5..9011005 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/history.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/history.css
@@ -24,31 +24,22 @@
     bottom: 0px;
     left: 0px;
     right: 0px;
+    height: 90%;
+    overflow: auto;
 }
 
 #history-header-text {
-    height: 35px;
-    margin-top: 20px;
-    margin-left: 20px;
-    font-size: 16px;
+    font-size: 18px;
     font-weight: bold;
+    color: #728E9B;
+    font-family: Roboto Slab;
+    padding-bottom: 10px;
 }
 
 #history-refresh-container {
-    height: 26px;
-    margin-left: 20px;
-    margin-right: 20px;
-    margin-top: 18px;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-}
-
-#history-last-refreshed-container {
-    float: left;
-    color: #666;
-    font-weight: normal;
-    margin-top: 6px;
-    margin-left: 3px;
+    position: absolute;
+    width: 100%;
+    bottom: 0px;
 }
 
 #history-loading-container {
@@ -68,81 +59,40 @@
     padding-top: 10px;
 }
 
-#refresh-button {
-    height: 24px;
-    width: 26px;
-    float: left;
-}
-
 /* history filter controls */
 
 #history-filter-container {
-    position: absolute;
-    right: 20px;
-    top: 75px;
+    float: right;
 }
 
 #history-filter-button {
-    height: 20px;
-    line-height: 20px;
-    width: 55px;
-    text-align: center;
-    font-weight: bold;
-    border: 1px solid #AAAAAA;
-    color: #525252;
-    float: left;
-    margin-right: 0;
-    padding: 0;
+    float: right;
+    margin-left: 1px;
 }
 
 #history-filter-overview {
-    float: left;
-    color: #9F6000;
-    font-size: 9px;
-    font-weight: bold;
-    line-height: normal;
-    float: left;
-    margin-top: 6px;
-    margin-right: 8px;
     display: none;
-}
-
-#clear-history-filter {
-    cursor: pointer;
-    color:#31849B;
-    text-decoration: underline;
+    font-family: Roboto;
+    font-size: 13px;
+    margin-bottom: 5px;
+    font-weight: normal;
 }
 
 #history-purge-button {
-    height: 20px;
-    line-height: 20px;
-    width: 55px;
-    text-align: center;
-    font-weight: bold;
-    border: 1px solid #AAAAAA;
-    color: #525252;
-    float: left;
-    margin-left: 5px;
-    margin-right: 0;
-    padding: 0;
+    float: right;
 }
 
 
 /* history filter dialog */
 
-#history-filter-dialog {
-    display: none;
-    width: 421px;
-    height: 250px;
-    z-index: 1301;
-}
-
 .start-date-setting, .start-time-setting, .end-date-setting, .end-time-setting 
{
     float: left;
+    width: 48%;
 }
 
 .start-date-setting, .end-date-setting {
-    margin-right: 15px;
+    margin-right: 4%;
+    width: 48%;
 }
 
 .history-small-input {
@@ -156,41 +106,22 @@
     margin-right: 10px;
     font-size: 11px;
     float: left;
-    width: 275px;
+    width: 70% !important;
 }
 
 #history-filter-type {
     width: 96px;
-    height: 18px;
-    line-height: 18px;
     float: left;
 }
 
-/* history purge controls */
-
-#history-purge-dialog {
-    display: none;
-    width: 422px;
-    height: 150px;
-    z-index: 1301;
-}
-
 /* action details dialog */
 
-#action-details-dialog {
-    display: none;
-    width: 400px;
-    height: 350px;
-    z-index: 1301;
-}
-
 #action-details {
-    height: 250px;
     overflow-y: auto;
 }
 
 div.action-detail {
-    margin-bottom: 2px;
+    margin-bottom: 5px;
 }
 
 div.history-details-name {
@@ -199,18 +130,14 @@ div.history-details-name {
     font-size: 10px;
     font-weight: bold;
     line-height: normal;
-    width: 115px;
+    width: 100%;
     margin-right: 10px;
 }
 
 /* history table */
 
 #history-table {
-    position: absolute;
-    top: 100px;
-    left: 20px;
-    bottom: 20px;
-    right: 20px;
-    border: 1px solid #666;
     overflow: hidden;
+    height: 80%;
+    width: 100%;
 }

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/label-configuration.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/label-configuration.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/label-configuration.css
index fe8412a..fc89e00 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/label-configuration.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/label-configuration.css
@@ -22,25 +22,17 @@
     font-size: 10px;
     z-index: 1301;
     display: none;
-    padding: 10px;
-    cursor: move;
-}
-
-#label-configuration-contents {
-    margin-top: -50px;
 }
 
 #label-value {
-    width: 375px;
-    height: 210px;
-    resize: both;
+    width: 100%;
+    height: 189px;
+    resize: vertical;
     min-height: 100px;
     min-width: 100px;
-    font-weight: bold;
 }
 
 #label-font-size {
-    height: 24px;
     width: 100%;
     box-sizing: border-box;
     -moz-box-sizing: border-box;

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/main.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/main.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/main.css
index 83a2830..f2a8d42 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/main.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/main.css
@@ -18,7 +18,7 @@
     font-family: 'Roboto';
     font-style: normal;
     font-weight: 300;
-    src:    local('Roboto Light'),
+    src: local('Roboto Light'),
     local('Roboto-Light'),
     url('../fonts/Roboto/Roboto-Light.ttf') format('truetype');
 }
@@ -27,7 +27,7 @@
     font-family: 'Roboto';
     font-style: italic;
     font-weight: 300;
-    src:    local('Roboto LightItalic'),
+    src: local('Roboto LightItalic'),
     local('Roboto-LightItalic'),
     url('../fonts/Roboto/Roboto-LightItalic.ttf') format('truetype');
 }
@@ -36,7 +36,7 @@
     font-family: 'Roboto';
     font-style: normal;
     font-weight: normal;
-    src:    local('Roboto Regular'),
+    src: local('Roboto Regular'),
     local('Roboto-Regular'),
     url('../fonts/Roboto/Roboto-Regular.ttf') format('truetype');
 }
@@ -45,7 +45,7 @@
     font-family: 'Roboto';
     font-style: normal;
     font-weight: 500;
-    src:    local('Roboto Medium'),
+    src: local('Roboto Medium'),
     local('Roboto-Medium'),
     url('../fonts/Roboto/Roboto-Medium.ttf') format('truetype');
 }
@@ -54,7 +54,7 @@
     font-family: 'Roboto';
     font-style: normal;
     font-weight: bold;
-    src:    local('Roboto Bold'),
+    src: local('Roboto Bold'),
     local('Roboto-Bold'),
     url('../fonts/Roboto/Roboto-Bold.ttf') format('truetype');
 }
@@ -63,7 +63,7 @@
     font-family: 'Roboto';
     font-style: italic;
     font-weight: normal;
-    src:    local('Roboto Italic'),
+    src: local('Roboto Italic'),
     local('Roboto-Italic'),
     url('../fonts/Roboto/Roboto-Italic.ttf') format('truetype');
 }
@@ -72,7 +72,7 @@
     font-family: 'Roboto Slab';
     font-style: normal;
     font-weight: normal;
-    src:    local('RobotoSlab Regular'),
+    src: local('RobotoSlab Regular'),
     local('RobotoSlab-Regular'),
     url('../fonts/Roboto_Slab/RobotoSlab-Regular.ttf') format('truetype');
 }
@@ -81,7 +81,7 @@
     font-family: 'Roboto Slab';
     font-style: normal;
     font-weight: bold;
-    src:    local('RobotoSlab Bold'),
+    src: local('RobotoSlab Bold'),
     local('RobotoSlab-Bold'),
     url('../fonts/Roboto_Slab/RobotoSlab-Bold.ttf') format('truetype');
 }
@@ -93,10 +93,14 @@ i[class^="fa-"]:before, i[class*=" fa-"]:before {
 
 /*remove margin from flowfont*/
 i[class^="icon-"]:before, i[class*=" icon-"]:before {
-    margin: -1px;
+    margin: -2px;
+}
+
+.value-color {
+    color: #775351;
 }
 
-body { 
+body {
     display: block;
     font-family: Roboto, sans-serif;
     font-size: 62.5%;
@@ -223,9 +227,14 @@ ul.links span.header-link-over {
 }
 
 div.nifi-tooltip {
-    border: 1px solid #454545;
-    background-color: #FFFFA3;
-    color: #454545;
+    border: 0px !important;
+    border-radius: 2px;
+    background-color: rgba(0, 0, 0, 0.80) !important;
+    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
+    font-family: Roboto;
+    font-weight: 500;
+    font-size: 13px;
+    color: #fff !important;
     max-width: 500px;
     word-wrap: break-word;
 }
@@ -259,17 +268,47 @@ input.filter-list {
     background: transparent url(../images/iconTwistArrow.png) no-repeat scroll 
top right;
 }
 
-input[type=text], input[type=password], textarea {
-    background: white url(../images/bgInputText.png) repeat-x scroll top;
-    border: 1px solid #ccc;
-    font-family: Verdana;
+label {
+    font-family: 'Roboto Slab', serif;
     font-size: 12px;
-    padding: 4px;
+    color: #262626; /*base-font-color*/
+    letter-spacing: 0.05rem;
+    display: block;
+    margin-bottom: 2px;
+}
+
+input::placeholder {
+    color: #728e9b; /*base-color*/
+}
+
+input, input[type=text], input[type=password], textarea {
+    background-color: #eaeef0;
+    border: 1px solid #eaeef0;
+    font-family: Roboto, sans-serif;
+    font-size: 13px;
+    padding: 0px 0px 0px 10px;
     resize: none;
+    height: 32px;
+    width: 100%;
+    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
+    -moz-box-sizing: border-box; /* Firefox, other Gecko */
+    box-sizing: border-box;
+    color: #262626;
+}
+
+input:focus, textarea:focus {
+    background-color: #fff;
+    border: 1px solid #004849; /*link-color*/
+    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
+    outline: none;
 }
 
 textarea {
     overflow: hidden;
+    padding: 10px 10px;
+    resize: vertical;
+    color: #262626;
+    font-size: 13px !important;
 }
 
 ul.property-info {
@@ -311,12 +350,8 @@ div.ajax-error {
     background-image: url(../images/iconDelete.png);
 }
 
-div.button-refresh {
-    background: transparent url(../images/buttonRefresh.png) no-repeat scroll 
top left;
-}
-
-div.button-refresh-hover {
-    background: transparent url(../images/buttonRefresh.png) no-repeat scroll 
top right;
+.refresh-button {
+    float: left;
 }
 
 .ui-draggable .dialog-header {
@@ -327,63 +362,43 @@ div.button-refresh-hover {
 
 div.disabled {
     float: left;
-    width: 16px;
-    height: 16px;
-    background: transparent url(../images/iconDisable.png) repeat scroll 0 0;
 }
 
 div.enabled {
     float: left;
-    width: 16px;
-    height: 16px;
-    background: transparent url(../images/iconEnable.png) repeat scroll 0 0;
+    margin-left: 3px;
+    margin-right: -3px;
 }
 
 div.stopped {
     float: left;
-    width: 16px;
-    height: 16px;
-    background: transparent url(../images/iconStop.png) repeat scroll 0 0;
 }
 
 div.running {
     float: left;
-    width: 16px;
-    height: 16px;
-    background: transparent url(../images/iconRun.png) repeat scroll 0 0;
 }
 
 div.has-errors, div.invalid {
     float: left;
-    width: 18px;
-    height: 16px;
-    margin-left: -2px;
-    background: transparent url(../images/iconAlert.png) repeat scroll 0 0;
+    color: #ba554a !important;
 }
 
 div.transmitting {
     float: left;
-    width: 18px;
-    height: 16px;
-    background: transparent url(../images/iconTransmissionActive.png) 
no-repeat center center;
 }
 
 div.not-transmitting {
     float: left;
-    width: 18px;
-    height: 16px;
-    background: transparent url(../images/iconTransmissionInactive.png) 
no-repeat center center;
+    margin-top: 0px !important;
 }
 
 div.valid {
     float: left;
-    width: 16px;
-    height: 16px;
     background-color: transparent;
 }
 
 div.has-bulletins {
-    background: transparent url(../images/iconBulletin.png) repeat scroll 0 0;
+    background: #ba554a;
 }
 
 /*
@@ -409,10 +424,12 @@ tr.alt-row {
 
 span.link {
     cursor: pointer;
-    color:#004849; /*link-color*/
+    color: #004849; /*link-color*/
     font-weight: normal;
     display: inline-block;
     border-bottom: 1px solid #CCDADB;
+    font-size: 13px;
+    font-family: Roboto;
 }
 
 span.link-over {
@@ -430,18 +447,171 @@ span.details-title {
     text-decoration: underline;
 }
 
+.last-refreshed-container {
+    float: left;
+    font-weight: normal;
+    margin-top: 8px;
+    margin-left: 3px;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    font-family: Roboto;
+    font-size: 13px;
+}
+
+.refresh-toggle {
+    float: left;
+    margin: 0px 20px 0px 0px !important;
+    font-family: Roboto;
+    font-size: 13px;
+}
+
+button {
+    height: 28px;
+    width: 28px;
+    border: 1px solid #CCDADB; /*tint link-color 80%*/
+    background-color: rgba(249, 250, 251, 0.97);
+    color: #004849;
+}
+
+button.refresh-button {
+    font-size: 16px;
+}
+
+button:hover {
+    border: 1px solid #004849; /*link-color*/
+}
+
+button:disabled {
+    color: #CCDADB; /*tint link-color 80%*/
+    cursor: not-allowed;
+    border: 1px solid #CCDADB; /*tint link-color 80%*/
+}
+
 /* angular material override */
 
 button:focus {
     outline: none;
-    border: 0;
 }
 
 div:focus {
     outline: none;
-    border: 0;
 }
 
 input:focus {
+    background-color: #fff;
+    border: 1px solid #004849; /*link-color*/
+    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
     outline: none;
+}
+
+/* filter controls */
+
+.filter-controls {
+    width: 100%;
+}
+
+.filter-container {
+    height: 32px;
+    width: 318px;
+    float: left;
+}
+
+.filter {
+    margin-right: 3px;
+    float: left;
+}
+
+input.filter {
+    width: 173px;
+}
+
+.filter-type {
+    width: 120px;
+    float: left;
+}
+
+.filter-status {
+    margin-top: 10px;
+    color: #775351;
+    font-family: Roboto;
+    font-size: 13px;
+    font-weight: 500;
+    margin-bottom: 5px;
+}
+
+/* buttons */
+
+button.fa {
+    color: #004849;
+    font-size: 16px;
+}
+
+button.icon {
+    color: #004849;
+    font-size: 16px;
+}
+
+div.button {
+    height: 32px;
+    width: 90px;
+    padding: 0 8px;
+    text-transform: uppercase;
+    font-weight: 500;
+    font-size: 11px;
+    line-height: 33px;
+    text-align: center;
+    border: 0px;
+    float: right;
+    position: relative;
+    background: #728E9B;
+    color: #fff;
+    cursor: pointer;
+}
+
+div.button:hover {
+    background-color: #004849;
+}
+
+div.secondary-button {
+    height: 32px;
+    width: 90px;
+    padding: 0 8px;
+    text-transform: uppercase;
+    font-weight: 500;
+    font-size: 11px;
+    line-height: 33px;
+    text-align: center;
+    border: 0px;
+    float: right;
+    position: relative;
+    background: #E3E8EB;
+    color: #004849;
+}
+
+div.secondary-button:hover {
+    background-color: #C7D2D7;
+}
+
+/* tooltips */
+
+.qtip-nifi {
+    border: 0px !important;
+    border-radius: 2px;
+    background-color: rgba(0, 0, 0, 0.54) !important;
+    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
+    font-family: Roboto;
+    font-weight: 500;
+    font-size: 13px;
+    color: #fff !important;
+}
+
+.scrollable {
+    background: rgba(255, 255, 255, 1);
+    background: linear-gradient(to bottom,rgba(255,255,255,1) 
0,rgba(255,255,255,0.50) 95%,rgba(234,238,240,1) 100%);
+}
+
+/* progress bars */
+
+md-progress-linear > div {
+    background-color: #eaeef0 !important;
 }
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/navigation.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/navigation.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/navigation.css
index 1c601bb..ba5b705 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/navigation.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/navigation.css
@@ -42,11 +42,14 @@
 }
 
 #graph-controls .icon {
-    font-size: 12px;
+    font-size: 18px;
+    line-height: 23px;
+    margin-left: -2px;
 }
 
 #graph-controls .fa {
-    font-size: 12px;
+    font-size: 18px;
+    margin-left: -1px;
 }
 
 #graph-controls .graph-control-icon {
@@ -71,9 +74,7 @@ div.graph-control {
 }
 
 div.graph-control button {
-    height: 24px;
-    width: 24px;
-    line-height: 19px;
+    line-height: 28px;
     border: 1px solid #CCDADB; /*tint link-color 80%*/
     background-color: rgba(249,250,251,1);
     color: #004849;
@@ -89,7 +90,7 @@ div.graph-control button:disabled {
     border: 1px solid #CCDADB; /*tint link-color 80%*/
 }
 
-div.graph-control i.graph-control-expansion {
+div.graph-control div.graph-control-expansion {
     color: #004849; /*link-color*/
 }
 
@@ -138,7 +139,7 @@ div.action-button {
     text-transform:uppercase;
  }
 
-div.graph-control i.icon-disabled {
+div.graph-control div.icon-disabled {
     color: #ddd;
 }
 

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/new-controller-service-dialog.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/new-controller-service-dialog.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/new-controller-service-dialog.css
index 667cc7c..d568992 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/new-controller-service-dialog.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/new-controller-service-dialog.css
@@ -20,50 +20,54 @@
 */
 
 #new-controller-service-dialog {
-    z-index: 1301;
-    display: none;
-    width: 800px;
-    height: 450px;
-    line-height: normal;
+    min-height:620px;
+    height: 620px;
+    width: 760px;
+    min-width: 760px;
 }
 
-#controller-service-tag-cloud-container {
-    float: left;
-    width: 190px;
-    height: 350px;
+#new-controller-service-dialog span.link {
+    cursor: pointer;
+    color: #004849;
+    font-weight: bold;
+    display: inline-block;
+    background-color: #E3E8EB;
+    border-radius: 2px;
+    padding: 1px 4px;
 }
 
-#controller-service-types-container {
-    float: left;
-    width: 588px;
-    height: 350px;
+#controller-service-tag-cloud-container {
+    padding: 0px;
 }
 
-#controller-service-description-container {
-    width: 588px;
-    height: 100px;
-    margin-top: 10px;
+#controller-service-types-container {
+    padding: 0px;
 }
 
 #controller-service-type-name {
-    font-size: 12pt;
+    font-size: 12px;
     font-weight: bold;
-    color: #527991;
-    margin-bottom: 6px;
-    width: 588px;
+    margin-bottom: 2px;
+    min-height: 15px;
+    padding: 0px 0px 5px 0px;
+}
+
+#controller-service-type-name-title {
+    font-family: Roboto Slab;
+    padding: 20px 0px 10px 0px;
 }
 
 #controller-service-type-description {
-    width: 588px;
     height: 62px;
-    font-size: 10px;
-    line-height: 12px;
+    font-size: 12px;
+    line-height: 16px;
 }
 
 #controller-service-types-table {
-    width: 586px;
-    height: 249px;
-    border: 1px solid #666;
+    min-height: 150px;
+    overflow: hidden;
+    height: 80%;
+    width: 100%;
 }
 
 #controller-service-types-table-container th {
@@ -71,55 +75,15 @@
 }
 
 /*
-    Processor tag cloud
-*/
-
-#controller-service-tag-cloud ul.tag-cloud {
-    max-height: 257px;
-}
-
-#controller-service-tag-cloud ul.tag-cloud li {
-    max-width: 180px;
-}
-
-#controller-service-tag-cloud div.tag-cloud-separator {
-    width: 180px;
-}
-
-#controller-service-tag-cloud ul.tag-filter li {
-    width: 180px;
-}
-
-#controller-service-tag-cloud div.selected-tag-text {
-    width: 160px;
-}
-
-/*
     Processor type table filter
 */
 
 #controller-service-type-filter-controls {
-    float: right;
-    margin-top: -35px;
-    margin-right: 2px;
-    margin-bottom: 7px;
-}
-
-#controller-service-type-filter-status {
-    font-size: 9px;
-    font-weight: bold;
-    color: #9f6000;
-    clear: left; 
-    line-height: normal;
-    margin-left: 5px;
+    min-height: 32px;
+    padding: 0px;
+    margin: 0px;
 }
 
 #controller-service-type-filter {
-    padding: 3px 0px 1px 3px;
-    font-size: 12px;
-    height: 18px;
-    line-height: 20px;
-    width: 173px;
-    border: 1px solid #ccc;
-    float: left;
+    width: 200px;
 }
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/new-processor-dialog.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/new-processor-dialog.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/new-processor-dialog.css
index 21dd292..e9f6151 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/new-processor-dialog.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/new-processor-dialog.css
@@ -14,55 +14,60 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+
 /* 
     New processor dialog.
 */
 
 #new-processor-dialog {
-    z-index: 1301;
-    display: none;
-    width: 800px;
-    height: 450px;
-    line-height: normal;
+    min-height:620px;
+    height: 620px;
+    width: 760px;
+    min-width: 760px;
 }
 
-#processor-tag-cloud-container {
-    float: left;
-    width: 190px;
-    height: 350px;
+#new-processor-dialog span.link{
+    cursor: pointer;
+    color: #004849;
+    font-weight: bold;
+    display: inline-block;
+    background-color: #E3E8EB;
+    border-radius: 2px;
+    padding: 1px 4px;
 }
 
 #processor-types-container {
-    float: left;
-    width: 588px;
-    height: 350px;
+    padding: 0px;
 }
 
 #processor-description-container {
-    width: 588px;
-    height: 100px;
-    margin-top: 10px;
+    padding: 0px;
 }
 
 #processor-type-name {
-    font-size: 12pt;
+    font-size: 12px;
     font-weight: bold;
-    color: #527991;
-    margin-bottom: 6px;
-    width: 588px;
+    margin-bottom: 2px;
+    min-height: 15px;
+    padding: 0px 0px 5px 0px;
+}
+
+#processor-type-name-title {
+    font-family: Roboto Slab;
+    padding: 20px 0px 10px 0px;
 }
 
 #processor-type-description {
-    width: 588px;
     height: 62px;
-    font-size: 10px;
-    line-height: 12px;
+    font-size: 12px;
+    line-height: 16px;
 }
 
 #processor-types-table {
-    width: 586px;
-    height: 249px;
-    border: 1px solid #666;
+    min-height: 150px;
+    overflow: hidden;
+    height: 80%;
+    width: 100%;
 }
 
 #processor-types-table-container th {
@@ -70,55 +75,14 @@
 }
 
 /*
-    Processor tag cloud
-*/
-
-#processor-tag-cloud ul.tag-cloud {
-    max-height: 257px;
-}
-
-#processor-tag-cloud ul.tag-cloud li {
-    max-width: 180px;
-}
-
-#processor-tag-cloud div.tag-cloud-separator {
-    width: 180px;
-}
-
-#processor-tag-cloud ul.tag-filter li {
-    width: 180px;
-}
-
-#processor-tag-cloud div.selected-tag-text {
-    width: 160px;
-}
-
-/*
     Processor type table filter
 */
 
 #processor-type-filter-controls {
-    float: right;
-    margin-top: -35px;
-    margin-right: 2px;
-    margin-bottom: 7px;
-}
-
-#processor-type-filter-status {
-    font-size: 9px;
-    font-weight: bold;
-    color: #9f6000;
-    clear: left; 
-    line-height: normal;
-    margin-left: 5px;
+    min-height: 32px;
+    padding: 0px;
 }
 
 #processor-type-filter {
-    padding: 3px 0px 1px 3px;
-    font-size: 12px;
-    height: 18px;
-    line-height: 20px;
-    width: 173px;
-    border: 1px solid #ccc;
-    float: left;
+    width: 200px;
 }
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/new-reporting-task-dialog.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/new-reporting-task-dialog.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/new-reporting-task-dialog.css
index 5b53cea..10b0c11 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/new-reporting-task-dialog.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/new-reporting-task-dialog.css
@@ -20,50 +20,54 @@
 */
 
 #new-reporting-task-dialog {
-    z-index: 1301;
-    display: none;
-    width: 800px;
-    height: 450px;
-    line-height: normal;
+    min-height:620px;
+    height: 620px;
+    width: 760px;
+    min-width: 760px;
 }
 
-#reporting-task-tag-cloud-container {
-    float: left;
-    width: 190px;
-    height: 350px;
+#new-reporting-task-dialog span.link{
+    cursor: pointer;
+    color: #004849;
+    font-weight: bold;
+    display: inline-block;
+    background-color: #E3E8EB;
+    border-radius: 2px;
+    padding: 1px 4px;
 }
 
 #reporting-task-types-container {
-    float: left;
-    width: 588px;
-    height: 350px;
+    padding: 0px;
 }
 
 #reporting-task-description-container {
-    width: 588px;
-    height: 100px;
-    margin-top: 10px;
+    padding: 0px;
 }
 
 #reporting-task-type-name {
-    font-size: 12pt;
+    font-size: 12px;
     font-weight: bold;
-    color: #527991;
-    margin-bottom: 6px;
-    width: 588px;
+    margin-bottom: 2px;
+    min-height: 15px;
+    padding: 0px 0px 5px 0px;
+}
+
+#reporting-task-type-name-title {
+    font-family: Roboto Slab;
+    padding: 20px 0px 10px 0px;
 }
 
 #reporting-task-type-description {
-    width: 588px;
     height: 62px;
-    font-size: 10px;
-    line-height: 12px;
+    font-size: 12px;
+    line-height: 16px;
 }
 
 #reporting-task-types-table {
-    width: 586px;
-    height: 249px;
-    border: 1px solid #666;
+    min-height: 150px;
+    overflow: hidden;
+    height: 80%;
+    width: 100%;
 }
 
 #reporting-task-types-table-container th {
@@ -71,55 +75,15 @@
 }
 
 /*
-    Processor tag cloud
-*/
-
-#reporting-task-tag-cloud ul.tag-cloud {
-    max-height: 257px;
-}
-
-#reporting-task-tag-cloud ul.tag-cloud li {
-    max-width: 180px;
-}
-
-#reporting-task-tag-cloud div.tag-cloud-separator {
-    width: 180px;
-}
-
-#reporting-task-tag-cloud ul.tag-filter li {
-    width: 180px;
-}
-
-#reporting-task-tag-cloud div.selected-tag-text {
-    width: 160px;
-}
-
-/*
     Processor type table filter
 */
 
 #reporting-task-type-filter-controls {
-    float: right;
-    margin-top: -35px;
-    margin-right: 2px;
-    margin-bottom: 7px;
-}
-
-#reporting-task-type-filter-status {
-    font-size: 9px;
-    font-weight: bold;
-    color: #9f6000;
-    clear: left; 
-    line-height: normal;
-    margin-left: 5px;
+    min-height: 32px;
+    padding: 0px;
+    margin: 0px;
 }
 
 #reporting-task-type-filter {
-    padding: 3px 0px 1px 3px;
-    font-size: 12px;
-    height: 18px;
-    line-height: 20px;
-    width: 173px;
-    border: 1px solid #ccc;
-    float: left;
+    width: 200px;
 }
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/port-configuration.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/port-configuration.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/port-configuration.css
index f48d893..4cf3389 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/port-configuration.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/port-configuration.css
@@ -26,12 +26,12 @@
 }
 
 #port-name {
-    width: 300px;
+    width: 70%;
     float: left;
 }
 
-.port-field {
-    width: 370px;
+#port-name-container {
+    height: 32px;
 }
 
 textarea.port-field {
@@ -40,11 +40,10 @@ textarea.port-field {
 
 div.port-setting {
     margin-bottom: 15px;
-    width: 380px;
 }
 
 div.port-enabled {
-    width: 12px;
+    width: 20%;
     height: 12px;
     float: left;
     margin-right: 4px;

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/process-group-configuration.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/process-group-configuration.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/process-group-configuration.css
index f4a3714..bff0e21 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/process-group-configuration.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/process-group-configuration.css
@@ -16,21 +16,20 @@
  */
 
 #process-group-configuration {
-    position: absolute;
-    top: 0px;
-    right: 0px;
-    bottom: 0px;
-    left: 0px;
     display: none;
-    padding: 20px;
 }
 
 #add-process-group-configuration-controller-service {
     float: right;
-    width: 19px;
-    height: 19px;
     margin-top: 4px;
     cursor: pointer;
+    font-size: 16px;
+    text-transform: uppercase;
+}
+
+#process-group-controller-services-table {
+    height: 100%;
+    width: 100%;
 }
 
 /* settings tabs */
@@ -39,9 +38,14 @@
     float: left;
 }
 
+#process-group-refresh-container {
+    position: absolute;
+    bottom: 10px;
+    left: 20px;
+    height: 32px;
+}
+
 #process-group-configuration-refresh-button {
-    height: 24px;
-    width: 26px;
     float: left;
 }
 
@@ -60,11 +64,6 @@
 
 /* general */
 
-#general-process-group-configuration {
-    margin-top: -190px;
-    margin-left: 10px;
-}
-
 #general-process-group-configuration input, 
#general-process-group-configuration textarea {
     font-size: 11px !important;
     font-family: Verdana;

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/processor-configuration.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/processor-configuration.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/processor-configuration.css
index 1186aaa..c2e6171 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/processor-configuration.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/processor-configuration.css
@@ -28,60 +28,12 @@
     display: none;
 }
 
-div.processor-configuration-tab-container {
-    margin-top: -10px;
-    padding: 5px 11px;
-}
-
 #processor-configuration-advanced {
     display: none;
 }
 
-#processor-configuration-tabs {
-    background-color: transparent;
-    width: 778px;
-    height: 21px;
-    border-bottom: 3px solid #666;
-}
-
-#processor-configuration div.configuration-tab {
-    height: 320px;
-    overflow: auto;
-    padding: 10px;
-    background: #eee url(../images/bgTabContainer.png) repeat-x;
-    display: none;
-}
-
-/* processor settings */
-
-#processor-configuration div.settings-left {
-    float: left;
-    width: 330px;
-}
-
-#processor-configuration div.settings-right {
-    float: left;
-    width: 382px;
-}
-
-#processor-configuration div.spacer {
-    float: left;
-    margin-right: 40px;
-}
-
-#processor-configuration .setting-input {
-    font-size: 11px !important;
-    width: 320px;
-}
-
-#processor-configuration .small-setting-input {
-    font-size: 11px !important;
-    width: 130px;
-}
-
 #processor-name {
-    font-size: 11px !important;
-    width: 250px;
+    width: 70%;
     float: left;
 }
 
@@ -92,22 +44,15 @@ div.processor-configuration-tab-container {
     margin-right: 4px;
 }
 
+#processor-name-container {
+    height: 32px;
+}
+
 div.processor-enabled-container {
     float: left;
-    margin-top: 5px;
+    margin-top: 8px;
     margin-left: 10px;
-}
-
-#bulletin-level-combo {
-    width: 130px;
-    height: 18px;
-    line-height: 18px;
-}
-
-#scheduling-strategy-combo {
-    width: 130px;
-    height: 18px;
-    line-height: 18px;
+    width: 20%;
 }
 
 #event-driven-warning {
@@ -129,11 +74,9 @@ div.processor-configuration-warning-icon {
 
 #auto-terminate-relationship-names {
     border: 0 solid #CCCCCC;
-    height: 280px;
     overflow-y: auto;
     overflow-x: hidden;
     padding: 2px;
-    width: 376px;
 }
 
 div.processor-relationship-container {
@@ -143,7 +86,6 @@ div.processor-relationship-container {
 #processor-configuration div.relationship-name {
     display: inline-block;
     line-height: normal;
-    width: 340px;
 }
 
 div.relationship-description {
@@ -154,7 +96,9 @@ div.relationship-description {
 
 #run-duration-container {
     height: 20px;
-    width: 382px;
+    width: 340px;
+    margin-left: auto;
+    margin-right: auto;
 }
 
 #run-duration-slider {
@@ -178,32 +122,32 @@ div.relationship-description {
 
 #run-duration-one {
     float: left;
-    margin-left: 25px;
+    margin-left: 11px;
 }
 
 #run-duration-two {
     float: left;
-    margin-left: 28px;
+    margin-left: 15px;
 }
 
 #run-duration-three {
     float: left;
-    margin-left: 27px;
+    margin-left: 12px;
 }
 
 #run-duration-four {
     float: left;
-    margin-left: 24px;
+    margin-left: 11px;
 }
 
 #run-duration-five {
     float: left;
-    margin-left: 23px;
+    margin-left: 9px;
 }
 
 #run-duration-six {
     float: left;
-    margin-left: 33px;
+    margin-left: 21px;
 }
 
 #run-duration-seven {
@@ -241,6 +185,4 @@ div.relationship-description {
 
 #processor-comments {
     height: 250px;
-    width: 748px !important;
-    margin-top: 10px;
 }
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/processor-details.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/processor-details.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/processor-details.css
index c259a30..2450845 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/processor-details.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/processor-details.css
@@ -28,43 +28,13 @@
     display: none;
 }
 
-div.processor-details-tab-container {
-    margin-top: -10px;
-    padding: 5px 11px;
-}
-
-#processor-details-tabs {
-    background-color: transparent;
-    width: 778px;
-    height: 21px;
-    border-bottom: 3px solid #666;
-}
-
 #processor-details div.details-tab {
     height: 330px;
-    padding: 10px;
-    background: #eee url(../images/bgTabContainer.png) repeat-x;
     display: none;
 }
 
 #read-only-processor-comments {
-    overflow: auto;
-    height: 260px;
-}
-
-#processor-details div.settings-left {
-    float: left;
-    width: 330px;
-}
-
-#processor-details div.settings-right {
-    float: left;
-    width: 382px;
-}
-
-#processor-details div.spacer {
-    float: left;
-    margin-right: 40px;
+    height: 100%;
 }
 
 #read-only-auto-terminate-relationship-names {
@@ -84,9 +54,9 @@ div.processor-details-tab-container {
 
 div.concurrently-schedulable-tasks-setting, div.scheduling-period-setting, 
div.penalty-duration-setting, div.yield-duration-setting, 
div.scheduling-strategy-setting, div.bulletin-setting {
     float: left;
-    width: 140px;
+    width: 40%;
 }
 
 div.scheduling-period-setting, div.yield-duration-setting {
-    margin-left: 36px;
+    margin-left: 20%;
 }
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/provenance.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/provenance.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/provenance.css
index 58a0bbc..16c0788 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/provenance.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/provenance.css
@@ -24,44 +24,20 @@
     bottom: 0px;
     left: 0px;
     right: 0px;
-}
-
-div.provenance-panel {
-    bottom: 20px;
-    left: 20px;
-    overflow: hidden;
-    position: absolute;
-    right: 20px;
-    top: 55px;
-}
-
-#provenance-header-and-filter {
-    height: 35px;
-    margin-top: 20px;
-    margin-left: 20px;
-    margin-right: 20px;
+    overflow: auto;
 }
 
 #provenance-header-text {
-    float: left;
-    font-size: 16px;
+    font-size: 18px;
     font-weight: bold;
-    line-height: normal;
+    color: #728E9B;
+    font-family: Roboto Slab;
+    margin-bottom: 15px;
 }
 
 #provenance-refresh-container {
-    height: 26px;
-    margin-top: 18px;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-}
-
-#provenance-last-refreshed-container {
-    float: left;
-    color: #666;
-    font-weight: normal;
-    margin-top: 6px;
-    margin-left: 3px;
+    position: absolute;
+    bottom: 0px;
 }
 
 #provenance-loading-container {
@@ -81,12 +57,6 @@ div.provenance-panel {
     padding-top: 10px;
 }
 
-#refresh-button {
-    height: 24px;
-    width: 26px;
-    float: left;
-}
-
 /* filter controls */
 
 #provenance-filter-controls {
@@ -99,12 +69,7 @@ div.provenance-panel {
 }
 
 #provenance-filter {
-    padding: 3px 0px 1px 3px;
-    font-size: 12px;
-    height: 18px;
-    line-height: 20px;
     width: 173px;
-    border: 1px solid #ccc;
     margin-right: 3px;
     float: left;
 }
@@ -114,86 +79,47 @@ input.provenance-filter-list {
 }
 
 #provenance-filter-type {
-    width: 135px;
-    height: 18px;
-    line-height: 18px;
+    width: 128px;
     float: left;
 }
 
-#provenance-filter-stats {
-    font-size: 9px;
-    font-weight: bold;
-    color: #9f6000;
-    clear: left; 
-    line-height: normal;
-    margin-left: 5px;
-}
-
 #oldest-event-message {
     display: none;
-    color: #9F6000;
-    font-weight: bold;
-    line-height: normal;
-    float: left;
-    clear: left;
-    margin-top: 4px;
+    font-family: Roboto;
+    font-size: 13px;
+    font-weight: normal;
+    margin-bottom: 5px;
 }
 
 /* provenance search controls */
 
 #provenance-search-container {
-    position: absolute;
-    right: 0px;
-    top: 20px;
+    float: right;
+    position: relative;
+    top: -38px;
 }
 
 #provenance-search-button {
-    height: 20px;
-    line-height: 20px;
-    width: 55px;
-    text-align: center;
-    font-weight: bold;
-    border: 1px solid #AAAAAA;
-    color: #525252;
-    float: left;
-    margin-right: 0;
-    padding: 0;
+    float: right;
 }
 
 #provenance-search-overview {
-    float: left;
-    color: #9F6000;
-    font-size: 9px;
-    font-weight: bold;
-    line-height: normal;
-    float: left;
-    margin-top: 6px;
-    margin-right: 8px;
+    font-family: Roboto;
+    font-size: 13px;
+    font-weight: normal;
+    margin-bottom: 5px;
 }
 
 #clear-provenance-search {
-    cursor: pointer;
-    color:#31849B;
-    text-decoration: underline;
-    margin-left: 5px;
     display: none;
 }
 
 /* provenance search dialog */
 
-#provenance-search-dialog {
-    display: none;
-    width: 454px;
-    height: 515px;
-    z-index: 1301;
-}
-
 #searchable-fields-container {
-    width: 426px;
-    height: 220px;
-    border: 1px solid #aaa;
+    width: 100%;
+    min-height: 185px;
     padding: 5px;
-    padding-right: 0px;
     overflow: auto;
 }
 
@@ -202,25 +128,24 @@ div.searchable-field {
 }
 
 div.searchable-field-name {
-    width: 150px;
+    width: 25%;
     float: left;
     line-height: 26px;
 }
 
 div.searchable-field-value {
     float: left;
-}
-
-input.searchable-field-input {
-    width: 245px;
+    width: 75%;
 }
 
 .start-date-setting, .start-time-setting, .end-date-setting, .end-time-setting 
{
     float: left;
+    width: 49%;
 }
 
 .start-date-setting, .end-date-setting {
-    margin-right: 15px;
+    margin-right: 2%;
+    width: 49%;
 }
 
 .provenance-small-input {
@@ -243,47 +168,18 @@ input.searchable-field-input {
 
 /* event details dialog */
 
-#event-details-dialog {
-    display: none;
-    width: 800px;
-    height: 450px;
-    z-index: 1301;
-}
-
-#event-details-dialog-content {
-    margin-top: -10px;
-    padding: 5px 11px
-}
-
 #event-details-tabs {
     background-color: transparent;
-    border-bottom: 3px solid #666666;
     height: 21px;
     width: 778px;
 }
 
 #event-details-dialog div.details-tab {
-    background: url("../images/bgTabContainer.png") repeat-x scroll 0 0 
#EEEEEE;
     display: none;
     height: 330px;
     padding: 10px;
 }
 
-#event-details-tab-content div.settings-left {
-    float: left;
-    width: 420px;
-}
-
-#event-details-tab-content div.spacer {
-    float: left;
-    margin-right: 40px;
-}
-
-#event-details-tab-content div.settings-right {
-    float: left;
-    width: 292px;
-}
-
 div.flowfile-container {
     width: 282px;
     height: 120px;
@@ -424,36 +320,13 @@ div.content-detail-value {
     white-space: nowrap;
 }
 
-#content-tab-content div.settings-left {
-    float: left;
-    width: 356px;
-}
-
-#content-tab-content div.spacer {
-    float: left;
-    margin-right: 40px;
-}
-
-#content-tab-content div.settings-right {
-    float: left;
-    width: 356px;
-}
-
 #replay-details {
     margin-top: 20px;
 }
 
 /* provenance/lineage query dialog */
 
-#provenance-query-dialog, #lineage-query-dialog {
-    display: none;
-    width: 400px;
-    height: 135px;
-    z-index: 1301;
-}
-
 #provenance-percent-complete, #lineage-percent-complete {
-    width: 378px;
     border-radius: 0;
 }
 
@@ -461,25 +334,13 @@ div.content-detail-value {
     border-radius: 0;
 }
 
-div.progress-label {
-    color: #000000;
-    display: block;
-    font-weight: bold;
-    text-align: center;
-    width: 378px;
-    margin-top: 4px;
-}
-
 /* provenance table */
 
 #provenance-table {
-    position: absolute;
-    top: 45px;
-    left: 0px;
-    bottom: 0px;
-    right: 0px;
-    border: 1px solid #666;
     overflow: hidden;
+    height: 80%;
+    width: 100%;
+    top: -38px;
 }
 
 /* provenance lineage */

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/queue-listing.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/queue-listing.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/queue-listing.css
index 0047c99..127a4d8 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/queue-listing.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/queue-listing.css
@@ -19,25 +19,11 @@
     Queue listing styles
 */
 
-#queue-listing-container {
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    right: 0;
-}
-
-#queue-listing-header-container {
-    height: 35px;
-    margin-top: 20px;
-    margin-left: 20px;
-    margin-right: 20px;
-}
-
 #queue-listing-header-text {
-    float: left;
-    font-size: 16px;
+    font-size: 18px;
     font-weight: bold;
+    color: #728E9B;
+    font-family: Roboto Slab;
 }
 
 #queue-listing-stats-container {
@@ -47,18 +33,10 @@
     -moz-user-select: none;
 }
 
-#queue-listing-refresh-button {
-    float: left;
-    height: 24px;
-    width: 26px;
-}
-
-#queue-listing-last-refreshed-container {
-    float: left;
-    color: #666;
-    font-weight: normal;
-    margin-top: 6px;
-    margin-left: 3px;
+#queue-listing-refresh-container {
+    position: absolute;
+    bottom: 10px;
+    left: 20px;
 }
 
 #queue-listing-last-refreshed {
@@ -87,13 +65,9 @@
 /* queue listing table */
 
 #queue-listing-table {
-    position: absolute;
-    top: 100px;
-    left: 20px;
-    bottom: 20px;
-    right: 20px;
-    border: 1px solid #666;
     overflow: hidden;
+    height: 80%;
+    width: 100%;
 }
 
 div.provenance-icon {
@@ -116,18 +90,6 @@ div.provenance-icon {
 
 /* flowfile details */
 
-#flowfile-details-dialog {
-    display: none;
-    width: 800px;
-    height: 450px;
-    z-index: 1301;
-}
-
-#flowfile-details-dialog-content {
-    margin-top: -10px;
-    padding: 5px 11px
-}
-
 #flowfile-details-tabs {
     background-color: transparent;
     border-bottom: 3px solid #666666;
@@ -142,21 +104,6 @@ div.provenance-icon {
     padding: 10px;
 }
 
-#flowfile-details-tab-content div.settings-left {
-    float: left;
-    width: 420px;
-}
-
-#flowfile-details-tab-content div.spacer {
-    float: left;
-    margin-right: 40px;
-}
-
-#flowfile-details-tab-content div.settings-right {
-    float: left;
-    width: 292px;
-}
-
 div.flowfile-header {
     color: #264C58;
     font-size: 11px;

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/remote-process-group-configuration.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/remote-process-group-configuration.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/remote-process-group-configuration.css
index a72e060..6cae4bd 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/remote-process-group-configuration.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/remote-process-group-configuration.css
@@ -42,69 +42,40 @@
     position: absolute;
     overflow: hidden;
     width: 800px;
+    min-width: 775px;
     height: 515px;
     font-size: 10px;
     z-index: 1201;
     display: none;
 }
 
-/* remote process group settings */
-
-#remote-process-group-ports div.settings-left {
-    float: left;
-    width: 378px;
-}
-
-#remote-process-group-ports div.settings-right {
-    float: left;
-    width: 378px;
-}
-
-#remote-process-group-ports div.spacer {
-    float: left;
-    margin-right: 20px;
-}
-
 #remote-process-group-transport-protocol-combo {
     width: 160px;
-    height: 18px;
-    line-height: 18px;
 }
 
 div.remote-process-group-timeout-setting, 
div.remote-process-group-yield-duration-setting,
 div.remote-process-group-proxy-host-setting, 
div.remote-process-group-proxy-port-setting,
 div.remote-process-group-proxy-user-setting, 
div.remote-process-group-proxy-password-setting {
     float: left;
-    width: 170px;
+    width: 49%;
 }
 
 div.remote-process-group-yield-duration-setting,
 div.remote-process-group-proxy-port-setting,
 div.remote-process-group-proxy-password-setting {
-    margin-left: 36px;
+    margin-left: 2%;
+    width: 49%;
 }
 
-#remote-process-group-configuration .small-setting-input {
-    width: 160px;
-}
-
-#remote-process-group-configuration input {
-    width: 370px;
-}
-
-
 /* remote process group port configuration */
 
 div.remote-port-header {
-    color: #ffffff;
-    font-weight: bold;
-    line-height: 26px;
-    height: 26px;
-    background-image: url("../images/bgTableHeader.png");
-    border-top: 1px solid #666666;
-    border-left: 1px solid #666666;
-    border-right: 1px solid #666666;
+    line-height: 32px;
+    height: 32px;
     padding: 0 5px;
+    background: #728E9B;
+    color: #fff;
+    font-weight: bold;
 }
 
 div.remote-ports-container {
@@ -132,23 +103,9 @@ div.remote-port-edit-container {
     width: 53px;
 }
 
-div.edit-button {
-    cursor: pointer;
-    width: 26px;
-    height: 24px;
-    clear: both;
-}
-
-div.edit-remote-port {
-    margin-top: 13px;
-    margin-left: 16px;
-    background: transparent url(../images/iconEditButton.png) no-repeat scroll 
top left;
-}
-
-div.edit-remote-port-hover {
-    margin-top: 13px;
-    margin-left: 16px;
-    background: transparent url(../images/iconEditButton.png) no-repeat scroll 
top right;
+button.edit-remote-port {
+    margin-top: 2px;
+    margin-left: 2px;
 }
 
 div.remote-port-details-container {
@@ -201,31 +158,10 @@ div.transmission-light-switch {
 
 div.enabled-transmission-switch {
     cursor: pointer;
-    width: 42px;
-    height: 18px;
-    margin-top: 5px;
-}
-
-div.enabled-active-transmission {
-    background: transparent url(../images/transmissionSwitchEnabled.png) 
no-repeat scroll top left;
-}
-
-div.enabled-inactive-transmission {
-    background: transparent url(../images/transmissionSwitchEnabled.png) 
no-repeat scroll top right;
 }
 
 div.disabled-transmission-switch {
-    width: 42px;
-    height: 18px;
-    margin-top: 5px;
-}
-
-div.disabled-active-transmission {
-    background: transparent url(../images/transmissionSwitchDisabled.png) 
no-repeat scroll top left;
-}
-
-div.disabled-inactive-transmission {
-    background: transparent url(../images/transmissionSwitchDisabled.png) 
no-repeat scroll top right;
+    cursor: pointer;
 }
 
 /* remote port configuration dialog */
@@ -237,7 +173,7 @@ div.disabled-inactive-transmission {
 #remote-port-concurrent-tasks {
     font-size: 11px !important;
     float: left;
-    width: 220px;
+    width: 75%;
 }
 
 #remote-port-use-compression-container {

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/reporting-task.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/reporting-task.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/reporting-task.css
index e7741e3..bf9fd36 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/reporting-task.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/reporting-task.css
@@ -29,46 +29,19 @@
     display: none;
 }
 
-div.reporting-task-configuration-tab-container {
-    margin-top: -10px;
-    padding: 5px 11px;
-}
-
 #reporting-task-configuration-advanced {
     display: none;
 }
 
-#reporting-task-configuration-tabs {
-    background-color: transparent;
-    width: 778px;
-    height: 21px;
-    border-bottom: 3px solid #666;
-}
-
 #reporting-task-configuration div.configuration-tab {
-    height: 320px;
-    overflow: auto;
-    padding: 10px;
-    background: #eee url(../images/bgTabContainer.png) repeat-x;
     display: none;
 }
 
-/* reporting-task settings */
-
-#reporting-task-configuration div.settings-left {
-    float: left;
-    width: 356px;
-}
-
-#reporting-task-configuration div.settings-right {
-    float: left;
-    width: 356px;
+.reporting-task-editable.setting-field {
+    height: 32px;
 }
 
-#reporting-task-configuration div.spacer {
-    float: left;
-    margin-right: 40px;
-}
+/* reporting-task settings */
 
 #reporting-task-name {
     font-size: 11px !important;
@@ -89,12 +62,6 @@ div.reporting-task-enabled-container {
     margin-left: 10px;
 }
 
-#reporting-task-scheduling-strategy-combo {
-    width: 150px;
-    height: 18px;
-    line-height: 18px;
-}
-
 input.reporting-task-scheduling-period {
     font-size: 11px !important;
     width: 150px;
@@ -106,6 +73,4 @@ input.reporting-task-scheduling-period {
 
 #reporting-task-comments {
     height: 250px;
-    width: 748px !important;
-    margin-top: 10px;
 }
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/settings.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/settings.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/settings.css
index 5846674..5ad7155 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/settings.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/settings.css
@@ -16,19 +16,16 @@
  */
 
 #settings {
-    position: absolute;
-    top: 0px;
-    right: 0px;
-    bottom: 0px;
-    left: 0px;
     display: none;
-    padding: 20px;
 }
 
 div.settings-header-text {
-    height: 35px;
-    font-size: 16px;
+    height: 28px;
+    font-size: 18px;
     font-weight: bold;
+    color: #728E9B;
+    padding-top: 28px;
+    margin-bottom: 30px;
 }
 
 div.settings-container {
@@ -37,68 +34,27 @@ div.settings-container {
 
 #new-service-or-task {
     float: right;
-    width: 19px;
-    height: 19px;
-    margin-top: 4px;
     cursor: pointer;
 }
 
-/* settings tabs */
-
-div.settings-tabs-container {
-    border-bottom: 2px solid #666;
+#settings-refresh-container {
+    height: 32px;
+    position: absolute;
+    bottom: 10px;
+    left: 20px;
 }
 
-div.settings-tabs {
-    float: left;
-}
+/* settings tabs */
 
-.settings-tab {
-    display: block;
-    padding: 0 5px;
-    height: 26px;
+div.settings-tabs {
     float: left;
-    color: #666;
-    background-color: #ccc;
-    border-left: 1px solid #b5b5b5;
-    border-top: 1px solid #b5b5b5;
-    border-right: 1px solid #b5b5b5;
-    margin-right: 5px;
-    text-align: center;
-    cursor: pointer;
-    line-height: 26px;
-    font-weight: bold;
-}
-
-.settings-selected-tab {
-    color: #fff;
-    background-color: #666;
-    border-left: 1px solid #666;
-    border-top: 1px solid #666;
-    border-right: 1px solid #666;
-}
-
-div.settings-tab-background {
-    height: 200px;
-    margin-top: 1px;
-    background-color: transparent;
-    background: linear-gradient(to bottom, #dddddd, #ffffff);
-    filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, 
startColorstr=#dddddd, endColorstr=#ffffff);
-}
-
-#settings div.configuration-tab, #process-group-configuration 
div.configuration-tab {
-    display: none;
 }
 
 div.settings-table {
-    position: absolute;
-    top: 115px;
-    left: 25px;
-    bottom: 20px;
-    right: 25px;
-    border: 1px solid #666;
+    min-height: 150px;
     overflow: hidden;
-    background-color: #fff;
+    height: 80%;
+    width: 100%;
 }
 
 span.sorted {
@@ -111,16 +67,6 @@ div.settings-refresh-button {
     float: left;
 }
 
-div.settings-last-refreshed-container {
-    float: left;
-    color: #666;
-    font-weight: normal;
-    margin-top: 6px;
-    margin-left: 3px;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-}
-
 #settings-loading-container {
     float: left;
     width: 16px;
@@ -136,11 +82,6 @@ div.settings-last-refreshed-container {
 
 /* general */
 
-#general-settings {
-    margin-top: -190px;
-    margin-left: 10px;
-}
-
 #general-settings input {
     font-size: 11px !important;
     font-family: Verdana;
@@ -149,8 +90,11 @@ div.settings-last-refreshed-container {
 }
 
 div.settings-buttons {
-    margin-left: 310px;
-    margin-top: 10px;
+    float: right;
+}
+
+.editable.settings-buttons {
+    float: left;
 }
 
 div.settings-buttons div.button {

http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/shell.css
----------------------------------------------------------------------
diff --git 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/shell.css
 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/shell.css
index 2cc8cfc..8552af1 100644
--- 
a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/shell.css
+++ 
b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/shell.css
@@ -26,35 +26,24 @@
     left: 20px;
     bottom: 20px;
     right: 20px;
-    border: 6px solid #365c6a;
-    box-shadow: 4px 4px 6px rgba(0,0,0,.9);
-    -webkit-box-shadow: 4px 4px 6px rgba(0,0,0,.9);
-    -moz-box-shadow: 4px 4px 6px rgba(0,0,0,.9);
 }
 
 #shell-container {
     background: #fff;
-    border: 6px solid #d4e0e5;
-    position: absolute;
-    top: 0px;
-    left: 0px;
-    bottom: 0px;
-    right: 0px;
+    box-shadow: 0 5px 8px rgba(0,0,0,0.30);
+    padding: 20px;
 }
 
 #shell-close-container {
-    background: url(../images/bgShellClose.png) no-repeat;
-    background-color: #d4e0e5;
     float: right;
-    height: 25px;
 }
 
 #shell-undock-button {
     display: none;
     float: left;
-    height: 16px;
-    width: 16px;
-    margin: 5px -5px 0px 12px;
+    margin: 0px 5px 0px;
+    color: #004849;
+    font-size: 16px;
 }
 
 div.undock-normal {
@@ -67,9 +56,8 @@ div.undock-hover {
 
 #shell-close-button {
     float: left;
-    height: 16px;
-    width: 16px;
-    margin: 5px 5px 0 12px;
+    color: #004849;
+    font-size: 16px;
 }
 
 div.close-normal {
@@ -81,18 +69,6 @@ div.close-hover {
 }
 
 #shell {
-    position: absolute;
-    top: 30px;
-    left: 10px;
-    bottom: 10px;
-    right: 10px;
-    overflow: hidden;
-}
-
-#shell-iframe {
-    position: absolute;
-    top: 0px;
-    left: 0px;
-    bottom: 0px;
-    right: 0px;
+    width: 100%;
+    height: 100%;
 }
\ No newline at end of file

Reply via email to