test.css

   1
   2 @font-face {
   3     font-family: tengwar;
   4     src: url('custom-webfont.eot');
   5     src: url('custom-webfont.eot#iefix'),
   6          url('custom-webfont.woff') format('woff'),
   7          url('custom-webfont.ttf') format('truetype'),
   8          url('custom-webfont.svg#TengwarAnnatarItalic') format('svg');
   9     font-weight: normal;
  10     font-style: normal;
  11 }
  12
  13 .tengwar {
  14     font-family: tengwar;
  15     font-size: 30px;
  16 }
  17
  18 body {
  19     color: #ff0;
  20
  21     background-repeat: no-repeat;
  22     background: #fefcea; /* Old browsers */
  23     background: -moz-linear-gradient(top, #fefcea 0%, #f9e63b 7%, #e0a928 53%, #d69a2c 94%, #c97e16 99%); /* FF3.6+ */
  24     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fefcea), color-stop(7%,#f9e63b), color-stop(53%,#e0a928), color-stop(94%,#d69a2c), color-stop(99%,#c97e16)); /* Chrome,Safari4+ */
  25     background: -webkit-linear-gradient(top, #fefcea 0%,#f9e63b 7%,#e0a928 53%,#d69a2c 94%,#c97e16 99%); /* Chrome10+,Safari5.1+ */
  26     background: -o-linear-gradient(top, #fefcea 0%,#f9e63b 7%,#e0a928 53%,#d69a2c 94%,#c97e16 99%); /* Opera11.10+ */
  27     background: -ms-linear-gradient(top, #fefcea 0%,#f9e63b 7%,#e0a928 53%,#d69a2c 94%,#c97e16 99%); /* IE10+ */
  28     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefcea', endColorstr='#c97e16',GradientType=0 ); /* IE6-9 */
  29     background: linear-gradient(top, #fefcea 0%,#f9e63b 7%,#e0a928 53%,#d69a2c 94%,#c97e16 99%); /* W3C */
  30
  31 }
  32
  33 body, textarea {
  34     font-family: serif;
  35     font-size: 25px;
  36 }
  37
  38 textarea, .copy {
  39     font-family: monospace;
  40     color: black;
  41 }
  42
  43 a {
  44     color: #a00;
  45 }
  46
  47 a:visited {
  48     color: #c00;
  49 }
  50
  51 a:hover {
  52 }
  53
  54 a:focus {
  55 }
  56
  57 #annotation table {
  58     border-collapse: collapse;
  59     margin-right: 1em;
  60 }
  61
  62 #annotation td {
  63     border: solid 1px;
  64     width: 1em;
  65     text-align: left;
  66     font-size: 20px;
  67     padding: 2px;
  68     line-height: 100%;
  69     text-shadow: 0px 0px 10px #730 ;
  70     white-space: nowrap;
  71     font-family: monospace;
  72 }
  73
  74 #output {
  75     text-align: center;
  76     line-height: 150px;
  77     font-size: 60px;
  78     width: 100%;
  79     text-shadow: 0px 0px 10px #730 ;
  80 }
  81
  82 #output-box {
  83     margin-bottom: 10px;
  84     overflow: auto;
  85 }
  86
  87 #input {
  88     text-align: center;
  89     width: 100%;
  90 }
  91
  92 #about-box {
  93     position: absolute;
  94     bottom: 0;
  95     right: 0;
  96     padding-right: 1ex;
  97     padding-bottom: .5ex;
  98 }
  99
 100 #mode-box {
 101     position: absolute;
 102     bottom: 0;
 103     left: 0;
 104     padding-left: 1ex;
 105     padding-bottom: .5ex;
 106 }
 107
 108 .hbox {
 109     display: -webkit-box;
 110     display: -moz-box;
 111     display: box;
 112     -webkit-box-orient: horizontal;
 113     -moz-box-orient: horizontal;
 114     box-orient: horizontal;
 115     -webkit-box-align: baseline;
 116     -moz-box-align: baseline;
 117     box-align: baseline;
 118 }
 119 .vbox {
 120     display: -webkit-box;
 121     display: -moz-box;
 122     display: box;
 123     -webkit-box-orient: vertical;
 124     -moz-box-orient: vertical;
 125     box-orient: vertical;
 126 }
 127 .strut {
 128     -webkit-box-flex: 0;
 129     -moz-box-flex: 0;
 130     box-flex: 0;
 131 }
 132 .spring {
 133     -webkit-box-flex: 1;
 134     -moz-box-flex: 1;
 135     box-flex: 1;
 136 }
 137
 138 table {
 139     padding: 4ex;
 140 }
 141
 142 td {
 143     width: 4em;
 144 }
 145