diff --git a/dmp-frontend/src/app/ui/dataset/listing/listing-item/dataset-listing-item.component.html b/dmp-frontend/src/app/ui/dataset/listing/listing-item/dataset-listing-item.component.html
index 530d6c1e0..fa3c4ba87 100644
--- a/dmp-frontend/src/app/ui/dataset/listing/listing-item/dataset-listing-item.component.html
+++ b/dmp-frontend/src/app/ui/dataset/listing/listing-item/dataset-listing-item.component.html
@@ -1,9 +1,7 @@
 <div class="listing-item" (click)="itemClicked()">
-	<div class="col-auto">
+	<div class="col">
 		<mat-icon *ngIf="isDraft" class="draft-bookmark">bookmark</mat-icon>
 		<mat-icon *ngIf="!isDraft" class="finalized-bookmark">bookmark</mat-icon>
-	</div>
-	<div class="col">
 		<h4 *ngIf="isDraft"><span>DRAFT:</span> {{ dataset.label }}</h4>
 		<h4 *ngIf="!isDraft">{{ dataset.label }}</h4>
 		<p>{{ dataset.description }}</p>
diff --git a/dmp-frontend/src/app/ui/dataset/listing/listing-item/dataset-listing-item.component.scss b/dmp-frontend/src/app/ui/dataset/listing/listing-item/dataset-listing-item.component.scss
index e69de29bb..0beb62d2f 100644
--- a/dmp-frontend/src/app/ui/dataset/listing/listing-item/dataset-listing-item.component.scss
+++ b/dmp-frontend/src/app/ui/dataset/listing/listing-item/dataset-listing-item.component.scss
@@ -0,0 +1,4 @@
+h4 {
+	display: inline;
+	padding-left: 1em;
+}
diff --git a/dmp-frontend/src/app/ui/explore-dataset/explore-dataset-listing.component.scss b/dmp-frontend/src/app/ui/explore-dataset/explore-dataset-listing.component.scss
index a40f93bef..8cd5f2fd6 100644
--- a/dmp-frontend/src/app/ui/explore-dataset/explore-dataset-listing.component.scss
+++ b/dmp-frontend/src/app/ui/explore-dataset/explore-dataset-listing.component.scss
@@ -22,4 +22,4 @@ text-center {
 
 .explore-dmp-content {
 	padding: 30px 15px;
-}
\ No newline at end of file
+}
diff --git a/dmp-frontend/src/app/ui/explore-dataset/listing-item/explore-dataset-listing-item.component.scss b/dmp-frontend/src/app/ui/explore-dataset/listing-item/explore-dataset-listing-item.component.scss
index c2c6081ff..2dcbde42d 100644
--- a/dmp-frontend/src/app/ui/explore-dataset/listing-item/explore-dataset-listing-item.component.scss
+++ b/dmp-frontend/src/app/ui/explore-dataset/listing-item/explore-dataset-listing-item.component.scss
@@ -1,34 +1,40 @@
-.explore-dataset-info {
-  background-color: #f6f6f6;
-  padding: 8px 15px;
-}
+// .explore-dataset-info {
+//   background-color: #f6f6f6;
+//   padding: 8px 15px;
+// }
 
-.explore-dataset-info p {
-  margin-bottom: 0px;
-  color: rgb(37, 35, 140);
-  font-weight: 600;
-}
+// .explore-dataset-info p {
+//   margin-bottom: 0px;
+//   color: rgb(37, 35, 140);
+//   font-weight: 600;
+// }
 
-.template-name {
-  padding-left: 0px;
-  border: 1px solid rgb(218, 227, 243);
-  color: rgb(43, 104, 209);
-  background-color: rgb(236, 241, 249);
-  border-radius: 10em;
-  justify-content: center;
-  text-transform: uppercase;
-  display: flex;
-  width: 25em;
-  height: 1.8em;
-  margin-top: 15px;
-  font-size: 13px;
-  font-weight: 500;
-}
+// .template-name {
+//   padding-left: 0px;
+//   border: 1px solid rgb(218, 227, 243);
+//   color: rgb(43, 104, 209);
+//   background-color: rgb(236, 241, 249);
+//   border-radius: 10em;
+//   justify-content: center;
+//   text-transform: uppercase;
+//   display: flex;
+//   width: 25em;
+//   height: 1.8em;
+//   margin-top: 15px;
+//   font-size: 13px;
+//   font-weight: 500;
+// }
 
-.draft-bookmark {
-  color: #e7e6e6;
-}
+// .draft-bookmark {
+//   color: #e7e6e6;
+//   display: inline;
+// }
 
-.finalized-bookmark {
-  color: #92d050;
-}
+// .finalized-bookmark {
+//   color: #92d050;
+//   display: inline;
+// }
+
+// h4 {
+//   display: inline;
+// }
diff --git a/dmp-frontend/src/app/ui/explore-dmp/explore-dmp-listing.component.scss b/dmp-frontend/src/app/ui/explore-dmp/explore-dmp-listing.component.scss
index 593b91480..60084b86e 100644
--- a/dmp-frontend/src/app/ui/explore-dmp/explore-dmp-listing.component.scss
+++ b/dmp-frontend/src/app/ui/explore-dmp/explore-dmp-listing.component.scss
@@ -1,25 +1,60 @@
 text-center {
-	text-align: center
+  text-align: center;
 }
 
 .header-image {
-	background: url('/assets/images/public-dmps-bg.png') no-repeat;
-	background-size: cover;
-	margin-top: 70px;
-	min-height: 15em;
-	position: relative;
+  background: url("/assets/images/public-dmps-bg.png") no-repeat;
+  background-size: cover;
+  margin-top: 70px;
+  min-height: 15em;
+  position: relative;
 }
 
 .header-text-container {
-	background: rgba(255,255,255,0.7);
-	position: absolute;
-	bottom: 0px;
-	padding-left: 5em;
-	padding-right: 10em;
-	padding-top: 2em;
-	padding-bottom: 2em;
+  background: rgba(255, 255, 255, 0.7);
+  position: absolute;
+  bottom: 0px;
+  padding-left: 5em;
+  padding-right: 10em;
+  padding-top: 2em;
+  padding-bottom: 2em;
 }
 
 .explore-dmp-content {
-	padding: 30px 15px;
+  padding: 30px 15px;
+}
+
+::ng-deep .mat-paginator {
+  margin-top: 1em;
+}
+
+::ng-deep .mat-paginator-container {
+  flex-direction: row-reverse !important;
+  justify-content: space-between !important;
+  background-color: #f6f6f6;
+  height: 30px;
+  min-height: 30px !important;
+}
+
+::ng-deep .mat-paginator-page-size {
+  height: 43px;
+}
+
+::ng-deep .mat-icon-button {
+  height: 30px !important;
+  font-size: 12px !important;
+}
+
+::ng-deep .mat-paginator-range-label {
+  margin: 15px 32px 0 24px !important;
+}
+
+::ng-deep .mat-paginator-range-actions {
+  width: 55% !important;
+  min-height: 43px !important;
+  justify-content: space-between;
+}
+
+::ng-deep .mat-paginator-navigation-previous {
+  margin-left: auto !important;
 }
diff --git a/dmp-frontend/src/app/ui/explore-dmp/listing-item/explore-dmp-listing-item.component.html b/dmp-frontend/src/app/ui/explore-dmp/listing-item/explore-dmp-listing-item.component.html
index ce66de578..66094960f 100644
--- a/dmp-frontend/src/app/ui/explore-dmp/listing-item/explore-dmp-listing-item.component.html
+++ b/dmp-frontend/src/app/ui/explore-dmp/listing-item/explore-dmp-listing-item.component.html
@@ -1,4 +1,41 @@
-<div class="explore-dmp-listing-item row" (click)="itemClicked()">
+<div class="listing-item">
+	<div class="col" (click)="itemClicked()">
+		<div class="row">
+			<div class="col-12 gray-container container-header">
+				{{dmp.projectabbreviation}}
+			</div>
+		</div>
+		<div class="row">
+			<div class="col-12 about-item">
+				<mat-icon>lock</mat-icon>
+				<h4 class="title">{{dmp.label}}</h4>
+			</div>
+		</div>
+		<div class="row">
+			<div class="col-12">
+				<p class="mt-1 mb-2">{{dmp.description}}</p>
+			</div>
+		</div>
+		<div class="row">
+			<div class="col-12 about-item">
+				<mat-icon class="gray-icon pt-2">settings</mat-icon>
+				<h4 class="mt-2 ml-1 mr-3 p-1">OWNER</h4>
+
+				<mat-icon class="gray-icon pt-2">storage</mat-icon>
+				<h4 class="length mt-2 ml-1 mr-3 p-1">{{dmp.datasets.length}}</h4>
+
+				<mat-icon class="gray-icon pt-2">assignment</mat-icon>
+				<div *ngFor="let profile of dmp.associatedProfiles" class="pt-1">
+					<div class="chip ml-2 mr-2">{{profile.label}}</div>
+				</div>
+				<p>Published {{dmp.creationTime | date: "shortDate"}}</p>
+			</div>
+		</div>
+	</div>
+</div>
+
+
+<!-- <div class="explore-dmp-listing-item row" (click)="itemClicked()">
 	<div class="col-auto">
 		<mat-icon>lock</mat-icon>
 	</div>
@@ -32,4 +69,4 @@
 		<mat-icon>more_horiz</mat-icon>
 	</div>
 </div>
-<mat-divider *ngIf="showDivider"></mat-divider>
+<mat-divider *ngIf="showDivider"></mat-divider> -->
diff --git a/dmp-frontend/src/app/ui/explore-dmp/listing-item/explore-dmp-listing-item.component.scss b/dmp-frontend/src/app/ui/explore-dmp/listing-item/explore-dmp-listing-item.component.scss
index 15940c5de..241ffa1b7 100644
--- a/dmp-frontend/src/app/ui/explore-dmp/listing-item/explore-dmp-listing-item.component.scss
+++ b/dmp-frontend/src/app/ui/explore-dmp/listing-item/explore-dmp-listing-item.component.scss
@@ -1,38 +1,78 @@
-.explore-dmp-listing-item {
-	margin-top: 2em;
-	margin-bottom: 2em;
-	cursor: pointer;
-
-	.title {
-		color: black;
-	}
-
-	.project-title {
-		color: rgb(93, 125, 173);
-	}
-
-	.gray-icon {
-		color: rgb(191, 191, 191);
-	}
-
-	.explore-dmp-chip {
-		padding: 0.1em 1em;
-		border: 0.1em solid rgb(236, 241, 249);
-		border-radius: 10em;
-		background-color: rgb(236, 241, 249);
-		color: rgb(68, 114, 196);
-	}
-
-	.explore-dmp-squared-chip {
-		padding: 0.1em 1em;
-		border: 0.1em solid rgb(236, 241, 249);
-		border-radius: 0.5em;
-		background-color: rgb(246, 246, 246);
-		color: rgb(127, 127, 127);
-	}
-
-	mat-icon {
-		width: auto;
-		height: auto;
-	}
+.gray-container {
+  letter-spacing: 5px;
+  color: #aaaaaa;
 }
+
+.container-header {
+  display: flex;
+  align-items: baseline;
+  margin-top: 0px;
+  text-transform: uppercase;
+}
+
+.about-item {
+  display: flex;
+}
+
+.about-item .length {
+  color: rgb(70, 135, 240);
+}
+
+.about-item .title {
+  margin: 2px 10px;
+}
+
+.about-item p {
+  margin-left: auto;
+  margin-bottom: 0px;
+  padding-top: 7px;
+  color: #aaaaaa;
+}
+
+.draft-icon {
+  color: #aaaaaa;
+}
+
+.more-horiz {
+  font-size: 28px;
+  color: #aaaaaa;
+}
+
+// .explore-dmp-listing-item {
+// 	margin-top: 2em;
+// 	margin-bottom: 2em;
+// 	cursor: pointer;
+
+// 	.title {
+// 		color: black;
+// 	}
+
+// 	.project-title {
+// 		color: rgb(93, 125, 173);
+// 	}
+
+// 	.gray-icon {
+// 		color: rgb(191, 191, 191);
+// 	}
+
+// 	.explore-dmp-chip {
+// 		padding: 0.1em 1em;
+// 		border: 0.1em solid rgb(236, 241, 249);
+// 		border-radius: 10em;
+// 		background-color: rgb(236, 241, 249);
+// 		color: rgb(68, 114, 196);
+// 	}
+
+// 	.explore-dmp-squared-chip {
+// 		padding: 0.1em 1em;
+// 		border: 0.1em solid rgb(236, 241, 249);
+// 		border-radius: 0.5em;
+// 		background-color: rgb(246, 246, 246);
+// 		color: rgb(127, 127, 127);
+// 	}
+
+// 	mat-icon {
+// 		width: auto;
+// 		height: auto;
+// 	}
+// }
diff --git a/dmp-frontend/src/styles.scss b/dmp-frontend/src/styles.scss
index e8c203377..3475e12b9 100644
--- a/dmp-frontend/src/styles.scss
+++ b/dmp-frontend/src/styles.scss
@@ -121,11 +121,13 @@ $theme: mat-light-theme($primary, $accent);
   //   }
 
   .draft-bookmark {
-    color: #e7e6e6;
+	color: #e7e6e6;
+	display: inline;
   }
 
   .finalized-bookmark {
-    color: #92d050;
+	color: #92d050;
+	display: inline;
   }
 
   h4 span {