]> projects.mako.cc - selectricity/blob - public/stylesheets/main.css
185b48ab96a0aefb19d092367ccf625730b3636c
[selectricity] / public / stylesheets / main.css
1 @charset "utf-8";
2 /* CSS Document */
3
4 /****************************************************************
5    Selectricity || selectricity.org
6    Design by Courtland Allen
7 *****************************************************************/
8
9 /* basics */
10  
11 body {
12         color: black;
13         background: white;
14         background: url(/images/bg_main.png) repeat-x top left;
15 }
16
17 h2 {
18         font-size: 24px !important;
19         margin: 0 0 1em 0 !important;
20 }
21
22 h3 {
23         font-size: 18px !important;
24         margin: 0 0 1em 0 !important;
25 }
26
27 .special {
28         background-color: #999999;
29         color: white;
30         text-align: center;
31         pading: 0 1em 0 1em;
32 }
33
34
35 /* Left column. Includes logo, poll information, and graph. */
36  
37 #left-side {
38         width: 270px;
39         float: left;
40         text-align: left;
41         margin-top: 33px;
42         font-size: 13px;
43 }
44
45 #left-side h1 {
46         height: 0px;
47         overflow: hidden;
48         padding-top: 189px;
49         background: url(/images/title_main.png) no-repeat top left;
50 }
51
52
53 #left-side-content {
54         color: #666666;
55         margin-top: 40px;
56         text-align: left;
57 }
58
59 #left-side-content p {
60         color: #666666;
61         padding-left: 2em;
62         margin: 2em 0 2em 0;
63 }
64
65 #left-side-content ol {
66         color: #666666;
67 }
68
69 /* #graph {
70         margin-top: 50px;
71         background: url(/images/graph.jpg) top left no-repeat;
72         height: 0px;
73         overflow: hidden;
74         padding-top: 243px;
75 } */
76
77
78
79 /* Right column. Includes top-bar and main-box. */
80
81 #right-side {
82         width: 611px;
83         margin-top: 0px;
84         float: right;
85 }
86  
87 #top-bar {
88         float: right;
89         margin-right: 50px;
90         width: 231px;
91         text-align: center;
92         margin-bottom: 35px;
93 }
94
95 #top-bar a {
96         color: #dddddd;
97         font-size: 11px;
98 }
99
100 div#bar-left {
101         background-image: url(/images/top_bar_1.png);
102         width: 153px;
103         height: 37px;
104         padding-top: 8px;
105         float: left;
106         clear: left;
107 }
108
109 div#bar-right {
110         background-image: url(/images/top_bar_2.png);
111         width: 78px;
112         height: 37px;
113         padding-top: 8px;
114         float: left;
115         clear: right;
116 }
117
118 .green { color: #10a700; }
119
120 .left-aligned h4 {
121         float: left;
122         padding-top: 26px;
123         height: 0px;
124         overflow: hidden;
125         background: no-repeat top left;
126 }
127
128 .right-aligned h4 {
129         float: right;
130         padding-top: 26px;
131         height: 0px;
132         overflow: hidden;
133         background: no-repeat top right;
134 }
135
136 .left-aligned { text-align: left; }
137
138 .right-aligned { text-align: right; }
139
140 h5 {
141         color: #5c5c5c;
142         background-color: #d6d6d6;
143         height: 21px;
144         font-size: 16px;
145         padding: 5px 15px 0 15px;
146         margin-bottom: .75em;
147         overflow: hidden;
148 }
149
150 #quickvote-title .header {
151         background-color: #74ce00;
152 }
153
154 #quickvote-title .subheader {
155         color: #74ce00;
156         background-color: #e5e5e5;
157 }
158
159 #controlroom-title .header {
160         background-color: #dc0d13;
161 }
162
163 #controlroom-title .subheader {
164         color: #dc0d13;
165         background-color: #e5e5e5;
166 }
167
168 #voters-title .header {
169         background-color: #005cd9;
170 }
171
172 #voters-title .subheader {
173         color: #005cd9;
174         background-color: #e5e5e5;
175 }
176
177 .header {
178         display: block;
179         font-family: "trebuchet ms",trebuchet,verdana,arial,sans-serif;
180         font-size:30px;
181         text-transform: uppercase;
182         text-align: center;
183         color: white;
184         background-color: #999999;
185         height: 32px;
186         float: left;
187         padding: 0px .75em 0px .75em;
188         margin-right: 10px;
189         margin-bottom: 14px;
190 }
191
192 .subheader {
193         display: block;
194         font-family: "trebuchet ms",trebuchet,verdana,arial,sans-serif;
195         font-size: 18px;
196         text-align: left;
197         color: #666666;
198         background-color: #CCCCCC;
199         height: 26px;
200         padding: 6px 1em 0px 20px;
201         margin-bottom: 14px;
202 }
203
204 #main-box {
205         float: right;
206         width: 611px;
207         padding: 0;
208         background: #f9f9f9;
209         border: 1px solid #b3b3b3;
210 }
211
212 #main-box h1 {
213   
214 }
215
216 #main-box p {
217         margin-bottom: 1.75em;
218         padding: 0 1.7em 0 1.7em;
219         line-height: 1.8em;
220         color: #454545;
221 }
222
223
224 #ErrorExplanation {
225   width: 400px;
226   border: 2px solid 'red';
227   padding: 7px;
228   padding-bottom: 12px;
229   margin-bottom: 20px;
230   background-color: #f0f0f0;
231 }
232
233 #ErrorExplanation h2 {
234   text-align: left;
235   font-weight: bold;
236   padding: 5px 5px 5px 15px;
237   font-size: 12px;
238   margin: -7px;
239   background-color: #c00;
240   color: #fff;
241 }
242
243 #ErrorExplanation p {
244   color: #333;
245   margin-bottom: 0;
246   padding: 5px;
247 }
248
249 #ErrorExplanation ul li {
250   font-size: 12px;
251   list-style: square;
252 }
253
254 .ListLine0 {
255         background:  #e0f8f8;
256         
257 }
258 .ListLine1 {
259         background: #cccccc;
260         
261 }
262
263 #notice { background: #FFFBB3; 
264                         text-align: left;
265                         font-weight: bold;
266                         border: 2px dotted 'red';
267                         margin-top: 10px;
268                         margin-left: 50px;
269                         padding: 5px 5px 5px 15px;
270                         width: 400px; }
271
272 #status {
273   width: 400px;
274   border: 1px solid #0000FF;
275   border-width: 1px;
276   padding: 7px;
277   padding-bottom: 12px;
278   margin-bottom: 20px;
279   background-color: #f0f0f0;
280 }
281
282 .fieldWithErrors {
283     display: inline;
284 }
285 .fieldWithErrors input, .fieldWithErrors select {
286     background-color: #ffdfdf;
287 }
288
289 #xxErrorExplanation h2 {
290   text-align: left;
291   font-weight: bold;
292   padding: 5px 5px 5px 15px;
293   font-size: 12px;
294   margin: -7px;
295   background-color: #c00;
296   color: #fff;
297 }
298
299 #xxErrorExplanation p {
300   color: #333;
301   margin-bottom: 0;
302   padding: 5px;
303 }
304
305 #xxErrorExplanation ul li {
306   font-size: 12px;
307   list-style: square;
308 }
309
310 .mainresultbox {
311   text-align: center;
312   width: 850px;
313   border-width: 2px;
314   border-style: solid;
315   border-color: #4D801A;
316   padding: 7px;
317   margin-right: 30px;
318   margin-bottom: 30px;
319 }
320
321 .mainresultbox h3 {
322   text-align: center;
323   font-weight: bold;
324   padding: 5px 5px 5px 15px;
325   margin: -7px;
326   background-color: #73BF26;
327   color: #fff;
328   border-bottom: 0px;
329 }
330
331 .resultbox {
332   text-align: center;
333   width: 400px;
334   float: left;
335   border-width: 2px;
336   border-style: solid;
337   border-color: #4D801A;
338   padding: 7px;
339   margin-right: 30px;
340   margin-bottom: 30px;
341 }
342
343 .resultbox h3 {
344   text-align: center;
345   font-weight: bold;
346   padding: 5px 5px 5px 15px;
347   margin: -7px;
348   background-color: #73BF26;
349   color: #fff;
350   border-bottom: 0px;
351 }
352 .clearbox {
353    clear: both;
354    margin: 30px;
355 }
356
357 li.moveable {
358   background-color: #E5FFCC;
359   border:1px solid #4D801A;
360   cursor: move;
361   padding: 4px;
362   margin: 4px;
363 }
364
365 #sortable_list {
366   font-size: 24pt;
367   display: float;
368   float: left;
369 }
370
371 .voterbox {
372   border-spacing: 0px;
373   border-width: 2px;
374   border-color: #4D801A;
375   border-style: solid;
376 }
377
378 .voterbox th {
379   border-width: 2px;
380   border-color: #73BF26;
381   border-style: solid;
382   text-align: center;
383   font-weight: bold;
384   padding: 5px 5px 5px 15px;
385   background-color: #73BF26;
386   color: #fff;
387 }
388
389 .voterbox td {
390   border-collapse: collapse;
391   border-width: 1px;
392   border-color: #4D801A;
393   border-style: solid;
394
395   text-align: right;
396   padding-right: 5px;
397   padding-left: 5px;
398 }
399
400 .rbmoreinfo hr {
401   width: 100%;
402   height: 10px;
403   color: #4D801A;
404 }
405 .rbmoreinfo h4 {
406   border: 0px;
407   font-style: italic;
408   text-align: center;
409   font-size: 0.9em;
410 }
411
412 .rbmoreinfo p {
413   font-size: 0.8em;
414   padding-left: 30px;
415   padding-right: 30px;
416   text-align: left;
417 }
418
419 .example {
420   width: 400px;
421   border-width: 2px;
422   border-style: solid;
423   border-color: #73BF26;
424   padding: 7px;
425   padding-bottom: 12px;
426   margin-bottom: 20px;
427   background-color: #f0f0f0;
428 }
429
430 .example h4 {
431   text-align: center;
432   font-weight: bold;
433   padding: 5px 5px 5px 15px;
434   font-size: 12px;
435   margin: -7px;
436   background-color: #73BF26;
437   color: #fff;
438   border-bottom: 0px;
439 }
440                                 
441 .example p {
442   margin-bottom: 0;
443   padding: 5px;
444 }
445
446
447 .warning {
448   width: 400px;
449   border-width: 2px;
450   border-style: solid;
451   border-color: #4D801A;
452   padding: 7px;
453   padding-bottom: 12px;
454   margin-bottom: 20px;
455   background-color: #f0f0f0;
456 }
457
458 .warning h4 {
459   text-align:
460   center;
461   font-weight:
462   bold;
463   padding: 5px 5px 5px 15px;
464   font-size: 12px;
465   margin: -7px;
466   background-color: #4D801A;
467   color: #fff;
468   border-bottom: 0px;
469 }
470
471 .warning p {
472   margin-bottom: 0;
473   padding: 5px;
474 }
475
476 #election_creation_progress_bar ul li {
477   display: inline;
478   list-style: default;
479 }
480
481 #election_creation_progress_bar ul li:after {
482   font-weight: normal;
483   color: #000;
484   content: " || ";
485 }
486
487 #election_creation_progress_bar ul li.last:after {
488   content: "";
489 }
490
491 #election_creation_progress_bar li.step_selected {
492   font-weight: bold;
493 }
494
495 #election_creation_progress_bar li.step_unselected {
496   color: #CCCCCC;
497   font-weight: bold;
498 }
499
500 /*
501 #plurality h4 {
502         background: url(/images/voting_plurality.png);
503         width: 217px;
504 }
505
506 #schulze h4 {
507         background: url(/images/voting_schulze_quickvote.png);
508         width: 183px;
509 }
510
511 #approval h4 {
512         background: url(/images/voting_approval.png);
513         width: 208px;
514 }
515
516 #borda h4 {
517         background: url(/images/voting_borda.png);
518         width: 147px;
519 }
520
521 #condorcet h4 {
522         background: url(/images/voting_condorcet.png);
523         width: 240px;
524 }
525
526 #irv h4 {
527         background: url(/images/voting_irv.png);
528         width: 86px;
529 }
530 */
531
532

Benjamin Mako Hill || Want to submit a patch?