Index: eprms-tap/src/main/resources/META-INF/assets/site-overrides.css
===================================================================
--- eprms-tap/src/main/resources/META-INF/assets/site-overrides.css	(revision c1069647428039e5d21e7da2c2251d6e29b1bdda)
+++ eprms-tap/src/main/resources/META-INF/assets/site-overrides.css	(revision 1a89760bcd50a9249abb1cd05c33544bdbf5f3c6)
@@ -114,2 +114,9 @@
 	position:relative !important;
 }
+
+.report .box {
+	background-color: var(--light);
+	color: var(--dark);
+	border-left: 1px solid;
+	padding: 0.5em;
+}
Index: eprms-tap/src/main/resources/info/ajanovski/eprms/tap/pages/user/MyProjectReports.tml
===================================================================
--- eprms-tap/src/main/resources/info/ajanovski/eprms/tap/pages/user/MyProjectReports.tml	(revision c1069647428039e5d21e7da2c2251d6e29b1bdda)
+++ eprms-tap/src/main/resources/info/ajanovski/eprms/tap/pages/user/MyProjectReports.tml	(revision 1a89760bcd50a9249abb1cd05c33544bdbf5f3c6)
@@ -55,39 +55,37 @@
 			t:value="activity">
 			<h3>${activity.title}</h3>
-			<div class="card mb-3 p-3 bg-light" t:type="loop"
-				t:source="workReportsForActivity" t:value="workReport">
-				<div class="d-flex">
-					<div class="mr-auto">
-						<h4>${message:report-label}</h4>
-					</div>
-					<div class="p-2">
-						<div t:type="unless" t:test="workReport.workEvaluations">
-							<a href="" class="btn btn-secondary" t:id="EditWorkReport"
-								t:type="eventlink" t:context="workReport"><svg
-									t:type="svgicon" t:path="edit" /> ${message:edit-label}</a> <a
-								href="" class="btn btn-danger" t:id="DeleteWorkReport"
-								t:type="eventlink" t:mixins="Confirm" t:context="workReport"><svg
-									t:type="svgicon" t:path="trash" /> ${message:remove-label}</a>
-						</div>
+			<div class="card mb-3 bg-light report" t:type="loop"
+					t:source="workReportsForActivity" t:value="workReport">
+				<div class="card-header p-2">
+					<h4>${message:report-label}: ${workReport.title}</h4>
+					<div t:type="unless" t:test="workReport.workEvaluations">
+						<a href="" class="pt-2 btn btn-secondary" t:id="EditWorkReport"
+							t:type="eventlink" t:context="workReport"><svg
+								t:type="svgicon" t:path="edit" /> ${message:edit-label}</a> <a
+							href="" class="btn btn-danger" t:id="DeleteWorkReport"
+							t:type="eventlink" t:mixins="Confirm" t:context="workReport"><svg
+								t:type="svgicon" t:path="trash" /> ${message:remove-label}</a>
 					</div>
 				</div>
-				<div t:type="beandisplay" t:object="workReport"
-					t:exclude="workReportId" t:add="person">
-					<p:person>${workReport?.person?.lastName}</p:person>
-					<p:description>
-						<t:outputraw t:value="workReport.description" />
-					</p:description>
-				</div>
-				<div class="card mb-3 p-3 bg-info text-white" t:type="loop"
-					t:source="workEvaluationsForWorkReport" t:value="workEvaluation">
-					<h5>${message:evaluation-label}</h5>
-					<div t:type="if" t:test="evaluationPublished">
-						<div t:type="beandisplay" t:object="workEvaluation"
-							t:exclude="workEvaluationId,status">
-							<p:description>
-								<t:outputRaw t:value="workEvaluation.description" />
-							</p:description>
+				<div class="card-body">
+					<div t:type="beandisplay" t:object="workReport"
+						t:exclude="workReportId,title" t:add="person">
+						<p:person>${workReport?.person?.lastName}</p:person>
+						<p:description>
+							<t:outputraw t:value="workReport.description" />
+						</p:description>
+					</div>
+					<div class="card mb-3 bg-info text-white" t:type="loop"
+						t:source="workEvaluationsForWorkReport" t:value="workEvaluation">
+						<div class="card-header p-2"><h5>${message:evaluation-label}: ${workEvaluation.title}</h5></div>
+						<div class="card-body p-2" t:type="if" t:test="evaluationPublished">
+							<div t:type="beandisplay" t:object="workEvaluation"
+								t:exclude="workEvaluationId,status,title">
+								<p:description>
+									<t:outputRaw t:value="workEvaluation.description" />
+								</p:description>
+							</div>
+							<p:else><div class="card-body bg-light text-dark p-2">${message:in-progress-label}</div></p:else>
 						</div>
-						<p:else>${message:in-progress-label}</p:else>
 					</div>
 				</div>