]> projects.mako.cc - selectricity-live/blob - public/stylesheets/main.css
418e892534c4e06780c5d080b37331e0a06efbfb
[selectricity-live] / public / stylesheets / main.css
1 @charset "utf-8";
2
3 /* CSS Document */
4
5 /****************************************************************
6    Selectricity || selectricity.org
7    Design by Courtland Allen
8 *****************************************************************/
9
10 /* basics */
11  
12 body {
13         color: black;
14         background: white;
15         background: url(/images/bg_main.png) repeat-x top left;
16 }
17
18 h2 {
19         font-size: 24px !important;
20         margin: 0 0 1em 0 !important;
21 }
22
23 h3 {
24         font-size: 18px !important;
25         margin: 0 0 1em 0 !important;
26 }
27
28 .special {
29         background-color: #999999;
30         color: white;
31         text-align: center;
32         pading: 0 1em 0 1em;
33 }
34
35 label {
36     font-weight: bold;
37 }
38
39
40 /* Left column. Includes logo, poll information, and graph. */
41  
42 #left-side {
43         width: 270px;
44         float: left;
45         text-align: left;
46         margin-top: 33px;
47         font-size: 13px;
48 }
49
50 #left-side h1 {
51         height: 0px;
52         overflow: hidden;
53         padding-top: 189px;
54         background: url(/images/title_main.png) no-repeat top left;
55 }
56
57
58 #left-side-content {
59         color: #666666;
60         margin-top: 40px;
61         text-align: left;
62 }
63
64 #left-side-content p {
65         color: #666666;
66         padding-left: 2em;
67         margin: 2em 0 2em 0;
68 }
69
70 #left-side-content ol {
71         color: #666666;
72 }
73
74 /* #graph {
75         margin-top: 50px;
76         background: url(/images/graph.jpg) top left no-repeat;
77         height: 0px;
78         overflow: hidden;
79         padding-top: 243px;
80 } */
81
82
83
84 /* Right column. Includes top-bar and main-box. */
85
86 #right-side {
87         width: 611px;
88         margin-top: 0px;
89         float: right;
90 }
91  
92 #top-bar {
93         float: right;
94         margin-right: 50px;
95         width: 231px;
96         text-align: center;
97         margin-bottom: 35px;
98 }
99
100 #top-bar a {
101         color: #dddddd;
102         font-size: 11px;
103 }
104
105 div#bar-left {
106         background-image: url(/images/top_bar_1.png);
107         width: 153px;
108         height: 37px;
109         padding-top: 8px;
110         float: left;
111         clear: left;
112 }
113
114 div#bar-right {
115         background-image: url(/images/top_bar_2.png);
116         width: 78px;
117         height: 37px;
118         padding-top: 8px;
119         float: left;
120         clear: right;
121 }
122
123 .green { color: #10a700; }
124
125 .left-aligned h4 {
126         float: left;
127         padding-top: 26px;
128         height: 0px;
129         overflow: hidden;
130         background: no-repeat top left;
131 }
132
133 .right-aligned h4 {
134         float: right;
135         padding-top: 26px;
136         height: 0px;
137         overflow: hidden;
138         background: no-repeat top right;
139 }
140
141 .left-aligned { text-align: left; }
142
143 .right-aligned { text-align: right; }
144
145 h5 {
146         color: #5c5c5c;
147         background-color: #d6d6d6;
148         height: 21px;
149         font-size: 16px;
150         padding: 5px 15px 0 15px;
151         margin-bottom: .75em;
152         overflow: hidden;
153 }
154
155 #title-header {
156     margin: -20px -20px 1em -20px;
157     height: 32px;
158     margin-bottom: 14px;
159         background-color: #e5e5e5;
160 }
161
162 .normal-header {
163     margin: 1.3em -20px 1.3em -20px;
164     height: 32px;
165         background-color: #e5e5e5;
166 }
167
168 .header {
169     display: block;
170     font-family: verdana,arial,helvetica,sans-serif;
171     font-size: 30px;
172     text-transform: uppercase;
173     text-align: center;
174     color: white;
175     background-color: #999999;
176     height: 32px;
177     float: left;
178     padding: 0px .75em 0px .75em;
179 }
180
181 .subheader {
182     float: left;
183     font-family: verdana,arial,helvetica,sans-serif;
184     font-size: 18px;
185     color: #666666;
186         background-color: #e5e5e5;
187     height: 26px;
188     padding: 6px 1em 0px 10px;
189
190
191 #main-box {
192         float: right;
193         width: 571px;
194         padding: 20px;
195         background: #f9f9f9;
196         border: 1px solid #b3b3b3;
197 }
198
199 #main-box p, #main-box blockquote, #main-box ul {
200     margin-bottom: 1em;
201 }
202
203 blockquote {
204     margin-left: 3em;
205 }
206
207
208 /* css related to error in forms */
209
210 #errorExplanation {
211   border: 2px solid #C00;
212   width: 260px;
213   margin-bottom: 20px;
214   background-color: #f0f0f0;
215 }
216
217 #errorExplanation h2 {
218   font-size: 1em !important;
219   text-align: left;
220   font-weight: bold;
221   padding: 5px 5px 5px 5px;
222   background-color: #c00;
223   color: #fff;
224 }
225
226 #errorExplanation p {
227   font-size: 1em;
228   color: #333;
229   margin-bottom: 0;
230   padding: 5px;
231 }
232
233 #errorExplanation ul li {
234   font-size: 1em;
235   list-style: square;
236 }
237
238 .fieldWithErrors {
239     display: inline;
240 }
241 .fieldWithErrors input, .fieldWithErrors select, .fieldWithErrors textarea {
242     background-color: #FFFBB3; 
243 }
244
245 #status {
246   width: 400px;
247   border: 1px solid #0000FF;
248   border-width: 1px;
249   padding: 7px;
250   padding-bottom: 12px;
251   margin-bottom: 20px;
252   background-color: #f0f0f0;
253 }
254
255 li.moveable {
256   background-color: #E5FFCC;
257   border:1px solid #4D801A;
258   cursor: move;
259   padding: 4px;
260   margin: 4px;
261 }
262
263 #sortable_list {
264   font-size: 24pt;
265   display: float;
266   float: left;
267 }
268
269 .preftable {
270         font-family: verdana,arial,helvetica,sans-serif;
271         border-spacing: 0px;
272         border-width: 2px;
273         border-color: #999999;
274         border-style: solid;
275         caption-side: top;
276 }
277 .preftable caption { 
278   font-family: verdana,arial,helvetica,sans-serif;
279   font-size: 0.9em;
280 }
281 .preftable th {
282         font-family: verdana,arial,helvetica,sans-serif;
283         border-width: 2px;
284         border-color: #999999;
285         border-style: solid;
286         text-align: center;
287         font-weight: bold;
288         padding: 5px 5px 5px 5px;
289         background-color: #999999;
290         color: #FFFFFF;
291 }
292
293 .preftable td {
294   border-collapse: collapse;
295   border-width: 1px;
296   border-color: #999999;
297   border-style: solid;
298   text-align: right;
299   padding-right: 5px;
300   padding-left: 5px;
301 }
302
303 .voterbox {
304   border-spacing: 0px;
305   border-width: 2px;
306   border-color: #4D801A;
307   border-style: solid;
308 }
309
310 .voterbox th {
311   border-width: 2px;
312   border-color: #73BF26;
313   border-style: solid;
314   text-align: center;
315   font-weight: bold;
316   padding: 5px 5px 5px 15px;
317   background-color: #73BF26;
318   color: #fff;
319 }
320
321 .voterbox td {
322   border-collapse: collapse;
323   border-width: 1px;
324   border-color: #4D801A;
325   border-style: solid;
326
327   text-align: right;
328   padding-right: 5px;
329   padding-left: 5px;
330 }
331
332 /* voterbox#election is used on user summary page */
333 .voterbox#election { border-color: #990d13; }
334
335 .voterbox#election th {
336          background-color: #dc0d13;
337          border-color: #dc0d13; 
338 }
339         
340 .voterbox#election td { border-color: #990d13;}
341
342 .rbmoreinfo hr {
343   width: 100%;
344   height: 10px;
345   color: #4D801A;
346 }
347 .rbmoreinfo h4 {
348   border: 0px;
349   font-style: italic;
350   text-align: center;
351   font-size: 0.9em;
352 }
353
354 .rbmoreinfo p {
355   font-size: 0.8em;
356   padding-left: 30px;
357   padding-right: 30px;
358   text-align: left;
359 }
360
361 .example {
362   width: 400px;
363   border-width: 2px;
364   border-style: solid;
365   border-color: #999999;
366   padding: 7px;
367   padding-bottom: 12px;
368   margin-bottom: 20px;
369   background-color: #f0f0f0;
370 }
371
372 .example h4 {
373   text-align: center;
374   font-weight: bold;
375   padding: 5px 5px 5px 15px;
376   font-size: 12px;
377   margin: -7px;
378   background-color: #999999;
379   color: #fff;
380   border-bottom: 0px;
381 }
382                                 
383 .example p {
384   margin-bottom: 0;
385   padding: 5px;
386 }
387
388
389 .warning {
390   width: 400px;
391   border-width: 2px;
392   border-style: solid;
393   border-color: #dc0d13;
394   padding: 7px;
395   padding-bottom: 12px;
396   margin-bottom: 20px;
397   background-color: #f0f0f0;
398 }
399
400 .warning h4 {
401   text-align:
402   center;
403   font-weight:
404   bold;
405   padding: 5px 5px 5px 15px;
406   font-size: 12px;
407   margin: -7px;
408   background-color: #dc0d13;
409   color: #fff;
410   border-bottom: 0px;
411 }
412
413 .warning p {
414   margin-bottom: 0;
415   padding: 5px;
416 }
417
418 #progress_bar ul li {
419   display: block;
420   list-style: default;
421 }
422
423 #progress_bar li.step_selected {
424   font-weight: bold;
425 }
426
427 #progress_bar li.step_unselected {
428   color: #CCCCCC;
429   font-weight: bold;
430 }
431
432 #progress_bar li.step_unselected {
433   color: #CCCCCC;
434   font-weight: bold;
435 }
436
437 #progress_bar li.step_unselected a {
438   text-decoration: none;
439 }
440
441 div.photo {
442  text-align: center;
443  margin-bottom: 1.5em;
444 }
445
446 div.photo img {
447  border: 1px black solid;
448 }
449

Benjamin Mako Hill || Want to submit a patch?