X-Git-Url: http://git.scottworley.com/picsort/blobdiff_plain/e18c13a6bea305ff31aec74c590c13551b4cc6a5..HEAD:/picsorter.css

diff --git a/picsorter.css b/picsorter.css
new file mode 100644
index 0000000..bad3b89
--- /dev/null
+++ b/picsorter.css
@@ -0,0 +1,82 @@
+@-webkit-keyframes fadeOut {
+  from { opacity: 1; }
+    to { opacity: 0; }
+}
+@keyframes fadeOut {
+  from { opacity: 1; }
+    to { opacity: 0; }
+}
+
+img {
+  -webkit-transform-origin: top left;
+  -ms-transform-origin: top left;
+  transform-origin: top left;
+}
+
+.rot90 {
+  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
+  -webkit-transform: rotate(90deg) translateY(-100%);;
+  -moz-transform: rotate(90deg) translateY(-100%);;
+  -o-transform: rotate(90deg) translateY(-100%);;
+  rotation: 90deg translateY(-100%);;
+}
+.rot180 {
+  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
+  -webkit-transform: rotate(180deg) translate(-100%,-100%);
+  -moz-transform: rotate(180deg) translate(-100%,-100%);
+  -o-transform: rotate(180deg) translate(-100%,-100%);
+  rotation: 180deg translate(-100%,-100%);
+}
+.rot270 {
+  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
+  -webkit-transform: rotate(270deg) translateX(-100%);
+  -moz-transform: rotate(270deg) translateX(-100%);
+  -o-transform: rotate(270deg) translateX(-100%);
+  rotation: 270deg translateX(-100%);
+}
+
+#message {
+  position: fixed;
+  font-size: 18pt;
+  margin: 2em;
+  border-radius: 10px;
+  padding: .3em;
+  color: white;
+  font-weight: bold;
+  font-family: sans-serif;
+  background-color: rgba(200,200,200,0.5);
+}
+
+.inputcontainer {
+  position: fixed;
+  width: 100%;
+  height: 100%;
+}
+#name {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+  font-size: 30pt;
+}
+#shell_out {
+  display: none;
+  width: 80%;
+  height: 80%;
+  margin: 5em;
+  color: white;
+  background-color: black;
+  padding: 1em;
+}
+
+.fade {
+  opacity: 0;
+  -webkit-animation-duration: 2s;
+  -webkit-animation-name: fadeOut;
+  animation-duration: 2s;
+  animation-name: fadeOut;
+}
+
+.fit_view {
+  max-width: 100%;
+  max-height: 100%;
+}