e0e60f7bd601259ccca165c3e5b05ce7b8f99028
[public/www-new.git] / pub / style / style.css
1 /* General style guidelines:\r
2     - All font-size at least 14px (recommended 16px)\r
3     - Line-height: 1.5 for paragraph body, 1.1 for header\r
4 */\r
5 \r
6 body {\r
7   color: black;\r
8   background-color: white;\r
9   font-family: Helvetica, Verdana, Arial, 'Liberation Sans', FreeSans, sans-serif;\r
10   font-size: 84%;  /* Enables font size scaling in MSIE */\r
11   margin: 0;\r
12   padding: 0;\r
13 }\r
14 \r
15 #container {\r
16   position: relative;\r
17   margin: 20px auto;\r
18   width: 900px;\r
19   text-align: left;\r
20 }\r
21 \r
22 /* # Header # */\r
23 .superHeader {\r
24   color: white;\r
25   background-color: rgb(100,135,220);\r
26   height: 1.6em;\r
27 }\r
28 \r
29 .superHeader img { vertical-align: bottom; }\r
30 \r
31 .superHeader a {\r
32   color: white;\r
33   background-color: transparent;\r
34   font-size: 91%;\r
35   margin: 0;\r
36   padding: 0 0.5ex 0 0.25ex;\r
37 }\r
38 \r
39 a { text-decoration: none; }\r
40 a:hover { text-decoration: underline; }\r
41 \r
42 .superHeader div {\r
43   position: absolute;\r
44   top: 0.40ex;\r
45 }\r
46 \r
47 .superHeader .left { left: 0.4em; }\r
48 .superHeader .right { right: 0.4em; }\r
49 \r
50 .midHeader {\r
51   color: rgb(39,78,144);\r
52   background-color: rgb(140,170,230);\r
53   background-color: #ff6d06;\r
54   border: solid 0 black;\r
55   border-width: 2px 0;\r
56 }\r
57 \r
58 .headerTitle {\r
59   color: black;\r
60   font-size: 233%;\r
61   font-weight: normal;\r
62   margin: 0 0 0 4mm;\r
63   padding: 0.25ex 0;\r
64 }\r
65 #headerSubTitle {\r
66   font-size: 50%;\r
67   font-style: italic;\r
68   margin-left: 1em;\r
69 }\r
70 \r
71 .headerTitle a { color: black; }\r
72 .headerTitle a:hover { text-decoration: none; }\r
73 \r
74 .subHeader {\r
75   display: none;\r
76   color: white;\r
77   background-color: rgb(0,51,153);\r
78   margin: 0;\r
79   padding: 1ex 1ex 1ex 1.5mm;\r
80 }\r
81 \r
82 .subHeader a {\r
83   color: white;\r
84   background-color: transparent;\r
85   font-weight: bold;\r
86   margin: 0;\r
87   padding: 0 0.75ex 0 0.5ex;\r
88 }  \r
89 \r
90 .superHeader .highlight, .subHeader .highlight {\r
91   color: rgb(253,160,91);\r
92   background-color: transparent;\r
93 }\r
94 \r
95 /* # Horiz-side # */\r
96 #horiz-side-bar {\r
97   width:100%;\r
98   float left;\r
99   clear: both;\r
100   border: 0;\r
101   margin: 0;\r
102   padding: 0;\r
103 }\r
104 \r
105 #horiz-side-bar ul {\r
106   margin: 0;\r
107   padding: 0.3em;\r
108   list-style-type: none;\r
109   list-style-image: none;\r
110   background: #eeeeee;\r
111   border: 0;\r
112 }\r
113 \r
114 #horiz-side-bar ul:nth-child(even) { \r
115   background-color: #dddddd;\r
116 }\r
117 \r
118 #horiz-side-bar li {\r
119   display: inline;\r
120   white-space: nowrap;\r
121   line-height: 1.6em;\r
122 }\r
123 \r
124 #horiz-side-bar li.thisPage a {\r
125   color: black!important;\r
126   font-weight: bold;\r
127 }\r
128 #horiz-side-bar ul li a {\r
129   margin: 0;\r
130   padding: 0.1em 1ex 0.1em 1ex;\r
131   color: #336699;\r
132   background-color: transparent;\r
133   text-decoration: none;\r
134   font-size: 1em;\r
135   border: 0;\r
136 }\r
137 \r
138 #horiz-side-bar ul li a:hover {\r
139   color: black;\r
140   text-decoration: none;\r
141   text-transform: none;\r
142 }\r
143 \r
144 \r
145 /* # Side # */\r
146 #side-bar {\r
147   width: 16em;\r
148   float: left;\r
149   clear: left;\r
150   border-right: 1px solid #ddd;\r
151 }\r
152 \r
153 #side-bar div {\r
154   border-bottom: 1px solid #ddd;\r
155 }\r
156 \r
157 .sideBarTitle {\r
158   font-weight: bold;\r
159   margin: 0 0 0.5em 2mm;\r
160   padding: 1em 0 0 0;\r
161 }\r
162 \r
163 #side-bar ul {\r
164   list-style-type: none;\r
165   list-style-position: outside;\r
166   margin: 0;\r
167   padding: 0 0 0.3em 0;\r
168 }\r
169 \r
170 li ul {\r
171   padding-left: 0.6em !important;\r
172 }\r
173 \r
174 #side-bar li {\r
175   margin: 0;\r
176 }\r
177 \r
178 #side-bar a {\r
179   color: rgb(0,102,204);\r
180   background-color: transparent;\r
181   margin: 0;\r
182   padding: 0.25em 1ex 0.25em 2mm;\r
183   display: block;\r
184   text-transform: capitalize;\r
185   font-weight: bold!important;\r
186   font-size: 102%;\r
187   border-left: white solid 0.2em;\r
188 }\r
189 \r
190 #side-bar li.thisPage a {\r
191   color: black!important;\r
192   background-color: white;\r
193   font-style:italic;\r
194 }\r
195 \r
196 #side-bar a:hover {\r
197   color: white;\r
198   background-color: rgb(100,135,220);\r
199   border-left: black solid 0.2em;\r
200   text-decoration: none;\r
201 }\r
202 \r
203 .sideBarText {\r
204   line-height: 1.5em;\r
205   margin: 0 0 1em 0;\r
206   padding: 0 1.5ex 0 2.5mm;\r
207   display: block;\r
208 }\r
209 \r
210 #side-bar .sideBarText a {\r
211   margin: 0;\r
212   padding: 0;\r
213   display: inline;\r
214 }\r
215 \r
216 #side-bar .sideBarText a:hover {\r
217   color: rgb(0,102,204);\r
218   background-color: transparent;\r
219   text-decoration: none;\r
220 }\r
221 \r
222 \r
223 /* # Main Copy # */\r
224 #main-copy {\r
225   padding: 0.5mm 5mm 5mm 5mm;\r
226   color: black;\r
227   background-color: transparent;\r
228   text-align: justify;\r
229   line-height: 1.5em;\r
230   word-wrap: break-word;\r
231 }\r
232 \r
233 .main-copy-side-bar {\r
234   max-width: 70em;\r
235   margin: 0em 0 0 16em;\r
236   padding: 0.5mm 5mm 5mm 5mm;\r
237   border-left: 1px solid #ddd;\r
238 }\r
239 \r
240 #bodyText {\r
241   margin: 0 0 0 15.5em;\r
242   padding: 2mm 5mm 2mm 5mm;\r
243 }\r
244 \r
245 #main-copy p {\r
246   margin: 1em 1ex 1em 1ex !important; /* Need !important so troff-generated pages don't look totally squezed */\r
247   padding: 0;\r
248 }\r
249 \r
250 #main-copy a {\r
251   color: rgb(0,102,204);\r
252   background-color: transparent;\r
253 }\r
254 \r
255 #main-copy a:hover {\r
256   color:  rgb(100,135,220);\r
257 }\r
258 \r
259 #main-copy h1, #main-copy h2 {\r
260   color: rgb(0,102,204);\r
261   background-color: transparent;\r
262   font-size: 145.5%;\r
263   font-weight: bold;\r
264   margin: 2em 0 0 0;\r
265   padding: 0.5ex 0 0.5ex 0.6ex;\r
266   border-bottom: 2px solid rgb(0,102,204);\r
267 }\r
268 \r
269 #main-copy h2 {\r
270   font-size: 115.5%;\r
271   border-bottom: 1px solid rgb(0,102,204);\r
272 }\r
273 \r
274 #main-copy .topOfPage {\r
275   color: rgb(0,102,204);\r
276   background-color: transparent;\r
277   font-size: 91%;\r
278   font-weight: bold;\r
279   text-decoration: none;\r
280   margin: 3ex 1ex 0 0;\r
281   padding: 0;\r
282   float: right;\r
283 }\r
284 \r
285 dl {\r
286   margin: 1em 1ex 2em 1ex;\r
287   padding: 0;\r
288 }\r
289 \r
290 dt {\r
291   font-weight: bold;\r
292   margin: 0 0 0 0;\r
293   padding: 0;\r
294 }\r
295 \r
296 dd {\r
297   margin: 0 0 2em 2em;\r
298   padding: 0;\r
299 }\r
300 \r
301 \r
302 /* # Footer # */\r
303 #footer {\r
304   color: white;\r
305   background-color: rgb(100,135,220);\r
306   padding: 1em;\r
307   clear: both;\r
308 }\r
309 \r
310 #footer .left {\r
311   text-align: left;\r
312   line-height: 1.55em;\r
313   float: left;\r
314   clear: left;\r
315 }\r
316 \r
317 #footer .right {\r
318   text-align: right;\r
319   line-height: 1.45em;\r
320 }\r
321 \r
322 #footer a {\r
323   color: white;\r
324   background-color: transparent;\r
325 }\r
326 \r
327 \r
328 /* GENERAL */\r
329 \r
330 table {\r
331   border: solid 1px black;\r
332 }\r
333 th {\r
334   background-color: #abc;\r
335   border: solid 1px black;\r
336    text-align: center;\r
337 }\r
338 td {\r
339   background-color: #def;\r
340   border: solid 1px black;\r
341 }\r
342 \r
343 hr {\r
344   border-width: 0px 0px 0.1em 0px;\r
345   border-color: black;\r
346 }\r
347 \r
348 acronym, .titleTip {\r
349   border-bottom: 1px solid #ddd;\r
350   cursor: help;\r
351   margin: 0;\r
352   padding: 0 0 0.4px 0;\r
353 }\r
354 \r
355 pre {\r
356   margin-left: 2em; \r
357   font-size: 1.2em;\r
358 }\r
359 \r
360 blockquote {\r
361   border-left: 1px solid blue;\r
362   font-style: italic;\r
363 }\r
364 \r
365 .smallCaps {\r
366   font-size: 110%;\r
367   font-variant: small-caps;\r
368 }\r
369 \r
370 .doNotDisplay { display: none; }\r
371 \r
372 \r
373 .notify_errors,\r
374 .notify_notes,\r
375 .notify_success { padding: .8em; margin-bottom: 1em; border: 2px solid #ddd; }\r
376  \r
377 .notify_errors { background: #FBE3E4; color: #8a1f11; border-color: #FBC2C4; }\r
378 .notify_notes { background: #FFF6BF; color: #514721; border-color: #FFD324; }\r
379 .notify_success { background: #E6EFC2; color: #264409; border-color: #C6D880; }\r
380 .notify_errors a { color: #8a1f11; }\r
381 .notify_notes a { color: #514721; }\r
382 .notify_success a { color: #264409; }\r
383 \r
384 \r
385 /* # Page/Handler specific # */\r
386 h1.dir-list-head, ul.dir-list {\r
387   text-transform: capitalize;\r
388   font-weight: bold;\r
389 }\r
390 ul.sitemap-list a {\r
391   text-transform: capitalize;\r
392 }\r