Completed the initial embed of mirador viewer.

src/app/item-page/mirador-viewer/mirador-viewer.component.scss

@@ -5,7 +5,7 @@
 }
 .full-text-op {
   text-align: right;
-  color: #999999;
+  color: #333333;
   font-size: 0.8em;
 }
 p.full-text-op {

src/app/item-page/simple/item-types/publication/publication.component.html

@@ -1,3 +1,12 @@
+<div class="row" *ngIf="iiifEnabled">
+  <div class="col-12">
+    <ds-mirador-viewer  id="iiif-viewer"
+                        [item]="object"
+                        [searchable]="iiifSearchEnabled"
+                        [query]="iiifQuery$ | async">
+    </ds-mirador-viewer>
+  </div>
+</div>
 <div class="d-flex flex-row">
   <h2 class="item-page-title-field mr-auto">
     {{'publication.page.titleprefix' | translate}}<ds-metadata-values [mdValues]="object?.allMetadata(['dc.title'])"></ds-metadata-values>
@@ -13,13 +22,6 @@
         <ds-thumbnail [thumbnail]="object?.thumbnail | async"></ds-thumbnail>
       </ds-metadata-field-wrapper>
     </ng-container>
-    <ng-container *ngIf="iiifEnabled">
-      <ds-mirador-viewer id="iiif-viewer"
-                         [item]="object"
-                         [searchable]="iiifSearchEnabled"
-                         [query]="iiifQuery$ | async">
-      </ds-mirador-viewer>
-    </ng-container>
     <ng-container *ngIf="mediaViewer.image">
       <ds-media-viewer [item]="object" [videoOptions]="mediaViewer.video"></ds-media-viewer>
     </ng-container>

src/app/item-page/simple/item-types/untyped-item/untyped-item.component.html

@@ -1,3 +1,12 @@
+<div class="row" *ngIf="iiifEnabled">
+  <div class="col-12">
+    <ds-mirador-viewer  id="iiif-viewer"
+                   [item]="object"
+                   [searchable]="iiifSearchEnabled"
+                   [query]="iiifQuery$ | async">
+    </ds-mirador-viewer>
+  </div>
+</div>
 <div class="d-flex flex-row">
   <h2 class="item-page-title-field mr-auto">
     <ds-metadata-values [mdValues]="object?.allMetadata(['dc.title'])"></ds-metadata-values>