diff --git a/assets/css/browser-solidity.css b/assets/css/browser-solidity.css
index 7c897d33e7..995d6587ea 100644
--- a/assets/css/browser-solidity.css
+++ b/assets/css/browser-solidity.css
@@ -42,27 +42,37 @@
     display: inline-block;
 }
 
-#header {
+#righthand-panel {
+    top: 0;
+    right: 0;
+    bottom: 0;
+    box-sizing: border-box;
+    overflow: hidden;
+}
+
+#righthand-panel {
     font-size: 13px;
-    height: 100%;
+    display: flex;
+    flex-direction: column;
 }
 
-#header #solIcon {
+#righthand-panel #solIcon {
     float: right;
     height: 90%;
     background-color: white;
     padding-right: 1%;
 }
 
-#header #menu {
+#righthand-panel #menu {
     border-bottom: 3px solid #F4F6FF;
     height: 2em;
     font-size: 1em;
     padding-top: 0.5em;
     box-sizing: content-box;
+    display: flex;
 }
 
-#header #options {
+#righthand-panel #options {
     list-style: none;
     margin: 0;
     padding: 0;
@@ -70,55 +80,58 @@
     justify-content: space-between;
 }
 
-#header #options li.active {
+#righthand-panel #options li.active {
     background-color: #F4F6FF;
 }
 
-#header #options li a {
+#righthand-panel #options li a {
     color: inherit;
 }
 
-#header #optionViews {
-    clear: both;
-    overflow: auto;
+#righthand-panel #optionViews {
     background-color: #F4F6FF;
+    overflow: scroll;
     height: 100%;
 }
 
-#header #optionViews > div {
+#righthand-panel #optionViews > div {
     display: none;
 }
 
-#header #optionViews.txView #txView {
+#righthand-panel #optionViews.txView #txView {
+    display: block;
+}
+
+#righthand-panel #optionViews.settingsView #settingsView {
     display: block;
 }
 
-#header #optionViews.settingsView #settingsView {
+#righthand-panel #optionViews.publishView #publishView {
     display: block;
 }
 
-#header #optionViews.publishView #publishView {
+#righthand-panel #optionViews.compileView #compileTabView {
     display: block;
 }
 
-#header #optionViews.envView #envView {
+#righthand-panel #optionViews.runView #runTabView {
     display: block;
 }
 
-#header #optionViews.debugView #debugView {
+#righthand-panel #optionViews.debugView #debugView {
     display: block;
 }
 
-#header #optionViews.verificationView #verificationView {
+#righthand-panel #optionViews.verificationView #verificationView {
     display: block;
 }
 
-#header #optionViews.staticanalysisView #staticanalysisView {
+#righthand-panel #optionViews.staticanalysisView #staticanalysisView {
     display: block;
 }
 
-#header #optionViews.txView input,
-#header #optionViews.txView select {
+#righthand-panel #optionViews.txView input,
+#righthand-panel #optionViews.txView select {
     max-width: 13em;
     padding: 0.3em;
     box-sizing: border-box;
@@ -126,7 +139,7 @@
     border-radius: 3px;
 }
 
-#header #optionViews .pre {
+#righthand-panel #optionViews .pre {
     word-wrap: break-word;
     background-color: rgba(255, 255, 255, 0.5);
     font-family: monospace;
@@ -135,11 +148,11 @@
     padding: 0 0.6em;
 }
 
-#header #optionViews .hide {
+#righthand-panel #optionViews .hide {
     display: none;
 }
 
-#header .info {
+#righthand-panel .info {
     font-family: monospace;
     min-height: 6em;
     padding: 0.25em 0;
@@ -158,31 +171,6 @@
     cursor: pointer;
 }
 
-#publishView button {
-    background-color: #C6CFF7;
-    font-size: 12px;
-    margin-bottom: .5em;
-    color: black;
-    border:0 none;
-    border-radius: 3px;
-    width: 8em;
-    height: 20px;
-    margin-right: 1em;
-    cursor: pointer;
-}
-
-#staticanalysisView button {
-    background-color: #C6CFF7;
-    font-size: 12px;
-    padding: 0.25em;
-    margin: 2em 1em .5em 0;
-    color: black;
-    border:0 none;
-    border-radius: 3px;
-    width: 8em;
-    cursor: pointer;
-}
-
 #debugView button {
     background-color: #C6CFF7;
     font-size: 12px;
@@ -207,7 +195,7 @@
     font-weight: bold;
 }
 
-#header #versionSelector {
+#righthand-panel #versionSelector {
     text-decoration: none;
     background-color: #C6CFF7;
     cursor: pointer;
@@ -269,6 +257,7 @@
     margin-bottom: 1em;
 }
 
+.sol.success,
 .sol.error,
 .sol.warning {
     word-wrap: break-word;
@@ -280,6 +269,7 @@
     padding: 8px 15px;
 }
 
+.sol.success pre,
 .sol.error pre,
 .sol.warning pre {
     background-color: transparent;
@@ -290,6 +280,7 @@
     border-radius: 0;
 }
 
+.sol.success .close,
 .sol.error .close,
 .sol.warning .close {
     font-weight: bold;
@@ -310,6 +301,22 @@
     border: .2em dotted #ffbd01;
 }
 
+.sol.success {
+    background-color: hsla(59, 56%, 78%, 0.5);
+    border: .2em dotted green;
+}
+
+#ghostbar {
+    width: 1px;
+    background-color: red;
+    opacity: 0.5;
+    position: absolute;
+    cursor: col-resize;
+    z-index: 9999;
+    top: 0;
+    bottom: 0;
+}
+
 input[readonly] {
     display: block;
     width: 100%;
@@ -355,8 +362,13 @@ input[type="file"] {
 /* Modal Header */
 .modal-header {
     padding: 2px 16px;
-    background-color: orange;
+    background-color: hsla(59, 56%, 78%, 0.5);
+    border-top-right-radius: 3px;
+    border-top-left-radius: 3px;
     color: white;
+    display: flex;
+    align-items: baseline;
+    justify-content: space-between;
 }
 
 /* Modal Body */
@@ -365,8 +377,10 @@ input[type="file"] {
 /* Modal Footer */
 .modal-footer {
     padding: 2px 16px;
-    background-color: orange;
-    color: white;
+    background-color: hsla(59, 56%, 78%, 0.5);
+    color: black;
+    display: flex;
+    justify-content: flex-end;
 }
 
 /* Modal Content */
@@ -375,13 +389,14 @@ input[type="file"] {
     background-color: #fefefe;
     margin: auto;
     padding: 0;
-    border: 1px solid #888;
+    border-top-right-radius: 3px;
+    border-top-left-radius: 3px;
     width: 50%;
     box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
     -webkit-animation-name: animatetop;
     -webkit-animation-duration: 0.4s;
     animation-name: animatetop;
-    animation-duration: 0.4s
+    animation-duration: 0.4s;
 }
 
 #modal-footer-cancel {
@@ -395,7 +410,7 @@ input[type="file"] {
 
 /* Add Animation */
 @-webkit-keyframes animatetop {
-    from {top: -300px; opacity: 0} 
+    from {top: -300px; opacity: 0}
     to {top: 0; opacity: 1}
 }
 
diff --git a/assets/css/universal-dapp.css b/assets/css/universal-dapp.css
index 85c07e029c..c52e682dfd 100644
--- a/assets/css/universal-dapp.css
+++ b/assets/css/universal-dapp.css
@@ -93,19 +93,6 @@
 	display: none;
 }
 
-.udapp-close:before {
-	position: absolute;
-	font-family: monospace;
-	top: .4em;
-	right: .4em;
-	width: 1.5em;
-	height: 1.5em;
-	text-align: center;
-	content: "x";
-	cursor: pointer;
-	z-index: 9999;
-}
-
 .udapp .instance {
 	padding: 0.4em;
 	background-color: rgb(244, 246, 255);
@@ -144,7 +131,7 @@
 	content: "\25B6";
 }
 
-.udapp .contractProperty {
+#runTabView .contractProperty {
 	overflow: auto;
 	margin-bottom: 0.4em;
 }
@@ -187,69 +174,84 @@
 
 .udapp .instance input,
 .udapp .instance button {
-	width: 50%;
+	width: 25%;
 	float: left;
 	box-sizing: border-box;
 }
 
-.udapp .contractProperty.hasArgs input {
+#runTabView .contractProperty.hasArgs input {
 	width: 75%;
+	padding: .36em;
 }
-.udapp .contractProperty button {
-	width: 25%;
+#runTabView .contractProperty button {
+	border-radius           : 3px;
+	border                  : .3px solid #dddddd;
+	cursor                  : pointer;
+	min-height              : 25px;
+	max-height              : 25px;
+	padding                 : 3px;
+	min-width               : 100px;
+	width                   : 25%;
+	font-size               : 10px;
 }
 
-.udapp .contractProperty button.debug {
+#runTabView .contractProperty button.debug {
 	width: 12em;
 }
 
-.udapp .contractProperty button:disabled {
+#runTabView .contractProperty button:disabled {
 	cursor: not-allowed;
 	background-color: white;
 	border-color: lightgray;
 }
 
-.udapp .contractProperty .call {
+#runTabView .contractProperty .call {
 	background-color: #FFB9B9;
 	border-color: #FFB9B9;
 }
 
-.udapp .contractProperty .debug {
+#runTabView .contractProperty .debug {
 	background-color: #9DC1F5;
 	border-color: #9DC1F5;
 }
 
-.udapp .contractProperty.constant .call {
+#runTabView .contractProperty.constant .call {
 	background-color: #9DC1F5;
 	border-color: #9DC1F5;
 	width: 25%;
+	font-style: italic;
+	outline: none;
 }
 
-.udapp .contractProperty.payable .call {
+#runTabView .contractProperty.payable .call {
 	background-color: #FF8B8B;
 	border-color: #FF8B8B;
 	width: 25%;
 }
 
-.udapp .contractProperty input {
+#runTabView .contractProperty input {
 	display: none;
 }
 
-.udapp .contractProperty > .value {
+#runTabView .contractProperty > .value {
 	padding: 0 0.4em;
 	box-sizing: border-box;
-	width: 75%;
+	width: 25%;
 	float: left;
 	word-wrap: break-word;
 }
 
-.udapp .contractProperty.hasArgs input {
+#runTabView .contractProperty.hasArgs input {
 	display: block;
-	border-top-left-radius: 0;
-	border-bottom-left-radius: 0;
+	border: 1px solid #dddddd;
+	padding: .36em;
+	border-left: none;
+	padding: 8px 8px 8px 10px;
+	font-size: 10px;
+	height: 25px;
 }
 
-.udapp .contractProperty.hasArgs button {
+#runTabView .contractProperty.hasArgs button {
 	border-top-right-radius: 0;
 	border-bottom-right-radius: 0;
 	border-right: 0;
@@ -276,55 +278,3 @@
 .udapp .events .event .name {
 	margin-right: 0.5em;
 }
-
-.udapp .legend {
-	background-color: white;
-	line-height: 20px;
-	border: .2em dotted lightGrey;
-	padding: 8px 15px;
-	border-radius: 5px;
-	margin-bottom: 1em;
-	display: flex;
-	justify-content: initial;
-	flex-wrap: wrap;
-}
-
-.udapp .legend div {
-	display: inline-block;
-	margin-right: 0.5em;
-	display: flex;
-	align-items: center;
-	line-height: 0px;
-	padding: 5px;
-}
-
-.udapp .legend div:before {
-	content: ".";
-	color: transparent;
-	display: inline-block;
-	background-color: #ccc;
-	height: 1em;
-	margin-right: 0.5em;
-	width: 1em;
-	border-radius: 50%;
-}
-
-.udapp .legend .publish:before {
-	background-color: #EC96EC;
-}
-
-.udapp .legend .attach:before {
-	background-color: #B1EAC5;
-}
-
-.udapp .legend .transact:before {
-	background-color: #FFB9B9;
-}
-
-.udapp .legend .payable:before {
-	background-color: #FF8B8B;
-}
-
-.udapp .legend .call:before {
-	background-color: #9DC1F5;
-}