diff --git a/src/common/table.js b/src/common/table.js
index d68191a..87a52be 100644
--- a/src/common/table.js
+++ b/src/common/table.js
@@ -17,7 +17,7 @@
 
 import React, { Component } from 'react';
 import _ from 'lodash';
-import { Table, Button, FormControl, FormLabel, FormCheck } from 'react-bootstrap';
+import { Table, Button, FormControl, FormLabel, FormCheck, Tooltip, OverlayTrigger } from 'react-bootstrap';
 import { Link } from 'react-router-dom';
 import Icon from './icon';
 
@@ -103,11 +103,13 @@ class CustomTable extends Component {
 
     // add buttons
     if (child.props.editButton) {
-      cell.push(<Button variant='table-control-button' onClick={() => child.props.onEdit(index)} disabled={child.props.onEdit == null}><Icon icon='edit' /></Button>);
+      cell.push(<OverlayTrigger key={0} placement={'bottom'} overlay={<Tooltip id={`tooltip-${"edit"}`}> Edit </Tooltip>} >
+      <Button variant='table-control-button' onClick={() => child.props.onEdit(index)} disabled={child.props.onEdit == null}><Icon icon='edit' /></Button></OverlayTrigger>);
     }
 
     if (child.props.deleteButton) {
-      cell.push(<Button variant='table-control-button' onClick={() => child.props.onDelete(index)} disabled={child.props.onDelete == null}><Icon icon='trash' /></Button>);
+      cell.push(<OverlayTrigger key={1} placement={'bottom'} overlay={<Tooltip id={`tooltip-${"delete"}`}> Delete </Tooltip>} >
+      <Button variant='table-control-button' onClick={() => child.props.onDelete(index)} disabled={child.props.onDelete == null}><Icon icon='trash' /></Button></OverlayTrigger>);
     }
 
     if (child.props.checkbox) {
@@ -117,7 +119,8 @@ class CustomTable extends Component {
     }
 
     if (child.props.exportButton) {
-      cell.push(<Button variant='table-control-button' onClick={() => child.props.onExport(index)} disabled={child.props.onExport == null}><Icon icon='download' /></Button>);
+      cell.push(<OverlayTrigger key={2} placement={'bottom'} overlay={<Tooltip id={`tooltip-${"export"}`}> Export </Tooltip>} >
+      <Button variant='table-control-button' onClick={() => child.props.onExport(index)} disabled={child.props.onExport == null}><Icon icon='download' /></Button></OverlayTrigger>);
     }
 
     return cell;
diff --git a/src/dashboard/dashboard-button-group.js b/src/dashboard/dashboard-button-group.js
index 8baeece..b18e5b3 100644
--- a/src/dashboard/dashboard-button-group.js
+++ b/src/dashboard/dashboard-button-group.js
@@ -17,13 +17,13 @@
 
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Button } from 'react-bootstrap';
+import { Button,OverlayTrigger, Tooltip } from 'react-bootstrap';
 import Icon from "../common/icon";
 
 class DashboardButtonGroup extends React.Component {
   render() {
     const buttonStyle = {
-      marginLeft: '8px'
+      marginLeft: '12px',
     };
 
     const buttons = [];
@@ -35,46 +35,60 @@ class DashboardButtonGroup extends React.Component {
 
     if (this.props.editing) {
       buttons.push(
-        <Button key={key++} onClick={this.props.onSave} style={buttonStyle}>
-          <Icon icon="save" /> Save
-        </Button>,
-        <Button key={key++} onClick={this.props.onCancel} style={buttonStyle}>
-          <Icon icon="times" /> Cancel
+        <OverlayTrigger key={key++} placement={'bottom'} overlay={<Tooltip id={`tooltip-${"save"}`}> Save changes </Tooltip>} >
+        <Button variant= 'light' size="lg" key={key} onClick={this.props.onSave} style={buttonStyle}>
+          <Icon icon="save" /> 
         </Button>
+        </OverlayTrigger>,
+        <OverlayTrigger key={key++}  placement={'bottom'} overlay={<Tooltip id={`tooltip-${"cancel"}`}> Discard changes </Tooltip>} >
+        <Button key={key} variant= 'light' size="lg" onClick={this.props.onCancel} style={buttonStyle}>
+          <Icon icon="times" />
+        </Button>
+        </OverlayTrigger>
       );
     } else {
       if (this.props.fullscreen !== true) {
         buttons.push(
-          <Button key={key++} onClick={this.props.onFullscreen} style={buttonStyle}>
-            <Icon icon="expand" /> Fullscreen
+          <OverlayTrigger key={key++} placement={'bottom'} overlay={<Tooltip id={`tooltip-${"expand"}`}> Change to fullscreen view </Tooltip>} >
+          <Button key={key} variant= 'light' size="lg" onClick={this.props.onFullscreen} style={buttonStyle}>
+            <Icon icon="expand" /> 
           </Button>
+          </OverlayTrigger>
         );
       }
 
       if (this.props.paused) {
         buttons.push(
-          <Button key={key++} onClick={this.props.onUnpause} style={buttonStyle}>
-            <Icon icon="play" /> Live
+          <OverlayTrigger key={key++} placement={'bottom'} overlay={<Tooltip id={`tooltip-${"play"}`}> Continue simulation </Tooltip>} >
+          <Button key={key} variant= 'light' size="lg" onClick={this.props.onUnpause} style={buttonStyle}>
+            <Icon icon="play" /> 
           </Button>
+          </OverlayTrigger>
         );
       } else {
         buttons.push(
-          <Button key={key++} onClick={this.props.onPause} style={buttonStyle}>
-            <Icon icon="pause" /> Pause
+          <OverlayTrigger key={key++} placement={'bottom'} overlay={<Tooltip id={`tooltip-${"pause"}`}> Pause simulation </Tooltip>} >
+          <Button key={key} variant= 'light' size="lg" onClick={this.props.onPause} style={buttonStyle}>
+            <Icon icon="pause" /> 
           </Button>
+          </OverlayTrigger>
         );
       }
 
       buttons.push(
-        <Button key={key++} onClick={this.props.onEditFiles} style={buttonStyle}>
-          <Icon icon="file" /> Edit Files
+        <OverlayTrigger key={key++} placement={'bottom'} overlay={<Tooltip id={`tooltip-${"file"}`}> Add, edit or delete files of scenario </Tooltip>} >
+        <Button key={key} variant= 'light' size="lg" onClick={this.props.onEditFiles} style={buttonStyle}>
+          <Icon icon="file" />
         </Button>
+        </OverlayTrigger>
       );
 
       buttons.push(
-        <Button key={key++} onClick={this.props.onEdit} style={buttonStyle}>
-          <Icon icon="pen" /> Edit Layout
+        <OverlayTrigger key={key++} placement={'bottom'} overlay={<Tooltip id={`tooltip-${"layout"}`}> Add widgets and edit layout </Tooltip>} >
+        <Button key={key} variant= 'light' size="lg" onClick={this.props.onEdit} style={buttonStyle}>
+          <Icon icon="pen" /> 
         </Button>
+        </OverlayTrigger>
       );
 
     }
diff --git a/src/dashboard/dashboard.js b/src/dashboard/dashboard.js
index 05f69e1..e45d6aa 100644
--- a/src/dashboard/dashboard.js
+++ b/src/dashboard/dashboard.js
@@ -240,7 +240,6 @@ class Dashboard extends Component {
 
   closeEditFiles(){
     this.setState({ filesEditModal: false });
-    // TODO do we need this if the dispatches happen in the dialog?
   }
 
   closeEdit(data){
diff --git a/src/widget/toolbox-item.js b/src/widget/toolbox-item.js
index b61bdc4..4703aee 100644
--- a/src/widget/toolbox-item.js
+++ b/src/widget/toolbox-item.js
@@ -51,7 +51,7 @@ class ToolboxItem extends React.Component {
     if (this.props.disabled === false) {
       return this.props.connectDragSource(
         <div className={itemClass}>
-          <span className="btn btn-info ">
+          <span className="btn btn-outline-info ">
             {this.props.icon && <Icon style={{marginRight: '5px'}} icon={this.props.icon} /> }
             {this.props.name}
           </span>
diff --git a/src/widget/widget-toolbox.js b/src/widget/widget-toolbox.js
index 18912f1..b2fb527 100644
--- a/src/widget/widget-toolbox.js
+++ b/src/widget/widget-toolbox.js
@@ -54,6 +54,11 @@ class WidgetToolbox extends React.Component {
       <ToolboxItem name='Box' type='widget' icon = 'plus'/>
       <ToolboxItem name='HTML' type='html' icon = 'plus'/>
       <ToolboxItem name='Topology' type='widget' disabled={thereIsTopologyWidget} title={topologyItemMsg} icon = 'plus'/>
+      <OverlayTrigger key={0} placement={'bottom'} overlay={<Tooltip id={`tooltip-${"?"}`}> Drag and drop widgets onto the dashboard </Tooltip>} >   
+      <Button variant="light" size="sm" key={0}  >     
+          <Icon icon="question" />
+      </Button>
+      </OverlayTrigger>
 
       <div className='section-buttons-group-right'>
         <div>
@@ -65,12 +70,12 @@ class WidgetToolbox extends React.Component {
       <div className='section-buttons-group-right'>
         <div>
         <OverlayTrigger key={0} placement={'bottom'} overlay={<Tooltip id={`tooltip-${"increase"}`}> Increase dashboard height </Tooltip>} >
-          <Button variant="dark" key={0} onClick={() => this.props.onDashboardSizeChange(1)}  >
+          <Button variant="light" key={0} onClick={() => this.props.onDashboardSizeChange(1)}  >
           <Icon icon="plus" /> 
           </Button>
           </OverlayTrigger>
           <OverlayTrigger key={1} placement={'bottom'} overlay={<Tooltip id={`tooltip-${"decrease"}`}> Decrease dashboard height </Tooltip>} >
-          <Button variant="dark" key={1} onClick={() => this.props.onDashboardSizeChange(-1)} >
+          <Button variant="light" key={1} onClick={() => this.props.onDashboardSizeChange(-1)} >
           <Icon icon="minus" /> 
           </Button>
           </OverlayTrigger>