git.scottworley.com Git - picsort/blob - picsorter.css

   1 @-webkit-keyframes fadeOut {
   2   from { opacity: 1; }
   3     to { opacity: 0; }
   4 }
   5 @keyframes fadeOut {
   6   from { opacity: 1; }
   7     to { opacity: 0; }
   8 }
   9
  10 img {
  11   -webkit-transform-origin: top left;
  12   -ms-transform-origin: top left;
  13   transform-origin: top left;
  14 }
  15
  16 .rot90 {
  17   filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
  18   -webkit-transform: rotate(90deg) translateY(-100%);;
  19   -moz-transform: rotate(90deg) translateY(-100%);;
  20   -o-transform: rotate(90deg) translateY(-100%);;
  21   rotation: 90deg translateY(-100%);;
  22 }
  23 .rot180 {
  24   filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
  25   -webkit-transform: rotate(180deg) translate(-100%,-100%);
  26   -moz-transform: rotate(180deg) translate(-100%,-100%);
  27   -o-transform: rotate(180deg) translate(-100%,-100%);
  28   rotation: 180deg translate(-100%,-100%);
  29 }
  30 .rot270 {
  31   filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
  32   -webkit-transform: rotate(270deg) translateX(-100%);
  33   -moz-transform: rotate(270deg) translateX(-100%);
  34   -o-transform: rotate(270deg) translateX(-100%);
  35   rotation: 270deg translateX(-100%);
  36 }
  37
  38 #message {
  39   position: fixed;
  40   font-size: 18pt;
  41   margin: 2em;
  42   border-radius: 10px;
  43   padding: .3em;
  44   color: white;
  45   font-weight: bold;
  46   font-family: sans-serif;
  47   background-color: rgba(200,200,200,0.5);
  48 }
  49
  50 .inputcontainer {
  51   position: fixed;
  52   width: 100%;
  53   height: 100%;
  54 }
  55 #name {
  56   display: block;
  57   margin-left: auto;
  58   margin-right: auto;
  59   font-size: 30pt;
  60 }
  61 #shell_out {
  62   display: none;
  63   width: 80%;
  64   height: 80%;
  65   margin: 5em;
  66   color: white;
  67   background-color: black;
  68   padding: 1em;
  69 }
  70
  71 .fade {
  72   opacity: 0;
  73   -webkit-animation-duration: 2s;
  74   -webkit-animation-name: fadeOut;
  75   animation-duration: 2s;
  76   animation-name: fadeOut;
  77 }
  78
  79 .fit_view {
  80   max-width: 100%;
  81   max-height: 100%;
  82 }