body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.header{width:100%;background-color:grey}.self,.title{display:inline-block;margin:10px 50px}.self{float:right}.container{position:relative;height:calc(100% - 60px)}.border{height:90%;width:80%;border:5px solid #000}.border,.content{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.content{height:100%;width:100%;background-color:snow;border:2px solid #000}.tabs{height:100%;width:25%;background-image:url(/single-page-app/static/media/paper.d9d25780.jpg);background-size:100% 100%}button{font-family:papyrus,fantasy;background:transparent;border:none;color:#fff;text-shadow:2px 2px #000;padding:10px;text-align:left;font-size:1.5rem;cursor:pointer}button:hover{text-shadow:2px 2px 4px #000,-2px 2px 4px #000,2px -2px 4px #000,-2px -2px 4px #000}.tabs button:not(:first-child){padding:10px 50px;font-size:1.2rem}.new-image,.new-text,.old-image,.old-text{position:absolute;border-left:2px solid grey}.old-image{top:0;left:25%;width:75%;height:50%}.new-image,.new-text,.old-text{top:50%;left:25%}.new-text,.old-text{background-image:url(/single-page-app/static/media/paper.d9d25780.jpg);background-size:100% 100%;padding:30px;width:calc(75% - 60px);height:calc(50% - 60px)}.new-image{width:75%;height:50%}.old-text{z-index:1}img{height:100%;width:100%}.ring{margin:0 auto;position:absolute;top:48.5%;width:20px;height:20px;border-top:4px solid #000;border-right:4px solid #000;border-top-right-radius:100%;-webkit-transform:rotate(45deg);transform:rotate(45deg);z-index:100}.hole-1,.hole-2{position:absolute;height:0;width:0;border:5px solid #000;border-radius:50%}.hole-1{top:-8px;left:-8px}.hole-2{bottom:-8px;right:-8px}.pageturner{-webkit-animation:pageTurner 1.5s linear;animation:pageTurner 1.5s linear;-webkit-transform-origin:top;transform-origin:top;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-backface-visibility:hidden;backface-visibility:hidden}@-webkit-keyframes pageTurner{0%{-webkit-transform:rotateX(0deg);transform:rotateX(0deg)}99%{opacity:1}to{-webkit-transform:rotateX(90deg);transform:rotateX(90deg);opacity:0}}@keyframes pageTurner{0%{-webkit-transform:rotateX(0deg);transform:rotateX(0deg)}99%{opacity:1}to{-webkit-transform:rotateX(90deg);transform:rotateX(90deg);opacity:0}}.new-image{opacity:0}.rotate{-webkit-transform:rotateY(180deg) rotate(180deg);transform:rotateY(180deg) rotate(180deg);-webkit-transform-origin:center;transform-origin:center;width:100%;height:100%}.pageturner2{opacity:0;-webkit-animation:pageTurner2 1.5s linear 1.5s;animation:pageTurner2 1.5s linear 1.5s;-webkit-transform:rotateX(90deg);transform:rotateX(90deg);-webkit-transform-origin:top;transform-origin:top;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}@-webkit-keyframes pageTurner2{0%{-webkit-transform:rotateX(90deg);transform:rotateX(90deg);opacity:0}1%{opacity:1}to{-webkit-transform:rotateX(180deg);transform:rotateX(180deg);opacity:1}}@keyframes pageTurner2{0%{-webkit-transform:rotateX(90deg);transform:rotateX(90deg);opacity:0}1%{opacity:1}to{-webkit-transform:rotateX(180deg);transform:rotateX(180deg);opacity:1}}#root,.app,body,html{margin:0;width:100%;height:100%;font-family:Papyrus,fantasy;font-size:1.5rem;text-shadow:2px 2px #000;color:#fff}
/*# sourceMappingURL=main.936a9a18.chunk.css.map */