diff --git a/app/common/directives/app-header.html b/app/common/directives/app-header.html
index 3258968..54b09f9 100644
--- a/app/common/directives/app-header.html
+++ b/app/common/directives/app-header.html
@@ -1,21 +1,34 @@
-<div id="header__wrapper" role="banner">
-<!-- HEADER -->
-<header id="header">
-    <span class="app__version float-left">OpenBMC for IBM Power Systems {{dataService.app_version}}</span>
-    <a href="" class="header__logout" ng-click="logout()">Log out</a>
-</header>
-<div class="header__functions-wrapper" aria-label="header">
-    <div class="logo__wrapper"><img src="assets/images/logo.svg" class="header__logo"  alt="company logo"/></div>
-	<div class="header__server-name">
-		<p class="header__hostname">{{dataService.hostname}}</p>
-		<p class="header__server-ip courier-bold">BMC IP address {{dataService.server_id}}</p>
+<div id="header__wrapper">
+	<!-- HEADER -->
+	<header id="header">
+		<span class="app__version float-left">OpenBMC for IBM Power Systems {{dataService.app_version}}</span>
+		<a href="" class="header__logout" ng-click="logout()">Log out</a>
+	</header>
+	<div class="header__functions-wrapper" role="heading">
+		<div class="logo__wrapper"><img src="assets/images/logo.svg" class="header__logo" alt="company logo"/></div>
+		<button class="inline header__multi-server" aria-label="multi server select" ng-class="{'active': multi_server_recent}" ng-click="multiRecent();">
+			<span class="icon icon-angle" aria-hidden="true"></span><span class="accessible-text">Multi server switcher</span>
+		</button>
+		<div class="inline header__server-name">
+			<p class="header__hostname">{{dataService.hostname}}</p>
+			<p class="header__server-ip courier-bold">BMC IP address {{dataService.server_id}}</p>
+		</div>
+		<div class="header__functions" ng-class="{'active' : toggle}">
+			<a class="header__info" ng-click="toggle = !toggle"><span>Server Info</span><i class="icon icon-angle" aria-hidden="true"></i></a>
+			<a href="#/server-health/event-log" class="header__server-health">Server health
+				<i class="icon icon-angle" aria-hidden="true"></i><span ng-class="{'status-light__error': dataService.server_health == 'Critical', 'status-light__warn': dataService.server_health == 'Warning', 'status-light__good': dataService.server_health == 'Good'}">{{dataService.server_health}}</span></a>
+			<a href="#/server-control/power-operations" class="header__server-power" role="button">Server power
+				<i class="icon icon-angle" aria-hidden="true"></i><span ng-class="{'status-light__off': dataService.server_state == 'Off', 'status-light__disabled': dataService.server_state == 'Unreachable', 'status-light__good': dataService.server_state == 'Running', 'status-light__warn': dataService.server_state == 'Quiesced'}">{{dataService.server_state}}</span></a>
+			<p class="header__refresh">Data last refreshed<span>{{dataService.last_updated |date:'h:mm:ss MMM dd yyyy'}}</span>
+			</p>
+			<button class="header__page-refresh" ng-click="refresh()" aria-label="refresh page data">
+				<span>Refresh</span>
+				<svg data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 52.18 51.91">
+					<path class="cls-1" d="M38,20.77H52v-14H48.3v6.07A26,26,0,1,0,48.7,38H44.32a22.14,22.14,0,1,1,1.8-20.92H38v3.67Z" transform="translate(0.16 0.14)"/>
+			</button>
+		</div>
 	</div>
-    <div class="header__functions" ng-class="{'active' : toggle}">
-	    <a class="header__info" ng-click="toggle = !toggle"><span>Server Info</span><i class="icon icon-angle" aria-hidden="true"></i></a>
-        <a href="#/server-health/event-log" class="header__server-health">Server health <i class="icon icon-angle" aria-hidden="true"></i><span ng-class="{'status-light__error': dataService.server_health == 'Critical', 'status-light__warn': dataService.server_health == 'Warning', 'status-light__good': dataService.server_health == 'Good'}">{{dataService.server_health}}</span></a>
-        <a href="#/server-control/power-operations" class="header__server-power" role="button">Server power <i class="icon icon-angle" aria-hidden="true"></i><span ng-class="{'status-light__off': dataService.server_state == 'Off', 'status-light__disabled': dataService.server_state == 'Unreachable', 'status-light__good': dataService.server_state == 'Running', 'status-light__warn': dataService.server_state == 'Quiesced'}">{{dataService.server_state}}</span></a>
-        <p class="header__refresh">Data last refreshed<span>{{dataService.last_updated |date:'h:mm:ss MMM dd yyyy'}}</span></p>
-        <button class="header__page-refresh" ng-click="refresh()" aria-label="refresh page data"><span>Refresh</span><svg data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 52.18 51.91"><path class="cls-1" d="M38,20.77H52v-14H48.3v6.07A26,26,0,1,0,48.7,38H44.32a22.14,22.14,0,1,1,1.8-20.92H38v3.67Z" transform="translate(0.16 0.14)"/></button>
-    </div>
 </div>
-</div>
+
+<!-- multi-server recent dropdown -->
+<div ng-include="" src="'multi-server/controllers/multi-server-recent-controller.html'"></div>
diff --git a/app/common/directives/app-header.js b/app/common/directives/app-header.js
index cb4704e..6844c9c 100644
--- a/app/common/directives/app-header.js
+++ b/app/common/directives/app-header.js
@@ -80,6 +80,10 @@
                     $scope.$on('$destroy', function(){
                         loginListener();
                     });
+
+                    $scope.multiRecent = function(){
+                        $scope.multi_server_recent = !$scope.multi_server_recent;
+                    };
                 }]
             };
         }]);
diff --git a/app/common/directives/app-navigation.html b/app/common/directives/app-navigation.html
index c2c6f67..3be698b 100644
--- a/app/common/directives/app-navigation.html
+++ b/app/common/directives/app-navigation.html
@@ -65,7 +65,7 @@
 			</span>
 		</li>
 		<li class="btn-multi-server">
-			<a ng-class="{opened: firstLevel == 'multi-server'}" href="#/multi-server/overview" ng-click="change('multi-server')">
+			<a ng-class="{opened: firstLevel == 'multi-server'}" href="#/multi-server/overview" ng-click="change('multi-server')" tabindex="6">
 				<span>
 					<svg class="nav-icon" version="1.1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 24 24" xml:space="preserve">
 <path d="M12.8,7.3h4c0.2,1.5,1.5,2.8,3.1,2.8c1.7,0,3.1-1.4,3.1-3.1s-1.4-3.1-3.1-3.1c-1.5,0-2.7,1-3,2.4h-4C12.4,3.3,9.9,1,6.9,1
@@ -74,7 +74,7 @@
 	c0-1.7-1.4-3.1-3.1-3.1c-0.6,0-1.3,0.2-1.8,0.6l-4.7-4.7C12.2,9.7,12.7,8.5,12.8,7.3z M2.2,6.9c0-2.6,2.1-4.7,4.7-4.7
 	s4.7,2.1,4.7,4.7s-2.1,4.7-4.7,4.7S2.2,9.5,2.2,6.9z"/>
 </svg>
-				Multi Server</span></a>
+				All Servers</span></a>
 		</li>
 	</ul>
 	<ul class="nav__second-level btn-health" ng-style="navStyle" ng-class="{opened: (showSubMenu && firstLevel == 'server-health')}">
diff --git a/app/common/styles/layout/header.scss b/app/common/styles/layout/header.scss
index b2d90bc..e2d5260 100644
--- a/app/common/styles/layout/header.scss
+++ b/app/common/styles/layout/header.scss
@@ -133,22 +133,42 @@
     }
   }
 
-  .header__functions {
-    .header__server-power,
-    .header__page-refresh,
-    .header__server-health,
-    .header__info {
-      background: $lightgrey;
-      @include round-corners;
-      margin: 0 .3em;
-      height: 100%;
-      border: 1px solid $medgrey;
-      opacity: 1;
+  .header__server-power,
+  .header__page-refresh,
+  .header__server-health,
+  .header__info,
+  .header__multi-server {
+    background: $lightgrey;
+    @include round-corners;
+    margin: 0 .3em;
+    height: 100%;
+    border: 1px solid $medgrey;
+    opacity: 1;
+    @include fastTransition-all;
+    &:hover {
+      background: rgba(255, 255, 255, 1);
+    }
+  }
+
+  .header__multi-server {
+    padding: .5em;
+    padding-top: .8em;
+    float: left;
+    margin-top: 10px;
+    margin-right: -10px;
+    .icon-angle::before {
+      margin-left: 0;
+      transform: rotate(90deg);
       @include fastTransition-all;
-      &:hover {
-        background: rgba(255, 255, 255, 1);
+    }
+    &.active {
+      .icon-angle::before {
+        transform: rotate(266deg);
+        @include fastTransition-all;
       }
     }
+  }
+  .header__functions {
     .header__info {
       padding: .3em;
       min-width: 60px;
@@ -176,8 +196,8 @@
     }
 
     &.active > .header__info > .icon-angle::before {
-        transform: rotate(-360deg);
-        @include fastTransition-all;
+      transform: rotate(-360deg);
+      @include fastTransition-all;
     }
 
     .header__refresh {
@@ -189,7 +209,6 @@
       }
     }
   }
-
   .header__page-refresh {
     padding-top: 0;
     position: relative;
diff --git a/app/multi-server/controllers/multi-server-controller.html b/app/multi-server/controllers/multi-server-controller.html
index cf9daa4..b01605e 100644
--- a/app/multi-server/controllers/multi-server-controller.html
+++ b/app/multi-server/controllers/multi-server-controller.html
@@ -5,7 +5,7 @@
 	</div>
 	<section class="row column">
 		<div class="page-header">
-			<h2 class="inline h4">Displaying all auto-discovered and manually added servers</h2>
+			<h2 class="inline h4">All auto-discovered and manually added servers</h2>
 			<a class="inline float-right" ng-click="multi_server_add = !multi_server_add"><span class="icon icon__plus"></span>Add a server</a>
 		</div>
 	</section>
@@ -28,79 +28,109 @@
 			<div class="column large-12 header__actions-bar">
 				<div class="inline multi-server__title">Server name<span class="sort-heading"></span></div>
 				<div class="inline multi-server__col">BMC IP address<span class="sort-heading"></span></div>
-				<div class="inline multi-server__col">Model number<span class="sort-heading sort-down"></span></div>
-				<div class="inline multi-server__col narrow-col">Power<span class="sort-heading sort-up"></span></div>
+				<div class="inline multi-server__col">Model number<span class="sort-heading" ng-class="sort-down"></span></div>
+				<div class="inline multi-server__col narrow-col">Power<span class="sort-heading" ng-class="sort-up"></span></div>
 				<div class="inline multi-server__col narrow-col">Status<span class="sort-heading"></span></div>
 			</div>
 		</div>
 		<!-- server -->
 		<div class="multi-server__col-row">
 			<div class="inline multi-server__title">IBM Power Witherspoon 2 (current)</div>
-			<div class="inline multi-server__col courier-bold"><span class="multi-server__label">BMC IP address</span>9.3.111.222
+			<div class="inline multi-server__col courier-bold">
+				<span class="multi-server__label">BMC IP address</span>
+				<span class="multi-server__data">9.3.111.222</span>
 			</div>
-			<div class="inline multi-server__col courier-bold"><span class="multi-server__label">Model number</span>8335-GTC
+			<div class="inline multi-server__col courier-bold">
+				<span class="multi-server__label">Model number</span>
+				<span class="multi-server__data">8335-GTC</span>
 			</div>
 			<div class="inline multi-server__col narrow-col bold">
-				<span class="multi-server__label">Power</span><span class="icon icon__off"></span>Off
+				<span class="multi-server__label">Power</span>
+				<span class="multi-server__data"><span class="icon icon__off" ng-class="{'icon__off': dataService.server_state == 'Off' || 'Unreachable', 'icon__good': dataService.server_state == 'Running', 'icon_standby': dataService.server_state == 'Standby'}"></span>Off</span>
 			</div>
 			<div class="inline multi-server__col narrow-col bold">
-				<span class="multi-server__label">Status</span><span class="icon icon__warning" ng-class="{'icon__critical': sensor.status == 'critical', 'icon__warning': sensor.status == 'warning', 'icon__normal': sensor.status == 'normal'}" aria-label="multi.status"></span>Warning
+				<span class="multi-server__label">Status</span>
+				<span class="multi-server__data"><span class="icon icon__critical" ng-class="{'icon__critical': sensor.status == 'critical', 'icon__warning': sensor.status == 'warning', 'icon__normal': sensor.status == 'normal'}" aria-label="multi.status"></span>Emergency</span>
 			</div>
 		</div>
 		<!-- server -->
 		<div class="multi-server__col-row">
 			<div class="inline multi-server__title">IBM Power Witherspoon 6</div>
-			<div class="inline multi-server__col courier-bold"><span class="multi-server__label">BMC IP address</span>9.3.111.222
+			<div class="inline multi-server__col courier-bold">
+				<span class="multi-server__label">BMC IP address</span>
+				<span class="multi-server__data">9.3.41.232</span>
 			</div>
-			<div class="inline multi-server__col courier-bold"><span class="multi-server__label">Model number</span>8335-GTC
+			<div class="inline multi-server__col courier-bold">
+				<span class="multi-server__label">Model number</span>
+				<span class="multi-server__data">PRT85-GTC</span>
 			</div>
 			<div class="inline multi-server__col narrow-col bold">
-				<span class="multi-server__label">Power</span><span class="icon icon__good"></span>On
+				<span class="multi-server__label">Power</span>
+				<span class="multi-server__data"><span class="icon icon__good"></span>On</span>
 			</div>
 			<div class="inline multi-server__col narrow-col bold">
-				<span class="multi-server__label">Status</span><span class="icon icon__good" ng-class="{'icon__critical': sensor.status == 'critical', 'icon__warning': sensor.status == 'warning', 'icon__normal': sensor.status == 'normal'}" aria-label="multi.status"></span>Good
+				<span class="multi-server__label">Status</span>
+				<span class="multi-server__data"><span class="icon icon__good" ng-class="{'icon__critical': sensor.status == 'critical', 'icon__warning': sensor.status == 'warning', 'icon__normal': sensor.status == 'normal'}" aria-label="multi.status"></span>Good</span>
 			</div>
 		</div>
 		<!-- server -->
 		<div class="multi-server__col-row">
 			<div class="inline multi-server__title">IBM Power Witherspoon 4</div>
-			<div class="inline multi-server__col courier-bold"><span class="multi-server__label">BMC IP address</span>9.3.111.222
+			<div class="inline multi-server__col courier-bold">
+				<span class="multi-server__label">BMC IP address</span>
+				<span class="multi-server__data">9.3.21.233</span>
 			</div>
-			<div class="inline multi-server__col courier-bold"><span class="multi-server__label">Model number</span>8335-GTC
+			<div class="inline multi-server__col courier-bold">
+				<span class="multi-server__label">Model number</span>
+				<span class="multi-server__data">MKU-GTC</span>
 			</div>
 			<div class="inline multi-server__col narrow-col bold">
-				<span class="multi-server__label">Power</span><span class="icon icon__good"></span>On
+				<span class="multi-server__label">Power</span>
+				<span class="multi-server__data"><span class="icon icon__good"></span>On</span>
 			</div>
 			<div class="inline multi-server__col narrow-col bold">
-				<span class="multi-server__label">Status</span><span class="icon icon__good" ng-class="{'icon__critical': sensor.status == 'critical', 'icon__warning': sensor.status == 'warning', 'icon__normal': sensor.status == 'normal'}" aria-label="multi.status"></span>Good
+				<span class="multi-server__label">Status</span>
+				<span class="multi-server__data"><span class="icon icon__good" ng-class="{'icon__critical': sensor.status == 'critical', 'icon__warning': sensor.status == 'warning', 'icon__normal': sensor.status == 'normal'}" aria-label="multi.status"></span>Good</span>
 			</div>
 		</div>
 		<!-- server -->
 		<div class="multi-server__col-row">
 			<div class="inline multi-server__title">Server 100023476 ligula sed magna dictum porta. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem</div>
-			<div class="inline multi-server__col courier-bold"><span class="multi-server__label">BMC IP address</span>9.3.111.222
+			<div class="inline multi-server__col courier-bold">
+				<span class="multi-server__label">BMC IP address</span>
+				<span class="multi-server__data">9.3.51.244</span>
 			</div>
-			<div class="inline multi-server__col courier-bold"><span class="multi-server__label">Model number</span>8335-GTC
+			<div class="inline multi-server__col courier-bold">
+				<span class="multi-server__label">Model number</span>
+				<span class="multi-server__data">854-GTC</span>
 			</div>
 			<div class="inline multi-server__col narrow-col bold">
-				<span class="multi-server__label">Power</span><span class="icon icon__good"></span>On
+				<span class="multi-server__label">Power</span>
+				<span class="multi-server__data"><span class="icon icon__good"></span>On</span>
 			</div>
 			<div class="inline multi-server__col narrow-col bold">
-				<span class="multi-server__label">Status</span><span class="icon icon__critical" ng-class="{'icon__critical': sensor.status == 'critical', 'icon__warning': sensor.status == 'warning', 'icon__normal': sensor.status == 'normal'}" aria-label="multi.status"></span>Critical
+				<span class="multi-server__label">Status</span>
+				<span class="multi-server__data"><span class="icon icon__critical" ng-class="{'icon__critical': sensor.status == 'critical', 'icon__warning': sensor.status == 'warning', 'icon__normal': sensor.status == 'normal'}" aria-label="multi.status"></span>Critical</span>
 			</div>
 		</div>
 		<!-- server -->
-		<div class="multi-server__col-row">
+		<div class="multi-server__col-row" ng-show="multi_server_row">
 			<div class="inline multi-server__title">Server 100023476</div>
-			<div class="inline multi-server__col courier-bold"><span class="multi-server__label">BMC IP address</span>9.3.111.222
+			<div class="inline multi-server__col courier-bold">
+				<span class="multi-server__label">BMC IP address</span>
+				<span class="multi-server__data">9.3.185.164</span>
 			</div>
-			<div class="inline multi-server__col courier-bold"><span class="multi-server__label">Model number</span>8335-GTC
+			<div class="inline multi-server__col courier-bold">
+				<span class="multi-server__label">Model number</span>
+				<span class="multi-server__data">82225-GTC</span>
 			</div>
 			<div class="inline multi-server__col narrow-col bold">
-				<span class="multi-server__label">Power</span><span class="icon icon__standby"></span>Standby
+				<span class="multi-server__label">Power</span>
+				<span class="multi-server__data"><span class="icon icon__standby"></span>Standby</span>
 			</div>
 			<div class="inline multi-server__col narrow-col bold">
-				<span class="multi-server__label">Status</span><span class="icon icon__good" ng-class="{'icon__critical': sensor.status == 'critical', 'icon__warning': sensor.status == 'warning', 'icon__normal': sensor.status == 'normal'}" aria-label="multi.status"></span>Good
+				<span class="multi-server__label">Status</span>
+				<span class="multi-server__data"><span class="icon icon__warning" ng-class="{'icon__critical': sensor.status == 'critical', 'icon__warning': sensor.status == 'warning', 'icon__normal': sensor.status == 'normal'}" aria-label="multi.status"></span>Warning</span>
 			</div>
 		</div>
 	</section>
@@ -121,8 +151,8 @@
 		<form id="multi-server_add-form" class="multi-server__add-form" action="">
 			<div class="modal__content row">
 				<div class="column large-12">
-					<label for="multi-server__host">Hostname</label>
-					<input id="multi-server__host" type="text" autofocus/>
+					<label for="multi-server__host">BMC IP Address</label>
+					<input id="multi-server__host" ng-model="multi_ip" type="text" autofocus/>
 				</div>
 				<div class="column large-6">
 					<label for="username">Username</label>
@@ -140,7 +170,7 @@
 			</label>
 			<div class="modal__button-wrapper">
 				<button class="inline btn-secondary" ng-click="multi_server_add=false;">Cancel</button>
-				<button class="inline btn-primary" ng-click="">Add</button>
+				<button class="inline btn-primary" ng-click="multi_server_row = true; multi_server_add = false; multi_ip = null">Add</button>
 			</div>
 			<p class="login__error-msg" role="alert" ng-if="error">Incorrect username or password</p>
 			<p class="login__error-msg" role="alert" ng-if="server_unreachable">Server unreachable</p>
diff --git a/app/multi-server/controllers/multi-server-controller.js b/app/multi-server/controllers/multi-server-controller.js
index 8d737cb..6bd8783 100644
--- a/app/multi-server/controllers/multi-server-controller.js
+++ b/app/multi-server/controllers/multi-server-controller.js
@@ -13,14 +13,42 @@
     angular
         .module('app.overview')
         .controller('multiServerController', [
-            '$scope', 
-            '$window', 
-            'APIUtils', 
+            '$scope',
+            '$window',
+            'APIUtils',
             'dataService',
             function($scope, $window, APIUtils, dataService){
                 $scope.dataService = dataService;
+                $scope.customSearch = "";
+                $scope.searchTerms = [];
                 $scope.loading = false;
+                $scope.clear = function(){
+                    $scope.customSearch = "";
+                    $scope.searchTerms = [];
+                }
 
+                $scope.doSearchOnEnter = function (event) {
+                    var search = $scope.customSearch.replace(/^\s+/g,'').replace(/\s+$/g,'');
+                    if (event.keyCode === 13 &&
+                        search.length >= 2) {
+                        $scope.searchTerms = $scope.customSearch.split(" ");
+                    }else{
+                        if(search.length == 0){
+                            $scope.searchTerms = [];
+                        }
+                    }
+                };
+
+                $scope.doSearchOnClick = function() {
+                    var search = $scope.customSearch.replace(/^\s+/g,'').replace(/\s+$/g,'');
+                    if (search.length >= 2) {
+                        $scope.searchTerms = $scope.customSearch.split(" ");
+                    }else{
+                        if(search.length == 0){
+                            $scope.searchTerms = [];
+                        }
+                    }
+                };
             }
         ]
     );
diff --git a/app/multi-server/controllers/multi-server-recent-controller.html b/app/multi-server/controllers/multi-server-recent-controller.html
new file mode 100644
index 0000000..0812b40
--- /dev/null
+++ b/app/multi-server/controllers/multi-server-recent-controller.html
@@ -0,0 +1,48 @@
+<div class="multi-server__recent" ng-class="{'active': multi_server_recent}">
+	<a class="multi-server__add-server"><span class="icon icon__plus"></span>Add a server</a>
+	<a href="#/multi-server/overview" ng-click="multiRecent()" class="multi-server__view-all">View all servers (12)<i class="icon icon-angle float-right"></i></a>
+	<div class="multi-server__recent-header">Recently accessed servers</div>
+	<!-- recent server-->
+	<div class="row multi-server__recent-server">
+		<button class="column large-7 multi-server__recent-name">IBM Power Witherspoon 2 (current)</button>
+		<div class="column large-3 multi-server__recent-ip">9.3.111.222</div>
+		<div class="column large-2 multi-server__recent-power"><span class="icon icon__good"></span>On</div>
+	</div>
+	<!-- recent server-->
+	<div class="row multi-server__recent-server">
+		<button class="column large-7 multi-server__recent-name">IBM Power Witherspoon 6 Pellentesque in ipsum id orci porta dapibus</button>
+		<div class="column large-3 multi-server__recent-ip">9.3.122.132</div>
+		<div class="column large-2 multi-server__recent-power"><span class="icon icon__good"></span>On</div>
+	</div>
+	<!-- recent server-->
+	<div class="row multi-server__recent-server">
+		<button class="column large-7 multi-server__recent-name">IBM Power Witherspoon 9</button>
+		<div class="column large-3 multi-server__recent-ip">9.3.100.233</div>
+		<div class="column large-2 multi-server__recent-power"><span class="icon icon__off"></span>Off</div>
+	</div>
+	<!-- recent server-->
+	<div class="row multi-server__recent-server">
+		<button class="column large-7 multi-server__recent-name">IBM Power Witherspoon 2 (current)</button>
+		<div class="column large-3 multi-server__recent-ip">9.3.111.122</div>
+		<div class="column large-2 multi-server__recent-power"><span class="icon icon__good"></span>On</div>
+	</div>
+	<!-- recent server-->
+	<div class="row multi-server__recent-server">
+		<button class="column large-7 multi-server__recent-name">IBM Power Witherspoon 6 Pellentesque in ipsum id orci porta dapibus</button>
+		<div class="column large-3 multi-server__recent-ip">9.3.122.132</div>
+		<div class="column large-2 multi-server__recent-power"><span class="icon icon__good"></span>On</div>
+	</div>
+	<!-- recent server-->
+	<div class="row multi-server__recent-server">
+		<button class="column large-7 multi-server__recent-name">IBM Power Witherspoon 9</button>
+		<div class="column large-3 multi-server__recent-ip">9.3.100.233</div>
+		<div class="column large-2 multi-server__recent-power"><span class="icon icon__off"></span>Off</div>
+	</div>
+	<!-- recent server-->
+	<div class="row multi-server__recent-server">
+		<button class="column large-7 multi-server__recent-name">IBM Power Witherspoon 2 (current)</button>
+		<div class="column large-3 multi-server__recent-ip">9.3.11.22</div>
+		<div class="column large-2 multi-server__recent-power"><span class="icon icon__standby"></span>Standby</div>
+	</div>
+</div>
+<div class="modal-overlay" tabindex="-1" ng-class="{'active': (multi_server_recent)}"></div>
\ No newline at end of file
diff --git a/app/multi-server/styles/multi-server.scss b/app/multi-server/styles/multi-server.scss
index 2de7321..6f777b4 100644
--- a/app/multi-server/styles/multi-server.scss
+++ b/app/multi-server/styles/multi-server.scss
@@ -1,11 +1,99 @@
-@mixin state-label {
-  text-transform: uppercase;
-  font-weight: 700;
-  font-size: .8em;
+$title-minWidth: 210px;
+$col-width: calc(72% * (1 / 4) - 10px);
+$narrow-width: 17%;
+
+//Multiserver dropdown
+.multi-server__recent {
+  position: fixed;
+  z-index: 110;
+  background: $white;
+  left: 130px;
+  top: -30%;
+  max-height: 0;
+  overflow: hidden;
+  padding: 1em;
+  font-size: .95em;
+  font-weight: 600;
+  @include fastTransition-all;
+  @include mediaQuery(medium) {
+    min-width: 450px;
+  }
+  &.active {
+    top: 130px;
+    max-height: 100%;
+    overflow: scroll;
+    @include fastTransition-all;
+  }
+}
+.multi-server__add-server,
+.multi-server__view-all {
+  display: block;
+  padding: .6em .6em .6em 0;
+  width: 100%;
+  text-align: left;
 }
 
-$title-minWidth: 210px;
+.multi-server__add-server {
+  margin-bottom: 2em;
+  .icon__plus {
+    height: 18px;
+    margin-top: -2px;
+  }
+}
 
+a.multi-server__view-all {
+  color: $black;
+}
+
+.multi-server__recent-header {
+  background: $lightgrey;
+  color: $darkgrey;
+  padding: 1em 0 .7em 1em;
+  margin-left: -1em;
+  margin-right: -1em;
+  margin-top: 1em;
+}
+
+.multi-server__recent-server {
+  padding: .8em 1em;
+  border-bottom: 1px solid $medgrey;
+  margin-left: -1em;
+  margin-right: -1em;
+  &:last-child {
+    border: 0px;
+  }
+  &:hover {
+    cursor: pointer;
+    background: $lightblue;
+    @include fastTransition-all;
+  }
+  .column {
+    padding-left: 0;
+    padding-top: .5em;
+  }
+  .icon {
+    margin-left: 0;
+  }
+  @include mediaQuery(medium) {
+    border-bottom: 0;
+  }
+}
+
+.multi-server__recent-name {
+  line-height: 1.2;
+  text-align: left;
+}
+
+.multi-server__recent-ip {
+  @include fontCourierBold;
+}
+
+.multi-server__recent-power,
+.multi-server__recent-ip{
+  text-align: left;
+}
+
+//Multiserver page
 .header__actions-bar {
   padding-left: 1.5em;
   font-weight: 700;
@@ -30,7 +118,6 @@
 }
 
 .multi-server__label {
-  float: left;
   font-weight: 300;
   @include fontFamily;
   @include mediaQuery(medium) {
@@ -40,21 +127,39 @@
 
 .multi-server__col {
   width: 100%;
-  text-align: right;
+  text-align: left;
   margin-bottom: 0;
   display: none;
   padding: .5em .8em .5em .8em;
+  overflow: hidden;
   @include mediaQuery(medium) {
     display: inline-block;
-    width: auto;
-    min-width: calc(91% * (1 / 4) - 10px);
+    width: $col-width;
     padding: .5em .8em .5em 0;
     text-align: left;
+    vertical-align: top;
+    overflow-wrap: break-word;
+  }
+}
+
+.multi-server__data {
+  text-align: left;
+  float: right;
+  width:40%;
+  overflow-wrap: break-word;
+  @media (min-width: 700px){
+    width:30%;
+  }
+  @include mediaQuery(medium) {
+    float: none;
+    width: auto
   }
 }
 
 .narrow-col {
-  min-width: 12%;
+  @include mediaQuery(medium) {
+    width: $narrow-width;
+  }
 }
 
 .multi-server__col-row {
@@ -89,6 +194,7 @@
       vertical-align: top;
       margin-bottom: 0;
       padding: .5em .8em .5em 0;
+      overflow-wrap: break-word;
     }
     .icon__normal {
       width: 0;
@@ -147,5 +253,6 @@
 .multi-server__add-form {
   .control-check {
     padding-left: 25px;
+    margin-left: 1em;
   }
-}
\ No newline at end of file
+}