--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/poster/s62/screen.css	Mon Feb 15 10:51:57 2021 +0900
@@ -0,0 +1,85 @@
+@media screen {
+  .bespoke-parent {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  overflow: hidden;
+
+  background-color: #eee;
+
+  /*  font-size: 2em; */
+
+
+  /* text-align: center;  */
+  /* background-position: 50% 50%; -- check -- needed?? why? why not? just for animations? */
+}
+
+/* fix: h1 inside article gets display in normal text size on chrome */
+h1 { font-size: 180%; }
+
+
+.bespoke-slide {
+  box-sizing: border-box;
+  position: absolute;
+  width:  940px;
+  height: 480px;
+  top: 50%;
+  left: 50%;
+  margin-left: -470px;  /* calc((940px/2)*-1);  -($width / 2); */
+  margin-top:  -240px;  /* calc((480px/2)*-1);  -($height / 2); */
+  z-index: 1;
+
+  background-color: white;
+
+  border-radius: 4px;
+  box-shadow: 0 6px 2px -4px rgba(0,0,0,.2),
+              0 6px 2px -4px rgba(0,0,0,.14),
+              0 2px 10px 0 rgba(0,0,0,.12);
+
+  padding: 20px;
+
+  overflow: auto;
+}
+
+/* make scrollbar invisible, works for chrome
+    firefox too??? why? why not?
+ */
+::-webkit-scrollbar {
+  width: 0px;  /* remove scrollbar space */
+  background: transparent;  /* optional: just make scrollbar invisible */
+}
+
+
+
+.bespoke-active {
+}
+
+.bespoke-inactive {
+  opacity: 0;
+  pointer-events: none;
+}
+
+/****
+   add progress bar
+*****/
+
+.bespoke-progress-parent {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  height: .3vw;
+  z-index: 1;
+}
+
+.bespoke-progress-bar {
+  background-color: #0089f3;
+  position: absolute;
+  top: 0;
+  left: 0;
+  height: 100%;
+  transition: width 1s ease;
+}
+} /* @media screen */