diff --git a/front/current/assets/styles/components/_project.scss b/front/current/assets/styles/components/_project.scss
index dedb30de6fa87cf7c39f5cc56787da948cb8925a..1c4f7214c34fcaee0becf254f077ce99ba7cbbb3 100644
--- a/front/current/assets/styles/components/_project.scss
+++ b/front/current/assets/styles/components/_project.scss
@@ -78,4 +78,14 @@ project {
       }
     }
   }
+
+  state {
+    display: block;
+    flex-basis: 300px;
+    border-top: 5px solid black;
+    padding: 10px;
+    h4 {
+      color: $light-gray;
+    }
+  }
 }
diff --git a/front/current/components/project/detail.component.html b/front/current/components/project/detail.component.html
index 6a44d20b5546cabc2eee46880a3655834b3e40c4..ab19723ead30d1aef9147c7f7a30d12b5a1acc26 100644
--- a/front/current/components/project/detail.component.html
+++ b/front/current/components/project/detail.component.html
@@ -36,3 +36,4 @@
   [(document_slots)]="document_slots"
   [(documents)]="documents"
   ></document-slots>
+  <state [state]=projectService.states[0]> </state>
diff --git a/front/current/components/project/detail.component.ts b/front/current/components/project/detail.component.ts
index 63500c4490910fe7385b6818f9e0cb1f68323d2c..954ee5db8993349d0de3c7d3217de3d21605bebe 100644
--- a/front/current/components/project/detail.component.ts
+++ b/front/current/components/project/detail.component.ts
@@ -15,12 +15,12 @@ import { DocumentService } from '../../services/document/document.service';
 import { AddressComponent } from './address.component';
 import { ContactsComponent } from './contacts.component';
 import { SlotsComponent } from './slots.component';
-
+import { StateComponent } from './state.component';
 
 @Component({
   selector: 'project',
   templateUrl: config.static_url + '/components/project/detail.component.html',
-  directives: [ROUTER_DIRECTIVES, AddressComponent, ContactsComponent, SlotsComponent]
+  directives: [ROUTER_DIRECTIVES, AddressComponent, ContactsComponent, SlotsComponent, StateComponent]
 })
 export class ProjectDetailComponent implements OnInit {
   constructor(
diff --git a/front/current/components/project/state.component.html b/front/current/components/project/state.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..deeec4150d60562fa910d4b1ea3f103332cd49f7
--- /dev/null
+++ b/front/current/components/project/state.component.html
@@ -0,0 +1,7 @@
+<h3> {{state.name}}</h3>
+<hr>
+<br>
+<h4> {{state.description}} </h4>
+<div>
+<!-- <h3> *Document Slots Will Go Here* </h3> -->
+</div>
diff --git a/front/current/components/project/state.component.ts b/front/current/components/project/state.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..179761e17b30419e623264d4d6432a5a058eaa49
--- /dev/null
+++ b/front/current/components/project/state.component.ts
@@ -0,0 +1,12 @@
+import { Component } from 'angular2/core';
+import { config } from '../../config';
+
+
+@Component({
+	selector: 'state',
+	templateUrl: config.static_url + '/components/project/state.component.html',
+	inputs: ['state']
+})
+export class StateComponent{
+	public state: any;
+};