1 files changed, 49 insertions, 4 deletions
diff --git a/animism-align/frontend/app/views/viewer/player/player.transcript.css b/animism-align/frontend/app/views/viewer/player/player.transcript.css
index 00ca675..8862587 100644
--- a/animism-align/frontend/app/views/viewer/player/player.transcript.css
+++ b/animism-align/frontend/app/views/viewer/player/player.transcript.css
@@ -8,12 +8,11 @@
 }
 
 .player-transcript .section_heading,
-.player-transcript .paragraph {
+.player-transcript .paragraph.intro_paragraph {
   font-family: "Freight Text", serif;
   font-size: 3rem;
   line-height: 1.28;
-  width: 70rem;
-  max-width: 80%;
+  width: 80%;
   margin: 0 auto;
   padding-bottom: 2rem;
 }
@@ -24,6 +23,17 @@
   margin-top: 8rem;
 }
 
+.player-transcript .paragraph {
+  font-family: "Freight Text", serif;
+  font-size: 1.2rem;
+  line-height: 1.5;
+  width: 45rem;
+  max-width: 80%;
+  margin: 0 auto;
+  padding-bottom: 1.2rem;
+}
+
+
 /* transcript scroll bar */
 
 .player-transcript::-webkit-scrollbar {
@@ -81,7 +91,7 @@
   cursor: pointer;
 }
 
-.player-transcript .paragraph .current {
+.player-transcript .intro_paragraph .current {
   box-shadow: -5px -1px 0 #e8e8e8,
                5px -1px 0 #e8e8e8,
               -5px  1px 0 #e8e8e8,
@@ -91,3 +101,38 @@
   color: #000;
   transition: all 0.2s;
 }
+.player-transcript .paragraph .current {
+  box-shadow: -1px -1px 0 #e8e8e8,
+               1px -1px 0 #e8e8e8,
+              -1px  1px 0 #e8e8e8,
+               1px  1px 0 #e8e8e8;
+  box-decoration-break: clone;
+  background: #e8e8e8;
+  color: #000;
+  transition: all 0.2s;
+}
+
+/* media */
+
+.player-transcript .media {
+  width: 100%;
+}
+.player-transcript .media.image img {
+  margin: 0 auto;
+  display: block;
+  max-width: 100vw;
+  max-height: 100vh;
+}
+.player-transcript .media.fullscreen .img {
+  width: 100vw;
+  height: 100vh;
+  background-size: cover;
+  background-position: center center;
+}
+.player-transcript .media .citation {
+  width: 45rem;
+  margin: 0 auto;
+  padding: 1rem 0;
+  font-family: "Neue Haas Unica";
+  color: #888;
+}