diff --git a/app/assets/images/icon-critical.svg b/app/assets/images/icon-critical.svg
new file mode 100644
index 0000000..3e63a84
--- /dev/null
+++ b/app/assets/images/icon-critical.svg
@@ -0,0 +1,13 @@
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 40 40" style="enable-background:new 0 0 40 40;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#E62325;}
+	.st1{opacity:0.4;fill:#E62325;}
+	.st2{fill:none;stroke:#E62325;stroke-width:2;stroke-miterlimit:10;}
+</style>
+<path class="st0" d="M20,12c4.4,0,8,3.6,8,8s-3.6,8-8,8s-8-3.6-8-8S15.6,12,20,12 M20,10c-5.5,0-10,4.5-10,10s4.5,10,10,10
+	s10-4.5,10-10S25.5,10,20,10L20,10z"/>
+<circle class="st1" cx="20" cy="20" r="8"/>
+<line class="st2" x1="14.3" y1="14.3" x2="25.7" y2="25.7"/>
+<line class="st2" x1="25.7" y1="14.3" x2="14.3" y2="25.7"/>
+</svg>
diff --git a/app/assets/images/icon-warning.svg b/app/assets/images/icon-warning.svg
index 760cca5..346893a 100644
--- a/app/assets/images/icon-warning.svg
+++ b/app/assets/images/icon-warning.svg
@@ -1,18 +1,11 @@
 <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 	 viewBox="0 0 40 40" style="enable-background:new 0 0 40 40;" xml:space="preserve">
 <style type="text/css">
-	.st0{fill:#FFCE00;}
+	.st0{opacity:0.4;fill:#FFB000;}
+	.st1{fill:#FFB000;}
 </style>
-<path d="M20,15c-2.8,0-5,2.2-5,5s2.2,5,5,5s5-2.2,5-5S22.8,15,20,15z M20,23c-1.7,0-3-1.3-3-3s1.3-3,3-3s3,1.3,3,3S21.7,23,20,23z"
-	/>
-<g>
-	<polygon class="st0" points="21.1,5.2 6,35.2 36,35.2 	"/>
-	<g>
-		<path d="M21,32.5c-0.3,0-0.5-0.1-0.8-0.2c-0.2-0.1-0.4-0.3-0.5-0.5c-0.1-0.2-0.2-0.5-0.2-0.8c0-0.3,0.1-0.6,0.2-0.8
-			c0.1-0.2,0.3-0.4,0.5-0.5c0.2-0.1,0.5-0.2,0.8-0.2c0.3,0,0.5,0.1,0.8,0.2c0.2,0.1,0.4,0.3,0.5,0.5c0.1,0.2,0.2,0.5,0.2,0.8
-			c0,0.3-0.1,0.6-0.2,0.8c-0.1,0.2-0.3,0.4-0.5,0.5C21.5,32.4,21.3,32.5,21,32.5z"/>
-		<path d="M20.5,28.1c-0.9-3-1.4-5.6-1.4-7.8V18c0.1-1.6,0.8-2.6,1.9-2.9c1.1,0.3,1.8,1.3,1.9,2.9v2.3c0,2.2-0.5,4.8-1.4,7.8H20.5z"
-			/>
-	</g>
-</g>
+<polygon class="st0" points="10.8,28.8 20,12.8 29.2,28.8 "/>
+<path class="st1" d="M20,9.6L8,30.4h24L20,9.6z M20,12.8l9.2,16H10.8L20,12.8z"/>
+<path d="M19,17.5v1.7l0.5,4.3h1l0.5-4.3v-1.7H19z"/>
+<circle cx="20" cy="26" r="1"/>
 </svg>
diff --git a/app/common/styles/base/colors.scss b/app/common/styles/base/colors.scss
index 514a631..780e319 100644
--- a/app/common/styles/base/colors.scss
+++ b/app/common/styles/base/colors.scss
@@ -4,7 +4,7 @@
 $darkgrey: #666;
 $medgrey: #d7dbe0;
 $lightgrey: #f5f7fa;
-$lightblue: #f0f2f5;
+$lightblue: #f1f2f6;
 $medblue: #3f71ec;
 $purple: #5A3EC8;
 $darkpurple: #20214f;
@@ -23,7 +23,7 @@
 $disabled-row-txt: #999999;
 
 //Forms
-$input-border: #505050;
+$input-border: #a7a7a7;
 
 // Light Background
 $lightbg__grey: #b8c1c1;
@@ -56,7 +56,7 @@
 // Severity
 $critical-lightbg: #e62325;
 $critical-darkbg: #ff5c49;
-$medium-lightbg: #dc267f;
+$severity-medium-lightbg: #dc267f;
 $medium-darkbg: #FF509E;
 $warning-lightbg: #ff836f;
 $warning-darkbg: #ffb000;
@@ -70,12 +70,12 @@
 
 //Inventory
 $active: #c6b6f5;
-$inactive: $medium-lightbg;
+$inactive: $severity-medium-lightbg;
 $present: #b1bef3;
-$not-present: $medium-lightbg;
+$not-present: $severity-medium-lightbg;
 
 // Links
-$links: #648FFF;
+$links: #3c6df0;
 $links__hover: $lightbg__primary;
 $links__visited: #8ea7ea;
 $links__disabled: rgba(27, 40, 52, 0.70);
diff --git a/app/common/styles/base/foundation.scss b/app/common/styles/base/foundation.scss
index 9c31f8f..36e18c2 100644
--- a/app/common/styles/base/foundation.scss
+++ b/app/common/styles/base/foundation.scss
@@ -814,7 +814,7 @@
     display: block !important; } }
 
 .row {
-  max-width: 60.38rem; //960px
+  max-width: 67.500rem; //1080px
   margin-right: auto;
   margin-left: auto; }
 .row::before, .row::after {
diff --git a/app/common/styles/base/icons.scss b/app/common/styles/base/icons.scss
index e499095..27fe0e1 100644
--- a/app/common/styles/base/icons.scss
+++ b/app/common/styles/base/icons.scss
@@ -52,6 +52,14 @@
   vertical-align: middle;
 }
 
+.icon__critical{
+  width: 30px;
+  height: 30px;
+  background-image: url(/assets/images/icon-critical.svg);
+  background-repeat: no-repeat;
+  vertical-align: middle;
+}
+
 .icon__info{
   margin-top: -4px;
   margin-right: .5em;
diff --git a/app/common/styles/base/utility.scss b/app/common/styles/base/utility.scss
index 33cf61a..d0c1e80 100644
--- a/app/common/styles/base/utility.scss
+++ b/app/common/styles/base/utility.scss
@@ -90,4 +90,18 @@
   width: 0;
   position: absolute;
   overflow: hidden;
+}
+
+.show-scroll {
+  // Force scrollbar to always be visible in webkit browsers
+  &::-webkit-scrollbar {
+    background-color: lighten($medgrey, 5%);
+    width: 8px;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    border-radius: 5px;
+    background-color: rgba(0,0,0,.5);
+    -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
+  }
 }
\ No newline at end of file
diff --git a/app/common/styles/components/table.scss b/app/common/styles/components/table.scss
index fb49d39..26490f6 100644
--- a/app/common/styles/components/table.scss
+++ b/app/common/styles/components/table.scss
@@ -104,4 +104,6 @@
   @include indeterminate-bar;
 }
 
+.sort-heading {
 
+}
diff --git a/app/common/styles/elements/accordion.scss b/app/common/styles/elements/accordion.scss
index 767f7f2..fcf0286 100644
--- a/app/common/styles/elements/accordion.scss
+++ b/app/common/styles/elements/accordion.scss
@@ -3,6 +3,7 @@
 
 .header__actions-bar {
   padding-top: 1em;
+  padding-bottom: 1em;
   padding-right: 1em;
   background: $darkpurple;
   color: $white;
@@ -14,6 +15,7 @@
       margin-right: -20px;
     }
   }
+  p {margin-bottom: 0;}
 }
 
 .accord-trigger {
@@ -29,7 +31,6 @@
   }
   &.active {
     transform: rotate(-90deg);
-    color: $darkbg__accent;
   }
   &:focus {
     outline: 0;
@@ -37,23 +38,15 @@
   }
 }
 
-// Single event log card
 .accord-row {
-  position: relative;
-  border: 1px solid $medgrey;
-  padding: 1em 1em 1em 0em;
-  margin: .65em 0;
-  background: $white;
   overflow: hidden;
-  &.active,
-  &.selected {
-    background: $lightblue;
+  .accord-content.inactive {
+    max-height: 0;
+    height: 0;
   }
-  &:hover {
-    background: $lightblue;
-    cursor: pointer;
-  }
-  &:last-child {
-    border-bottom: 1px solid $medgrey;
+  .accord-content.active {
+    height: auto;
+    max-height: 1000px;
+    @include fastTransition-all;
   }
 }
\ No newline at end of file
diff --git a/app/common/styles/elements/content-search.scss b/app/common/styles/elements/content-search.scss
index 3fa94f1..a8ae381 100644
--- a/app/common/styles/elements/content-search.scss
+++ b/app/common/styles/elements/content-search.scss
@@ -3,7 +3,6 @@
 
 .content__search {
   width: 100%;
-  max-width: 99%;
   display: inline-block;
   float: left;
   position: relative;
@@ -38,7 +37,7 @@
     width: 100px;
     top: .5em;
     right: 5px;
-    padding: 1em 2em;
+    padding: 1em 2em .9em;
     min-height: 20px;
     text-align: center;
     margin: 0;
diff --git a/app/common/styles/elements/tags.scss b/app/common/styles/elements/tags.scss
index 8a480c9..d2fff03 100644
--- a/app/common/styles/elements/tags.scss
+++ b/app/common/styles/elements/tags.scss
@@ -118,8 +118,8 @@
     }
   }
   &.medium-priority {
-    background: rgba($medium-lightbg, .5);
-    border-color: rgba($medium-lightbg, 1);
+    background: rgba($severity-medium-lightbg, .5);
+    border-color: rgba($severity-medium-lightbg, 1);
   }
   &.warn-priority {
     border-color: $warning-lightbg;
diff --git a/app/common/styles/layout/content.scss b/app/common/styles/layout/content.scss
index f91940c..326d896 100644
--- a/app/common/styles/layout/content.scss
+++ b/app/common/styles/layout/content.scss
@@ -8,6 +8,7 @@
   border-bottom: 1px solid $lightbg__grey;
   margin: 1.625em 0 1.2em 0;
   padding-left: 0;
+  overflow: hidden;
   .h4 {
     padding: 0;
     margin: 0 0 .5em 0;
@@ -43,7 +44,3 @@
   font-size: .75em;
   margin-bottom: 0;
 }
-
-.content__container h1 {
-  margin-left: -.3em;
-}
diff --git a/app/server-health/controllers/inventory-overview-controller.html b/app/server-health/controllers/inventory-overview-controller.html
index aae71b4..960a2d9 100644
--- a/app/server-health/controllers/inventory-overview-controller.html
+++ b/app/server-health/controllers/inventory-overview-controller.html
@@ -1,101 +1,373 @@
-<div id="inventory-overview">
-    <div class="row column">
-        <h1>Hardware inventory</h1>
-    </div>
-    <section class="row column">
-        <div class="page-header">
-            <h2 class="inline h4">Inventory items present in the system</h2>
-            <button class="inline btn-export float-right">Export</button>
-        </div>
-    </section>
-    <section class="row column">
-        <!-- search -->
-        <div class="content__search">
-            <label for="content__search-input">Search</label> <input id="content__search-input" type="text"
-                                                                     placeholder="Filter hardware components"/> <input
-                id="content__search-submit" type="submit" class="btn btn-secondary"
-                value="Submit"/>
-        </div>
-        <!--<div class="toggle-filter">-->
-            <!--<button class="inline first" ng-click="toggleall = !toggleall"-->
-                    <!--ng-class="toggleall ? 'btn-primary' : 'btn-secondary'">All-->
-            <!--</button>-->
-            <!--<button class="inline " ng-click="togglehigh = !togglehigh"-->
-                    <!--ng-class="togglehigh ? 'btn-primary' : 'btn-secondary'">High-->
-            <!--</button>-->
-            <!--<button class="inline" ng-click="togglemed = !togglemed"-->
-                    <!--ng-class="togglemed ? 'btn-primary' : 'btn-secondary'">Medium-->
-            <!--</button>-->
-            <!--<button class="inline last" ng-click="togglelow = !togglelow"-->
-                    <!--ng-class="togglelow ? 'btn-primary' : 'btn-secondary'">Low-->
-            <!--</button>-->
-        <!--</div>-->
-    </section>
-    <!-- end search -->
-    <section id="inventory-categories" class="row column">
-        <div class="row column header-row">
-            <div class="column large-12 header__actions-bar">
-                <p class="inline inventory__heading inventory__device-col">Hardware</p>
-                <p class="inline inventory__heading inventory__function-col">Function</p>
-                <p class="inline inventory__heading inventory__present-col">Present</p>
-                <p class="inline inventory__heading inventory__state-col">State</p>
-            </div>
-        </div>
-        <a class="inventory__group" href="">
-            <p class="inline inventory__device-col">All devices (30)</p>
-        </a>
-        <a class="inventory__group" href="">
-            <p class="inline inventory__device-col"><span class="inline priority-tag-circ normal-priority" aria-label="Normal Priority"></span>Motherboard (1)</p>
-            <p class="inline inventory__function-col inv-active">Active</p>
-            <p class="inline inventory__present-col inv-present">Present</p>
-            <p class="inline inventory__state-col">&nbsp;</p>
-        </a>
-        <a class="inventory__group" href="">
-            <p class="inline inventory__device-col"><span class="inline priority-tag-circ normal-priority" aria-label="Normal Priority"></span>CPU (1)</p>
-            <p class="inline inventory__function-col inv-active">Active</p>
-            <p class="inline inventory__present-col inv-present">Present</p>
-            <p class="inline inventory__state-col">&nbsp;</p>
-        </a>
-        <a class="inventory__group" href="#/server-health/inventory">
-            <p class="inline inventory__device-col"><span class="inline priority-tag-circ high-priority" aria-label="High Priority"></span>CPU cores (6)</p>
-            <p class="inline inventory__function-col inv-active">Active</p>
-            <p class="inline inventory__present-col inv-present">Present</p>
-            <p class="inline inventory__state-col inventory__critical-label">High - Emergency</p>
-        </a>
-        <a class="inventory__group" href="">
-            <p class="inline inventory__device-col"><span class="inline priority-tag-circ normal-priority" aria-label="Normal Priority"></span>DIMM (4)</p>
-            <p class="inline inventory__function-col inv-active">Active</p>
-            <p class="inline inventory__present-col inv-present">Present</p>
-            <p class="inline inventory__state-col">&nbsp;</p>
-        </a>
-        <a class="inventory__group" href="">
-            <p class="inline inventory__device-col"><span class="inline priority-tag-circ warn-priority" aria-label="Warning Priority"></span>Fan (5)</p>
-            <p class="inline inventory__function-col inv-active">Active</p>
-            <p class="inline inventory__present-col inv-present">Present</p>
-            <p class="inline inventory__state-col inventory__warning-label">Medium - Warning</p>
-        </a>
-        <a class="inventory__group" href="">
-            <p class="inline inventory__device-col"><span class="inline priority-tag-circ normal-priority"></span>Chasis (3)</p>
-            <p class="inline inventory__function-col inv-active">Active</p>
-            <p class="inline inventory__present-col inv-present">Present</p>
-            <p class="inline inventory__state-col">&nbsp;</p>
-        </a>
-        <a class="inventory__group" href="">
-            <p class="inline inventory__device-col"><span class="inline priority-tag-circ normal-priority" aria-label="Normal Priority"></span>BMC (5)</p>
-            <p class="inline inventory__function-col inv-active">Active</p>
-            <p class="inline inventory__present-col inv-present">Present</p>
-            <p class="inline inventory__state-col">&nbsp;</p>
-        </a>
-        <a class="inventory__group" href="">
-            <p class="inline inventory__device-col"><span class="inline priority-tag-circ medium-priority " aria-label="MediumPriority"></span>MISC (5)</p>
-            <p class="inline inventory__function-col inv-inactive">Inactive</p>
-            <p class="inline inventory__present-col inv-present">Present</p>
-            <p class="inline inventory__state-col inventory__medium-label">Medium - Error</p>
-        </a>
-        <a class="inventory__group inv-disabled">
-            <p class="inline inventory__device-col"><span class="inline priority-tag-circ disabled" aria-label="Low Priority"></span>PCIE card (0)</p>
-            <p class="inline inventory__function-col inv-inactive">Inactive</p>
-            <p class="inline inventory__present-col inv-not-present">Not Present</p>
-        </a>
-    </section>
+<div class="inventory-overview">
+	<div class="row column no-padding">
+		<h1>Hardware status</h1>
+		<div class="page-header">
+			<button class="inline btn-export float-right">Export</button>
+		</div>
+	</div>
+	<section class="row column">
+		<!-- search -->
+		<div class="content__search">
+			<label for="content__search-input">Search</label> <input id="content__search-input" type="text"
+				placeholder="Filter hardware components"/>
+			<input id="content__search-submit" type="submit" class="btn btn-primary" value="Filter"/>
+		</div>
+
+	</section>
+	<!-- end search -->
+	<section id="inventory-categories" class="row column">
+		<div class="row column header-row">
+			<div class="column large-12 header__actions-bar">
+				<div class="inline inventory__heading inventory__device-col">Hardware</div>
+				<div class="inline inventory__heading inventory__function-col">&nbsp;</div>
+				<div class="inline inventory__heading inventory__assoc-event sort-heading sort-down">Associated events</div>
+			</div>
+		</div>
+		<!-- hardware item -->
+		<div class="inventory__group" ng-class="{'active': inv.meta}" ng-click="inv.meta = ! inv.meta">
+			<p class="inline inventory__device-col">System</p>
+			<p class="inline inventory__function-col"></p>
+			<p class="inline inventory__assoc-event"></p>
+			<button class="accord-trigger float-right" ng-class="{'active': inv.meta}" ng-click="inv.meta = ! inv.meta"></button>
+			<div class="row inventory__metadata" ng-class="{'active': inv.meta}">
+				<div class="column large-9 no-padding">
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Name</p>
+						<p class="courier-bold">System</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Serial Number</p>
+						<p class="courier-bold">2230123ab-04</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Part Number</p>
+						<p class="courier-bold">12355123ab</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Manufacturer</p>
+						<p class="courier-bold">IBM</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Version</p>
+						<p class="courier-bold">10</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Functional</p>
+						<p class="courier-bold">Yes</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Field replaceable</p>
+						<p class="courier-bold">Not replaceable</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Higher level FRU</p>
+						<p class="courier-bold">Motherboard</p>
+					</div>
+				</div>
+				<div class="column large-3">
+
+				</div>
+			</div>
+		</div>
+
+		<!-- hardware item -->
+		<div class="inventory__group">
+			<p class="inline inventory__device-col">Chassis</p>
+			<p class="inline inventory__function-col"></p>
+			<p class="inline inventory__assoc-event"></p>
+			<button class="accord-trigger float-right"></button>
+			<div class="row inventory__metadata">
+				<div class="column large-9 no-padding">
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Name</p>
+						<p class="courier-bold">Processor module</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Serial Number</p>
+						<p class="courier-bold">2230123ab-04</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Part Number</p>
+						<p class="courier-bold">12355123ab</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Manufacturer</p>
+						<p class="courier-bold">IBM</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Version</p>
+						<p class="courier-bold">10</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Functional</p>
+						<p class="courier-bold">Yes</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Field replaceable</p>
+						<p class="courier-bold">Not replaceable</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Higher level FRU</p>
+						<p class="courier-bold">Motherboard</p>
+					</div>
+				</div>
+				<div class="column large-3 no-padding">
+				</div>
+			</div>
+		</div>
+		<!-- hardware item -->
+		<div class="inventory__group ">
+			<p class="inline inventory__device-col">Motherboard</p>
+			<p class="inline inventory__function-col"></p>
+			<p class="inline inventory__assoc-event"></p>
+			<button class="accord-trigger float-right"></button>
+			<div class="row inventory__metadata ">
+				<div class="column large-9 no-padding">
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Name</p>
+						<p class="courier-bold">Processor module</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Serial Number</p>
+						<p class="courier-bold">2230123ab-04</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Part Number</p>
+						<p class="courier-bold">12355123ab</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Manufacturer</p>
+						<p class="courier-bold">IBM</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Version</p>
+						<p class="courier-bold">10</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Functional</p>
+						<p class="courier-bold">Yes</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Field replaceable</p>
+						<p class="courier-bold">Not replaceable</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Higher level FRU</p>
+						<p class="courier-bold">Motherboard</p>
+					</div>
+				</div>
+				<div class="column large-3 no-padding">
+
+				</div>
+			</div>
+		</div>
+		<!-- hardware item w/ sub categories -->
+		<div class="inventory__group"  ng-class="{'active': inv2.meta}" ng-click="inv2.meta = ! inv2.meta">
+			<p class="inline inventory__device-col">CPU 0</p>
+			<p class="inline inventory__function-col"></p>
+			<p class="inline inventory__assoc-event"><a href="#/server-health/event-log">View 3 events</a></p>
+			<button class="accord-trigger float-right" ng-class="{'active': inv2.meta}" ng-click="inv2.meta = ! inv2.meta"></button>
+			<div class="row inventory__metadata" ng-class="{'active': inv2.meta}">
+				<div class="column large-9 no-padding">
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Name</p>
+						<p class="courier-bold">Processor module</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Serial Number</p>
+						<p class="courier-bold">2230123ab-04</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Part Number</p>
+						<p class="courier-bold">12355123ab</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Manufacturer</p>
+						<p class="courier-bold">IBM</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Version</p>
+						<p class="courier-bold">10</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Functional</p>
+						<p class="courier-bold">Yes</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Field replaceable</p>
+						<p class="courier-bold">Not replaceable</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Higher level FRU</p>
+						<p class="courier-bold">Motherboard</p>
+					</div>
+				</div>
+				<div class="column large-3 no-padding">
+					<div class="inventory__metadata-scroll show-scroll"> <!-- If content overflows; add 'show-scroll' class via JS to force visible scrollbar in webkit browsers-->
+						<div class="content-label">Subcomponents</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 0</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold"><span class="icon icon__warning"></span>Core 1</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 2</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 3</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 4</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 5</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 6</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 7</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 8</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 9</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 10</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 11</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 12</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 13</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 14</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 15</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 16</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 17</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 18</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 19</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 20</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 21</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 22</p>
+						</div>
+						<div class="inline inventory__metadata-block">
+							<p class="courier-bold">Core 23</p>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+		<!-- hardware item -->
+		<div class="inventory__group ">
+			<p class="inline inventory__device-col">Ethernet</p>
+			<p class="inline inventory__function-col">Inactive</p>
+			<p class="inline inventory__assoc-event"><a href="#/server-health/event-log">View 1 event</a></p>
+			<button class="accord-trigger float-right"></button>
+			<div class="row inventory__metadata ">
+				<div class="column large-9 no-padding">
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Name</p>
+						<p class="courier-bold">Processor module</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Serial Number</p>
+						<p class="courier-bold">2230123ab-04</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Part Number</p>
+						<p class="courier-bold">12355123ab</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Manufacturer</p>
+						<p class="courier-bold">IBM</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Version</p>
+						<p class="courier-bold">10</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Functional</p>
+						<p class="courier-bold">Yes</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Field replaceable</p>
+						<p class="courier-bold">Not replaceable</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Higher level FRU</p>
+						<p class="courier-bold">Motherboard</p>
+					</div>
+				</div>
+				<div class="column large-3 no-padding"></div>
+			</div>
+		</div>
+		<!-- hardware item no sub items -->
+		<div class="inventory__group inv-disabled">
+			<p class="inline inventory__device-col">DIMM 0</p>
+			<p class="inline inventory__function-col">Not present</p>
+			<p class="inline inventory__assoc-event"></p>
+			<button class="accord-trigger float-right"></button>
+			<div class="row inventory__metadata ">
+				<div class="column large-9 no-padding">
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Name</p>
+						<p class="courier-bold">Processor module</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Serial Number</p>
+						<p class="courier-bold">2230123ab-04</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Part Number</p>
+						<p class="courier-bold">12355123ab</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Manufacturer</p>
+						<p class="courier-bold">IBM</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Version</p>
+						<p class="courier-bold">10</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Functional</p>
+						<p class="courier-bold">Yes</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Field replaceable</p>
+						<p class="courier-bold">Not replaceable</p>
+					</div>
+					<div class="inline inventory__metadata-block">
+						<p class="content-label">Higher level FRU</p>
+						<p class="courier-bold">Motherboard</p>
+					</div>
+				</div>
+				<div class="column large-3 no-padding"></div>
+			</div>
+		</div>
+	</section>
 </div>
\ No newline at end of file
diff --git a/app/server-health/styles/inventory.scss b/app/server-health/styles/inventory.scss
index 307245f..ecb3a8a 100644
--- a/app/server-health/styles/inventory.scss
+++ b/app/server-health/styles/inventory.scss
@@ -8,67 +8,34 @@
 
 .inventory__heading {
   font-weight: 700;
+  padding: 1em 0;
 }
 
-.inv-active {
-  color: $active;
-}
-
-.inv-inactive {
-  color: $inactive;
-}
-
-.inv-present {
-  color: $present;
-}
-.inv-not-present {
-  color: $not-present;
-}
-
-.inventory__critical-label {
-  color: $thresh-critical;
-}
-
-.inventory__warning-label {
-  color: $thresh-warning;
-}
-
-.inventory__medium-label {
-  color: $medium-lightbg;
-}
-
-.inventory__low-label {
-  color: $low-lightbg;
-}
-
-.col-3 {
-  @include calcColumn-3;
-}
-.col-4 {
-  min-width: 100%;
-  @include mediaQuery(medium) {
-    @include calcColumn-4(15px);
-  }
-}
 // Inventory Overview
-
-#inventory-overview {
+.inventory-overview {
   .inventory__group {
     position: relative;
     display: block;
-    margin: .5em 0;
+    margin: 0;
     font-weight: 700;
     background: $white;
-    padding: 1em 1em 0 3.7em;
+    padding: 1em 1em 0 1.5em;
     text-decoration: none;
-    border: 1px solid $lightgrey;
+    border-left: 1px solid $medgrey;
+    border-right: 1px solid $medgrey;
+    border-bottom: 0;
     vertical-align: middle;
+    @include fastTransition-all;
     &:hover {
       background: $lightblue;
       color: $black;
+      cursor: pointer;
     }
-    @include mediaQuery(x-large) {
-      //max-width: 60%;
+    &.active {
+      background: darken($lightgrey, 3%);
+      &:last-child {
+        border-bottom: 1px solid $medgrey;
+      }
     }
     .inv-active {
       color: darken($active, 20%);
@@ -77,29 +44,68 @@
       color: darken($present, 20%);
     }
     &.inv-disabled {
-      background: lighten($lightgrey, 5%);
-      .inventory__device-col {
+      background: $medgrey;
+      .inventory__device-col,
+      .inventory__function-col {
         color: lighten($darkgrey, 20%);
       }
+      .accord-trigger {
+        display: none;
+      }
+      &:hover,
+      .accord-trigger:hover {
+        cursor: default;
+      }
     }
-  }
-  .priority-tag-circ {
-    position: absolute;
-    top: 50%;
-    left: 1.2em;
-    transform: translateY(-50%);
+    .accord-trigger {
+      margin-top: -8px;
+    }
   }
 
   // Header row
   .header__actions-bar {
-    padding-left: 3.5em;
-    padding-right: 1em;
+    padding: 0 1em 0 1.5em;
+    .inventory__assoc-event {
+      padding-right: 1em;
+      &:hover {
+        cursor: pointer;
+      }
+    }
+  }
+
+  //sortable heading
+  .sort-heading {
+    position: relative;
+    color: $lightblue;
+    &::before {
+      content: '\025be';
+      position: absolute;
+      right: 0;
+      top: 8px;
+      transform: rotate(180deg);
+      font-size: 1.3em;
+    }
+    &::after {
+      content: '\025be';
+      position: absolute;
+      right: -1px;
+      bottom: 8px;
+      font-size: 1.3em;
+    }
+    &.sort-up {
+      &::before {
+        color: $darkbg__accent;
+      }
+    }
+    &.sort-down {
+      &::after {
+        color: $darkbg__accent;
+      }
+    }
   }
 }
-
-// Inventory single items
-
-#inventory, #inventory-overview {
+// Inventory items
+.inventory-overview {
   .inventory__device-col {
     margin-right: 6px;
     width: 50%;
@@ -107,229 +113,69 @@
       width: auto;
     }
   }
+
   .inventory__function-col {
-    @include col-label;
-    display: none;
-  }
-  .inventory__present-col {
-    @include col-label;
-    display: none;
-  }
-  .inventory__state-col {
-    @include col-label;
+      @include col-label;
+      color: $severity-medium-lightbg;
+      display: none;
   }
   .inventory__device-col,
-  .inventory__function-col,
-  .inventory__present-col,
-  .inventory__state-col {
+  .inventory__function-col {
     @media (min-width: 1025px){
       display: inline-block;
       @include calcColumn-4(5px);
     }
   }
 
-  .content__search {
-    max-width: 100%;
-    @media(min-width: 1300px) {
-      max-width: 50%;
-    }
-  }
-  .toggle-filter {
-    display: inline-block;
-    margin-right: 0;
-  }
-}
-
-.back-link {
-  margin: 1em 0 1em;
-  a {
-    text-decoration: none;
-    position: relative;
-    display: inline-block;
-    padding-left: 1.2em;
-    font-weight: 700;
-    &:before {
-      content: '\221F';
-      position: absolute;
-      top: 50%;
-      left: 0;
-      transform: translateY(-53%) rotate(45deg);
-      display: inline-block;
-      margin-right: 6px;
-      font-size: 1.1em;
-      font-weight: bold;
-      text-shadow: 0 0 1px black;
-    }
-    &:hover {
-      text-decoration: underline;
-    }
-  }
-}
-
-#inventory__details {
-  display: block;
-  margin-top: .6em;
-  position: relative;
-  overflow: hidden;
-
-  .header__actions-bar {
-    position: relative;
-
-    .priority-tag-circ {
-      position: absolute;
-      left: 1.2em;
-      top: 50%;
-      transform: translateY(-50%);
-      &.high-priority {
-        background-color: rgba($critical-darkbg, .3);
-      }
-    }
-    .inventory__category {
-      margin: 0;
-      color: $white;
-      min-width: $title-minWidth;
-    }
-  }
-  .accord-row {padding-left: 3.7em;}
-  .header-row {
-    background: $darkpurple;
-    padding-top: 1.5em;
-    padding-bottom: 0;
-    .inv-active {
-      color: $active;
-    }
-
-    .inv-inactive {
-      color: $inactive;
-    }
-
-    .inv-present {
-      color: $present;
-    }
-    .inv-not-present {
-      color: $not-present;
-    }
-
-    .inventory__critical-label {
-      color: lighten($thresh-critical, 15%);
-    }
-
-    .inventory__warning-label {
-      color: $thresh-warning;
-    }
-
-    .inventory__medium-label {
-      color: $medium-lightbg;
-    }
-
-    .inventory__low-label {
-      color: lighten($low-lightbg, 20%);
-    }
-  }
-
-  //Export log
-  .btn-export {
-    text-transform: capitalize;
-    color: $black;
-    font-size: .9em;
-    font-weight: 700;
-    position: relative;
-    padding: 0 0 1em 2em;
-    &:hover {
-      text-decoration: underline;
-    }
-  }
-  .btn-export {
-    margin-top: 7px;
-  }
-  .btn-export:before {
-    content: '\21E5';
-    position: absolute;
-    font-size: 1.7em;
-    vertical-align: middle;
-    transform: rotate(90deg);
-    display: inline-block;
-    left: 2px;
-    top: -5px;
-  }
-
-  .accord-row {
-    padding-top: 1.6em;
-    .priority-tag-circ {
-      position: absolute;
-      top: 28px;
-      left: 1.2em;
-    }
-  }
-
-  .accord-trigger {
-    position: absolute;
-    top: 20px;
-    right: 1em;
-  }
-  //Sensor info
-  .inventory__title {
-    font-weight: 700;
-    font-size: 1.1em;
-    min-width: $title-minWidth;
-    max-width: 78%;
-    vertical-align: top;
-  }
-  .inventory__description {
-    font-weight: 400;
-  }
-
-  .inventory__reading {
-    @include fontCourierBold;
-    font-size: 1.2em;
-    color: $black;
-    //max-width: 18%;
-  }
-
-  // Sensor metadata row
-  .inventory__metadata-row {
+  .inventory__metadata {
+    height: 0;
     max-height: 0;
+    margin: 0 -1em 0 -1.5em;
+    border-top: 1px solid $medgrey;
+    position: relative;
     overflow: hidden;
-    -webkit-transition: 0.5s linear max-height;
-    transition: 0.5s linear max-height;
-    padding: 0;
-    .content-label {
-      margin-top: 1em;
-    }
+    @include fastTransition-all;
     &.active {
-      max-height: 1000px; //max-height used to allow flexible height of content and still allow transition
+      height: 100%;
+      max-height: 1000px;
+      border-bottom: 1px solid $medgrey;
+      background: $lightgrey;
+      padding-bottom: 1em;
       @include fastTransition-all;
     }
   }
-  .inv-event-log-row {
-    border-top: 2px solid $lightgrey;
-    margin-right: 3.7em;
-    margin-left: 0;
-    padding-top: .8em;
-    word-break: break-word;
-    :first-child,
-    :last-child {
-      font-size: .9em;
-      font-weight: 600;
-      text-transform: uppercase;
-      text-decoration: none;
-      padding-bottom: .7em;
-      padding-top: .7em;
-      @include mediaQuery(small) {
-        padding-bottom: 0;
-        padding-top: 0;
-      }
-    }
-    a:hover {
-      text-decoration: underline;
-    }
-    .column {
-      margin-bottom: 0;
+
+  .inventory__metadata-block {
+    min-width: 100%;
+    padding: .5em 1em .5em 1.5em;
+    @include mediaQuery(small) {
+      @include calcColumn-3;
     }
   }
-  .event__description {
+
+  .inventory__metadata-scroll {
+      position: relative;
+      height: 100%;
+      max-height: 200px;
+      overflow-y: scroll;
+      bottom: 0;
+      right:0;
+      width: 100%;
+      padding-top: 1em;
+      padding-left: 1.5em;
+      border-top: 1px solid $medgrey;
+    .inventory__metadata-block {
+      @include calcSplitColumn;
+      margin-bottom: .5em;
+      padding: 0;
+    }
     @include mediaQuery(medium) {
-      padding-left: 1.6em;
+      position: absolute;
+      border-left: 1px solid $medgrey;
+      border-top: 0;
+      max-height: 500px;
+      padding: .5em 1em;
+      width: 23%;
     }
   }
 }