addHtmlFeaturesStyle.css
1    body { 
2      font-family: Arial, Helvetica, sans-serif; 
3    } 
4     
5    #interface { 
6      border: solid 5px orange; 
7      background-color: black; 
8      padding: 15px; 
9    } 
10    
11   table { 
12     border: solid; 
13     border-collapse: collapse; 
14     width: 100%; 
15   } 
16    
17   td { 
18     border-right: solid black; 
19     width: 50%; 
20     text-align: center; 
21     vertical-align: middle; 
22     background-color: black; 
23     height: 75px; 
24   } 
25    
26   h1 { 
27     text-align: center; 
28     font-family: "Lucida Console", Monaco, monospace; 
29     color: orange; 
30   } 
31    
32   h3 { 
33     color: black; 
34   } 
35    
36   #info { 
37     color: rgb(255, 248, 220); 
38     background-color: orange; 
39   } 
40    
41   .text { 
42     padding: 0 10px; 
43     background-color: cornsilk; 
44     color: slateblue; 
45   } 
46    
47   img { 
48     width: 100%; 
49   } 
50    
51   #imagewrapper 
52   { 
53     max-height: 300px; 
54     overflow-y: auto; 
55   } 
56    
57   #caption { 
58     color: silver; 
59     font-size: 0.9em; 
60     font-style: italic; 
61   } 
62    
63   #caption a { 
64     color: silver; 
65     font-size: 0.8em; 
66     font-style: normal; 
67   } 
68    
69   button { 
70     background-color: slateblue; 
71     color: white; 
72     padding: 15px; 
73   } 
74    
75   .keyButton { 
76     background-color: darkgreen; 
77     padding: 10px; 
78     font-size: 0.8em; 
79   } 
80    
81   .item { 
82     font-size: 1.1em; 
83   } 
84    
85   .inventory { 
86     border-radius: 15px; 
87     background-color: slateblue; 
88     color: white; 
89   } 
90    
91   #inventory { 
92     background-color: orange; 
93   } 
94    
95   #navigation { 
96     padding-bottom: 10px; 
97   } 
98    
99   #navigation button { 
100    background-color: slateblue; 
101    color: white; 
102    height: 80px; 
103    width: 80px; 
104    border-radius: 100%; 
105    font-size: 0.8em; 
106    vertical-align: top; 
107    padding: 0; 
108  } 
109   
110  #navigation .even { 
111    background-color: orange; 
112    color: black; 
113  } 
114   
115  #navigation #start, #navigation #replay { 
116    background-color: slateblue; 
117    font-size: 1.2em; 
118    height: 150px; 
119    width: 150px; 
120  } 
121   
122  #navigation #leave { 
123    background-color: orange; 
124    color: black; 
125    font-size: 0.8em; 
126    height: 70px; 
127    width: 70px; 
128    border-radius: 5px; 
129  } 
130   
131  #navigation #exit, #navigation #passcode { 
132    background-color: #2f2475; /* dark slateblue */ 
133    color: white; 
134    font-size: 1.2em; 
135    padding: 10px; 
136    width: 75%; 
137    border-radius: 0; 
138  } 
139   
140  #playerName { 
141    border: slateblue 15px outset; 
142    padding: 10px; 
143    background-color: #2f2475; /* dark slateblue */ 
144    color: orange; 
145    font-size: 1.1em; 
146    font-weight: bold; 
147    text-align: center; 
148  } 
149   
150  .hide { 
151    visibility: hidden; 
152  } 
153   
154  .show { 
155    visibility: visible; 
156  } 
157   
158  #navigation #backspace, #navigation #clear { 
159    color: cornsilk; 
160    background-color: darkred; 
161    width: 65px; 
162    height: 65px; 
163    padding: 15px; 
164    border-radius: 5px; 
165    font-size: 1.5em; 
166  } 
167   
168  #navigation #hintButton { 
169    color: #2f2475; 
170    background-color: orange; 
171    width: auto; 
172    height: auto; 
173    padding: 8px; 
174    border-radius: 15px; 
175    border-style: inset; 
176  } 
177