diff --git a/public/controllers/agentsPreview.js b/public/controllers/agentsPreview.js
index 1132a3fb0..32b0981a7 100644
--- a/public/controllers/agentsPreview.js
+++ b/public/controllers/agentsPreview.js
@@ -120,7 +120,7 @@ app.controller('agentsPreviewController', function ($scope, $mdDialog, DataFacto
 		
     };
 	
-	$scope.bulkOperation = function (operation){
+	function bulkOperation(operation){
 		var selectedAgents = [];
 		angular.forEach($scope.agents.items, function(agent){
 			if(agent.selected){
@@ -133,21 +133,18 @@ app.controller('agentsPreviewController', function ($scope, $mdDialog, DataFacto
 		if(selectedAgents.length > 0){
 			switch (operation){
 				case "delete":
-					if(confirm("Do you want to delete the selected agents?")){
-						apiReq.request('DELETE', '/agents', requestData)
-							.then(function (data) {
-								load();
-								if(data.data.ids.length!=0){
-									data.data.ids.forEach(function(id) {
-										notify.error('The agent ' + id + ' was not deleted.');
-									});
-								} 
-								else{
-									notify.info(data.data.msg);
-								}
-							}, printError);
-
-					}
+					apiReq.request('DELETE', '/agents', requestData)
+						.then(function (data) {
+							load();
+							if(data.data.ids.length!=0){
+								data.data.ids.forEach(function(id) {
+									notify.error('The agent ' + id + ' was not deleted.');
+								});
+							} 
+							else{
+								notify.info(data.data.msg);
+							}
+						}, printError);
 					break;	
 			}
 		}
@@ -186,7 +183,7 @@ app.controller('agentsPreviewController', function ($scope, $mdDialog, DataFacto
 		}
 	}
 	
-	$scope.showPrerenderedDialog = function(ev) {
+	$scope.showNewAgentDialog = function(ev) {
 		$mdDialog.show({
 			contentElement: '#newAgentDialog',
 			parent: angular.element(document.body),
@@ -195,6 +192,22 @@ app.controller('agentsPreviewController', function ($scope, $mdDialog, DataFacto
 		});
 	};
 	
+	$scope.showDeletePrompt = function(ev) {
+		// Appending dialog to document.body to cover sidenav in docs app
+		var confirm = $mdDialog.prompt()
+			.title('Remove selected agents')
+			.textContent('Write REMOVE to remove all the selected agents. CAUTION! This action can not be undone.')
+			.targetEvent(ev)
+			.ok('Remove')
+			.cancel('Close');
+
+		$mdDialog.show(confirm).then(function(result) {
+			if(result==='REMOVE'){
+				bulkOperation('delete');
+			};
+		});
+	};
+	
 	$scope.hidePrerenderedDialog = function(ev) {
 		$scope.newAgentKey = '';
 		$mdDialog.hide();
diff --git a/public/less/main.less b/public/less/main.less
index 34b0749cf..0f0bf3567 100644
--- a/public/less/main.less
+++ b/public/less/main.less
@@ -9,11 +9,28 @@ body{
 	width: 5.6rem;
 	height: 5.6rem;
 	border-radius: 50%;
-	margin: 30px;
+}
+
+.md-button.md-fab md-icon{
+	color: white;
+}
+
+div.agent-buttons {
+	position: fixed;
 	bottom: 0;
 	right: 0;
-	position: fixed;
-	color: white;
+	margin: 30px;
+	z-index: 5;
+}
+.md-button.add-agent-icon {
+position:relative;
+	margin: 0 10px 20px 0;
+}
+
+.md-button.delete-agent-icon {
+	background-color: #e8488b;
+	position: relative;
+	margin: 0 30px 20px 0;
 }
 
 .new-agent-key{
diff --git a/public/templates/agents-preview.html b/public/templates/agents-preview.html
index c50bd04df..e546e6336 100644
--- a/public/templates/agents-preview.html
+++ b/public/templates/agents-preview.html
@@ -87,16 +87,6 @@
 								</md-input-container>
 							</div>
 						</div>
-						<div layout="row" layout-align="start stretch">
-							<div class="top-bulk-action" layout="row" class="sideNavBox" flex="20">
-								<md-input-container flex class="md-whiteframe-z1 md-input-margin">
-									<md-select id="eventBox" ng-model="$parent._bulkOperation" ng-change="bulkOperation($parent._bulkOperation)" aria-label="Filter by status">
-										<md-option value="nothing">Action</md-option>
-										<md-option value="delete">Delete selected</md-option>
-									</md-select>
-								</md-input-container>
-							</div>
-						</div>
 						<div>
 							<md-toolbar layout="row">
 								<div class="md-toolbar-tools">
@@ -134,24 +124,15 @@
 						</md-list-item>
 					</md-list>
 					<md-divider></md-divider>
-										<div flex layout="column" layout-align="space-between stretch">
-
-					<div layout="row" layout-align="start stretch">
-							<div layout="row" class="sideNavBox" flex="20">
-								<md-input-container flex class="md-whiteframe-z1 md-input-margin">
-									<md-select id="eventBox" ng-model="$parent._bulkOperation" ng-change="bulkOperation($parent._bulkOperation)" aria-label="Filter by status">
-										<md-option value="nothing">Action</md-option>
-										<md-option value="delete">Delete selected</md-option>
-									</md-select>
-								</md-input-container>
-							</div>
-					</div>
-					</div>
 			</div>
-			<md-button class="md-fab" ng-click="showPrerenderedDialog($event)"  >
-				<md-icon md-font-library="material-icons">add</md-icon>
-			</md-button>
-			
+			<div class="agent-buttons">
+				<md-button class="md-fab add-agent-icon" ng-click="showNewAgentDialog($event)"  >
+					<md-icon md-font-library="material-icons">add</md-icon>
+				</md-button>
+				<md-button class="md-fab delete-agent-icon" ng-click="showDeletePrompt($event)"  >
+					<md-icon md-font-library="material-icons">delete</md-icon>
+				</md-button>
+			</div>
 			<div style="visibility: hidden">
 				<div class="md-dialog-container" id="newAgentDialog">
 					<div ng-show="newAgentKey != ''">