diff --git a/src/networking/components/VpcView.css b/src/networking/components/VpcView.css
index deedb20..835aa79 100644
--- a/src/networking/components/VpcView.css
+++ b/src/networking/components/VpcView.css
@@ -19,6 +19,10 @@
     color:mediumseagreen;
 }
 
+.vpc-view .decimal-part {
+    margin-left: 10px;
+}
+
 .vpc-view .part {
     border-bottom: solid 1px;
 }
@@ -41,6 +45,6 @@
     margin:0 3px;
 }
 
-.vpc-details {
-    margin-top: 20px;
+.vpc-view .address-container {
+    margin: 20px 0;
 }
\ No newline at end of file
diff --git a/src/networking/components/VpcView.tsx b/src/networking/components/VpcView.tsx
index a8c65f1..cac1e22 100644
--- a/src/networking/components/VpcView.tsx
+++ b/src/networking/components/VpcView.tsx
@@ -7,18 +7,14 @@ import IpAddressBinaryString from './IpAddressBinaryString';
 import { IpAddress, IpAddressWithSubnetMask, SubnetCommand, VpcCommand } from '../models';
 import formatter, { padLeft } from '../../core/formatter';
 
-type ViewMode = "color" | "table";
+
+const MAX_NON_HOSTS_BITS = 30; // leave two bits for hosts min
 
 function SubnetView(props : {vpc : VpcCommand}) {
 
-    const mode : ViewMode = "color";
-
     const [vpc, setVpc] = useState(VpcModel.create(props.vpc));
 
     const subnetMaskSize = vpc.cidr.maskBits + vpc.subnetBits;
-    const vpcPart = getNetworkAddress(vpc.cidr).toBinaryString(true).substring(0, vpc.cidr.maskBits);
-    const subnetsPart = padLeft("0", vpc.subnetBits, "0");
-    const lastPart = padLeft("0", 32 - (vpc.cidr.maskBits + vpc.subnetBits), "0");
     const maxSubnets = Math.pow(2, vpc.subnetBits);
     const hostsPerSubnet = getAddressSpaceSize(subnetMaskSize);
     const networkAddress = getNetworkAddress(vpc.cidr);
@@ -33,60 +29,27 @@ function SubnetView(props : {vpc : VpcCommand}) {
 
     return <React.Fragment>
         
-        <div className="expression vpc-view">
-        <div style={{display: mode === "color" ? '': 'none'}}>
-            <BinaryStringView binaryString={split.vpc} disableHighlight={true} className="address-space soft" />
-            <BinaryStringView binaryString={split.subnet} disableHighlight={true} className="address-space subnet-part"/>
-            <BinaryStringView binaryString={split.hosts} disableHighlight={true} className="address-space host-part" />
-        </div>
-            <div style={{display: mode === "color" ? 'none': ''}}>
-                <table>
-                    <tr>
-                        <td className="address-space-label">
-                            VPC
-                        </td>
-                        <td className="address-space-label">
-                            Subnets
-                        </td>
-                        <td className="address-space-label">
-                            Hosts
-                        </td>
-                    </tr>
-                    <tr>
-                        <td>
-                            <button onClick={decrVpc} disabled={vpc.cidr.maskBits <= 1} title="Increase vpc space">-</button>
-                                <BinaryStringView binaryString={vpcPart}  className="address-space" />
-                            <button onClick={incrVpc} disabled={subnetMaskSize >= 30} title="Decrease vpc space">+</button>
-                        </td>
-                        <td>
-                            <button onClick={decrSubnet} disabled={vpc.subnetBits <= 1} title="Increase subnet space">-</button>
-                                <BinaryStringView binaryString={subnetsPart} className="address-space" />
-                            <button onClick={incrSubnet} disabled={vpc.cidr.maskBits + vpc.subnetBits >= 30} title="Decrease subnet space">+</button>
-                        </td>
-                        <td>
-                            <BinaryStringView binaryString={lastPart} className="address-space" />
-                        </td>
-                    </tr>
-                   
-                </table>
+            <div className="expression vpc-view">
+           
+            <div className="address-container">
+                <div>
+                    <span>VPC Network Address</span>
+                </div>
+                <BinaryStringView binaryString={split.vpc} disableHighlight={true} className="address-space soft" />
+                <BinaryStringView binaryString={split.subnet} disableHighlight={true} className="address-space subnet-part"/>
+                <BinaryStringView binaryString={split.hosts} disableHighlight={true} className="address-space host-part" />
+                <span className="address-space decimal-part">{networkAddress.toString()}</span>
             </div>
+
             <table className="vpc-details">
-                <tr>
-                    <td className="soft">
-                        VPC Network Address: 
-                    </td>
-                    <td>
-                          {getNetworkAddress(vpc.cidr).toString()}
-                    </td>
-                </tr>              
                 <tr>
                     <td className="soft">
                         VPC CIDR Mask: 
                     </td>
                     <td>
-                        <button onClick={decrVpc} disabled={vpc.cidr.maskBits <= 1} title="Increase vpc space">-</button>
+                        <button onClick={decrVpc} disabled={vpc.cidr.maskBits <= 1} title="Decrease vpc address bits">-</button>
                          /{vpc.cidr.maskBits}
-                         <button onClick={incrVpc} disabled={subnetMaskSize >= 30} title="Decrease vpc space">+</button>
+                         <button onClick={incrVpc} disabled={subnetMaskSize >= MAX_NON_HOSTS_BITS} title="Increse vpc address bits">+</button>
                     </td>
                 </tr>
                 <tr>
@@ -94,9 +57,9 @@ function SubnetView(props : {vpc : VpcCommand}) {
                         Subnet CIDR Mask:
                     </td>
                     <td>
-                        <button onClick={decrSubnet} disabled={vpc.subnetBits <= 1} title="Increase subnet space">-</button>
+                        <button onClick={decrSubnet} disabled={vpc.subnetBits <= 1} title="Increase subnet bits">-</button>
                         /{subnetMaskSize}
-                        <button onClick={incrSubnet} disabled={vpc.cidr.maskBits + vpc.subnetBits >= 30} title="Decrease subnet space">+</button>
+                        <button onClick={incrSubnet} disabled={vpc.cidr.maskBits + vpc.subnetBits >= MAX_NON_HOSTS_BITS} title="Increase subnet bits">+</button>
                     </td>
                 </tr>
                 <tr>
@@ -104,7 +67,9 @@ function SubnetView(props : {vpc : VpcCommand}) {
                         Max Subnets in VPC:
                     </td>
                     <td>
-                    {maxSubnets}
+                        <button onClick={decrSubnet} disabled={vpc.subnetBits <= 1} title="Decrease subnet bits">-</button>
+                        {maxSubnets}
+                        <button onClick={incrSubnet} disabled={vpc.cidr.maskBits + vpc.subnetBits >= MAX_NON_HOSTS_BITS} title="Increase subnet bits">+</button>
                     </td>
                 </tr>
                 <tr>
@@ -128,7 +93,7 @@ function SubnetView(props : {vpc : VpcCommand}) {
     </React.Fragment>;
 }
 
-function VpcRow(props: { ip: IpAddress, descr: string}) {
+function Indicator2(props: { ip: IpAddress, descr: string}) {
 
     const {ip, descr} = props;
 
diff --git a/src/shell/AppState.ts b/src/shell/AppState.ts
index 5bf75e9..bf77c13 100644
--- a/src/shell/AppState.ts
+++ b/src/shell/AppState.ts
@@ -74,7 +74,7 @@ export default class AppState {
 
     setUiTheme(theme: string) {
          this.uiTheme = theme;
-         this.triggerChanged();    
+         this.triggerChanged();
     }
 
     toggleDebugMode() {
diff --git a/src/shell/components/AppRoot.tsx b/src/shell/components/AppRoot.tsx
index f904efc..c43d973 100644
--- a/src/shell/components/AppRoot.tsx
+++ b/src/shell/components/AppRoot.tsx
@@ -7,6 +7,7 @@ import log from 'loglevel';
 import DebugIndicators from './DebugIndicators';
 import hash from '../../core/hash';
 import TopLinks from './TopLinks';
+import Toggle from './Toggle';
 
 
 type AppRootProps = {
@@ -60,7 +61,7 @@ export default class AppRoot extends React.Component<AppRootProps, AppRootState>
                         <InputBox onCommandEntered={(input) => cmd.execute(input)} />
 
                         <span className="configPnl">
-                            <span id="emphasizeBytes" data-cmd="em" className={"indicator " + this.getIndicator(this.state.emphasizeBytes)} title="Toggle Emphasize Bytes" onClick={() => this.toggleEmphasizeBytes()}>[em]</span>
+                            <Toggle elementId="emphasizeBytes" text="[em]" isOn={this.state.emphasizeBytes} onClick={() => this.toggleEmphasizeBytes()} title="Toggle Emphasize Bytes"  />                            
                         </span>
                     </div>
 
diff --git a/src/shell/components/Toggle.tsx b/src/shell/components/Toggle.tsx
new file mode 100644
index 0000000..1ff9723
--- /dev/null
+++ b/src/shell/components/Toggle.tsx
@@ -0,0 +1,23 @@
+
+import React from "react";
+
+export type ToggleProps = {
+    text: string,
+    isOn: boolean,
+    title: string,
+    elementId?: string
+    onClick: () => void
+};
+
+function Toggle(props:  ToggleProps) {
+    return <span id={props.elementId} 
+        className={"indicator " + getIndicator(props.isOn)} 
+        title={props.title} 
+        onClick={() => props.onClick()}>{props.text}</span>
+}
+
+function getIndicator(value : boolean) {
+    return value ? 'on' : 'off';
+}
+
+export default Toggle;
\ No newline at end of file