1 files changed, 62 insertions, 1 deletions
diff --git a/animism-align/frontend/app/views/viewer/viewer.css b/animism-align/frontend/app/views/viewer/viewer.css
index 00cfa2b..fba83bc 100644
--- a/animism-align/frontend/app/views/viewer/viewer.css
+++ b/animism-align/frontend/app/views/viewer/viewer.css
@@ -1,3 +1,64 @@
 .viewer {
   background: #fff;
-}
-\ No newline at end of file
+  color: #000;
+}
+
+/* transcript */
+
+.transcript {
+  width: 100%;
+  height: calc(100% - 3.125rem);
+  overflow: scroll;
+  background: white;
+  color: black;
+  padding: 1rem;
+}
+
+/* general paragraph styles */
+
+.transcript .content {
+  font-family: 'Georgia', serif;
+  width: 100%;
+  padding-bottom: 6rem;
+  position: relative;
+}
+
+.transcript .content > div {
+  margin-bottom: 16px;
+}
+
+/* paragraph subtypes */
+
+.transcript .header {
+  font-size: 32px;
+}
+
+.transcript .paragraph,
+.transcript .hidden {
+  font-size: 16px;
+  line-height: 1.5;
+}
+
+.transcript .blockquote {
+  padding-left: 3rem;
+  line-height: 1.5;
+}
+
+/* sentences */
+
+.transcript span {
+  margin-right: 4px;
+}
+.transcript .media span {
+  margin-right: 0;
+}
+
+.transcript .paragraph .current {
+  box-shadow: -2px -3px 0 #fff,
+               2px -3px 0 #fff,
+              -2px  3px 0 #fff,
+               2px  3px 0 #fff;
+  box-decoration-break: clone;
+  background: black;
+  color: white;
+}