Implemented automatic greater fonts when higher screen resolutions.
[fa-stable.git] / themes / default / default.css
1 /*--------------------------------------------------\
2 | default       |               | default.css       |
3 |---------------------------------------------------|
4 | For use with:                                     |
5 | FrontAccounting                                                                       |
6 | http://FrontAccounting.com/                           |
7 | by Joe Hunt Consulting                            |
8 |---------------------------------------------------|
9 | Developer:                                        |
10 | Joe Hunt                                          |
11 |                                                   |
12 |---------------------------------------------------|
13 | Note:                                             |
14 | Changes can be made to this CSS that will be      |
15 | reflected throughout FrontAccounting.             |
16 |                                                   |
17 \--------------------------------------------------*/
18
19
20 body {
21         font-family: Verdana, Arial, Helvetica;
22         background: #285b86;
23         font-size: 10px;
24         margin: 5px 0 0 5px;
25         padding: 0;
26 }
27
28 tr, td, th {
29         font-size: 11px;
30         line-height: 19px;
31 }
32 /*
33 table {
34         text-align: left;
35 }
36 */
37 textarea {
38         font-size: 12px;
39 }
40
41 input, select {
42         font-size: 11px;
43         padding: 1px;
44 }
45
46 select {
47     max-width: 230px;
48 }
49
50 option.inactive {
51         text-decoration: line-through;
52         color: gray;
53 }
54
55 input.big {
56         width: 100px;
57 }
58
59 input.small {
60         width: 50px;
61 }
62
63 a {
64         color: #0000bb;
65         font-size: 11px;
66         text-decoration: none;
67 }
68
69 a:link {
70         color: #0000bb;
71         text-decoration: none;
72 }
73
74 a:active {
75         color: #000000;
76         text-decoration: none;
77 }
78
79 a:hover, a:focus {
80         color: #2d8628;
81         text-decoration: underline;
82 }
83
84 .inactive {
85         color: gray;
86 }
87
88 button {
89         font-size: 11px;
90         border: 1px #0066cc solid;
91         padding: 1px 0px;
92 }
93
94 button img, span {
95         padding: 0px 2px ;
96         vertical-align: middle;
97 }
98
99 .callout_main {
100         font-family: Verdana, Arial, Helvetica;
101         border: none;
102         width: 99%;
103         margin: 0;
104         padding: 0;
105 }
106
107 .main_page {
108         background-color: #f9f9f9;
109         border: none;
110         width: 100%;
111         margin: 0;
112         padding: 0;
113 }
114
115 .quick_menu {
116         background-color: #285b86;
117         border: 0;
118         margin: 0;
119         padding: 0;
120         /*text-align: right;*/
121 }
122
123 .quick_menu_selected {
124         font-family: Verdana, Arial, Helvetica;
125         font-size: 13px;
126         border: none;
127         white-space: nowrap;
128         margin: 2px;
129         padding: 2px;
130         color: #00cc00;
131         font-weight: bolder;
132 }
133
134 .logoutBar {
135         padding-right: 1em;
136         background: #dee7ec;
137         color: black;
138         border-bottom: 1px solid #8cacbb;
139         width: 100%;
140 }
141
142 .bottomBar {
143         padding-right: 1em;
144         background: #dee7ec;
145         color: black;
146         border-bottom: 1px solid #8cacbb;
147         width: 100%;
148 }
149
150 .bottomBarCell {
151         font-size: 10px;
152         line-height: 12px;
153 }
154
155 .bottomBar2 {
156         padding-right: 1em;
157         background: #dee7ec;
158         color: black;
159         border-top: 1px solid #8cacbb;
160         border-bottom: 1px solid #8cacbb;
161         width: 100%;
162 }
163
164 .logoutBarRight {
165         text-align: right;
166 }
167
168 div.logoutBar {
169         padding-right: 1em;
170         background: #dee7ec;
171         color: black;
172         border-bottom: 1px solid #8cacbb;
173         text-align: right;
174 }
175 div.logoutBar a {
176         font-weight: normal;
177         margin-left: 1em;
178         color: #436976;
179         background-color: transparent;
180 }
181 div.logoutBar img {
182         vertical-align: top;
183 }
184
185 div.tabs {
186         padding: 3px 0 0 0;
187         background: none transparent scroll repeat 0% 0%;
188         white-space: nowrap;
189         border-collapse: collapse;
190         border-bottom: 1px solid #8cacbb;
191
192 }
193 div.tabs a {
194         border: 1px solid #8cacbb;
195         padding: 3px 10px;
196         font-weight: normal;
197         background: white scroll repeat 0% 0%;
198         color: #436976;
199         margin-right: 0;
200         height: 10px;
201 }
202 div.tabs a.selected {
203         border-top: 1px solid #8cacbb;
204         border-right: 1px solid #8cacbb;
205         border-bottom:  1px solid #dee7ec;
206         border-left: 1px solid #8cacbb;
207         font-weight: normal;
208         background: #dee7ec;
209         color: #436976;
210 }
211 div.tabs a:hover {
212         background: #dee7ec;
213         color: #436976;
214 }
215
216 .menu_group {
217         font-size: 13px;
218         padding: 0px;
219         color: #000000;
220         background-color: #dee7ec;
221         padding-left: 3px;
222         font-weight: bold;
223 }
224
225 .menu_group_items {
226         background-color: #f9f9f9;
227         font-weight: normal;
228         padding: 9px;
229         border: 1px solid #8cacbb;
230 }
231
232 #hotkeyshelp {
233         text-align: right;
234         font-weight: bolder;
235 }
236
237 #footer {
238         position: relative;
239         bottom: -3px;
240 }
241
242 .footer td a {
243         color: #666666;
244         font-size: 9px;
245 }
246
247 .footer {
248         font-family: Verdana, Arial, Helvetica;
249         color: #cccccc;
250         font-weight: normal;
251         font-size: 9px;
252         text-align: center;
253         width: 100%;
254 }
255
256 .tableheader {
257         font-weight: bold;
258         background-color: #dee7ec;
259         color: black;
260         text-align: center;
261 }
262
263 .tableheader2 {
264         font-weight: bold;
265         background-color: #dee7ec;
266         color: black;
267         text-align: left;
268 }
269
270 .titletext {
271         font-weight: bold;
272         font-size: 13px;
273         border-bottom: 1px solid #8cacbb;
274         padding: 5px;
275         width: 100%;
276 }
277
278 .headingtext {
279         font-weight: bold;
280         font-size: 13px;
281         color: black;
282 }
283
284 .headingtext2 {
285         font-size: 13px;
286         color: black;
287 }
288
289 .headingtext3 {
290         font-weight: bold;
291         font-size: 10px;
292         color: black;
293 }
294
295 .errortext {
296         font-size: 13px;
297         color: #ff0000;
298         font-weight: bold;
299 }
300
301 .inputsubmit {
302         font-size: 11px;
303         border: 1px #0066cc solid;
304         padding: 1px 4px;
305 }
306
307 .ajaxsubmit {
308         font-size: 11px;
309         border: 1px #0066cc solid;
310         padding: 1px 4px;
311 }
312
313 .oddrow {
314         background-color: #eeeeee;
315 }
316
317 .evenrow {
318         background-color: #dddddd;
319 }
320
321 .overduebg {
322         background-color: #dd7777;
323 }
324
325 .overduefg {
326         color: #dd7777;
327 }
328
329 .currentfg {
330         color: #ff6666;
331 }
332
333 .redfg, a.redfg {
334         color: red;
335         font-weight: bold;
336 }
337
338 .settledbg {
339         background-color: #00bb00;
340 }
341
342 .settledfg {
343         color: #00bb00;
344 }
345
346 .inquirybg {
347         background-color: #fdfeef;
348 }
349
350 .currencybg {
351         background-color: #ee8888;
352 }
353
354 .stockmankobg {
355         background-color: pink;
356 }
357
358 .stockmankofg {
359         color: red;
360 }
361
362 table.tablestyle {
363         border-collapse: collapse;
364         border: 1px solid #8cacbb;
365 }
366 table.tablestyle td {
367         border-collapse: collapse;
368         border: 1px solid #8cacbb;
369 }
370 table.tablestyle2 {
371         border-collapse: collapse;
372         border: 1px solid #cccccc;
373 }
374 table.tablestyle2 td {
375         border-collapse: collapse;
376         border: 1px solid #cccccc;
377 }
378 table.tablestyle_inner {
379         border-collapse: collapse;
380         border: 1px solid #f9f9f9;
381 }
382 table.tablestyle_inner td {
383         border-collapse: collapse;
384         border: 1px solid #f9f9f9;
385 }
386 .tablestyle_noborder {
387         padding: 3px;
388 }
389
390 .label {
391         background-color: #efefef;
392         color: black;
393 }
394
395 #loginscreen {
396         background: #f5f5f5;
397 }
398
399 .login {
400         width: 350px;
401         border:1px solid #ccc;
402         border-left: 12px solid #367cb5;
403         background-color: #eeeeee;
404 }
405
406 .login td.tableheader {
407         line-height: 40px;
408         border:1px solid #ccc;
409 }
410
411 .login select, .login input[type=text], input[type=password] {
412         height:25px;
413         width: 225px;
414         padding-left: 3px;
415         box-sizing: border-box;
416         border: 1px solid #bbb;
417         border-radius: 4px;
418         background-color: #fff;
419         outline: none;
420 }
421
422 .login input[type=button], input[type=submit] {
423   background-color: #367cb5;
424   border: none;
425   border-radius: 4px;
426   color: white;
427   padding: 8px 16px;
428   text-decoration: none;
429   margin: 4px 2px;
430   cursor: pointer;
431 }
432
433 .amount {
434         font-family: Verdana, Arial, Helvetica;
435         font-size: 11px;
436         text-align: right;
437 }
438
439 input.amount {
440         padding-right: 0px;
441 }
442
443 .editbutton {
444    color:#0000FF;
445    background-color:transparent;
446    border-style:none;
447    text-decoration:underline;
448    cursor: pointer;
449 }
450
451 .navibutton[disabled], .navibutton[disabled] span {
452   color:#808080;
453   text-decoration: none;
454   cursor: auto;
455 }
456
457 button.navibutton {
458         font-family: Verdana, Arial, Helvetica;
459         font-size: 11px;
460         font-weight: bold;
461    color:#000;
462    padding: 0 3px;
463    background-color:transparent;
464    border-style:none;
465    cursor: pointer;
466 }
467
468 .navibutton span {
469         text-decoration: underline;
470 }       
471
472 .navibar {
473     padding: 0 3px;
474         color: #000;
475     border-collapse: collapse;
476     background-color: #dee7ec;
477 }
478
479 .navibar tr td {
480     border: none;
481 }
482
483 .listsubmit {
484     display: none;
485 }
486
487 ul.ajaxtabs{
488         padding: 3px 0 0 0;
489         margin: 3px 3px 0 3px;
490         font: 12px Tahoma,Verdana;
491         font-weight: bold;
492 }
493
494 ul.ajaxtabs li{
495         list-style: none;
496         margin: 0;
497         display: inline;
498 }
499
500 ul.ajaxtabs li button{
501     background-color: #dee7ec;
502 /*      background-repeat: repeat-x;
503         background-position: top; */
504         padding: 3px 8px;
505         margin: 0px;
506         border-top: 1px solid #8cacbb;
507         border-right: 1px solid #8cacbb;
508         border-bottom: none;
509         border-left: none;
510         font-weight: bold;
511 }
512
513 ul.ajaxtabs li button:hover{
514         border-top: 1px solid #8cacbb;
515         color:#FFFFFF;
516 }
517 div.spaceBox{
518         background-color: #8cacbb;
519         height:8px;
520         border-bottom: 1px solid #8cacbb;
521         border-left: 1px solid #8cacbb;
522         border-right:1px solid #8cacbb;
523         margin: 0 3px 0px 3px
524 }
525
526 div.contentBox{
527         border: 1px solid #8cacbb;
528         margin: 0 3px 3px 3px
529 }
530
531 ul.ajaxtabs li button.current, ul.ajaxtabs li button.current:hover{
532         border-left: 1px solid #8cacbb;
533         background-color: #8cacbb;
534         color:#FFFFFF;
535 }
536 #hints {
537         font-size: 13px;
538         padding: 5px;
539         border-bottom: 1px solid #8cacbb;
540         margin: -4px -2px -2px;
541         border: 1px solid #8cacbb;
542         background-color: #FFFFE0;
543         white-space: nowrap;
544 }
545 /*
546         Calendar style
547 */
548 #CCIframe {
549         display: none;
550         left: 0px;
551         position: absolute;
552         top: 0px;
553         height: 250px;
554         width: 270px;
555         z-index: 99;
556 }
557 #CC { 
558         position:absolute;
559         background-color:#FFF;
560         margin:0; padding:0;
561         display:none;
562         z-index: 100;
563 }
564 #CC table { 
565         font-family: arial, verdana, helvetica, sans-serif;
566         font-size: 8pt;
567         border-left: 1px solid #336;
568         border-right: 1px solid #336;
569 }
570 #CC th {
571         font-weight: normal;
572         text-align: center;
573 }
574 #CC th a {
575         font-weight: normal;
576         text-decoration: none;
577         color: #FFF;
578         padding: 1px;
579 }
580 #CC td {
581         text-align: center;
582 }
583 #CC .header {
584         background-color: #285b86;
585 }
586 #CC .weekday {
587         background-color: #eee;
588         color: #000;
589 }
590 #CC .weekend {
591         background-color: #FFC;
592         color: #000;
593 }
594 #CC .weekno {
595         background-color: #c0daf8;
596         color: #555;
597 }
598 #CC .current {
599         border: 1px solid #339;
600         background-color: #285b86;
601         color: #FFF;
602 }
603 #CC .weekday, #CC .weekend, #CC .current {
604         display: block;
605         text-decoration: none;
606         border: 1px solid #FFF;
607         width: 2em;
608 }
609 #CC .weekday:hover, #CC .weekend:hover, #CC .current:hover {
610         color: #FFF;
611         background-color: #285b86;
612         border: 1px solid #999;
613 }
614 #CC .previous {
615         text-align: left;
616 }
617 #CC .next {
618         text-align: right;
619 }
620 #CC .previous, #CC .next {
621         padding: 1px 3px 1px 3px;
622         font-size: 1.4em;
623 }
624 #CC .previous a, #CC .next a {
625         color: #FFF;
626         text-decoration: none;
627         font-weight: bold;
628 }
629 #CC .title {
630         text-align: center;
631         font-weight: bold; 
632         color: #FFF;
633 }
634 #CC .empty {
635         background-color: #ddd;
636         border: 1px solid #FFF;
637 }
638
639 div.err_msg {
640         margin: 10px;
641         padding: 3px;
642         border: 1px solid #cc3300;
643         background-color: #ffcccc;
644         color: #dd2200;
645         text-align: center;
646 }
647
648 div.warn_msg {
649         margin: 10px;
650         padding: 3px;
651         border: 1px solid #ff9900;
652         background-color: #ffff00;
653         color: #ff5500;
654         text-align: center;
655 }
656
657 div.note_msg {
658         margin: 10px; 
659         padding: 3px;
660         border: 1px solid #33cc00;
661         background-color: #ccffcc;
662         color: #007700;
663         text-align: center;
664 }
665
666 #title {
667         margin-bottom: 10px;
668         width: 100%;
669 }
670
671 @media screen and (min-width: 1024px) {
672         body, .headingtext3 { font-size: 11px; }
673         textarea { font-size: 13px; }
674         tr, td, th, input, select, a, button, .inputsubmit, .ajaxsubmit, .amount, button.navibutton { font-size: 12px; }
675         .quick_menu_selected, .menu_group, .titletext, .headingtext, .headingtext2, .errortext, #hints { font-size: 14px; }
676         .bottomBarCell { font-size: 11px; line-height: 13px; }
677         .footer, .footer td a { font-size: 10px; }
678         #CC table { font-size: 9pt; }
679         #CC .previous, #CC .next { font-size: 1.4em; }
680 }
681 @media screen and (min-width: 1200px) {
682         body, .headingtext3 { font-size: 12px; }
683         textarea { font-size: 14px; }
684         tr, td, th, input, select, a, button, .inputsubmit, .ajaxsubmit, .amount, button.navibutton { font-size: 13px; }
685         .quick_menu_selected, .menu_group, .titletext, .headingtext, .headingtext2, .errortext, #hints { font-size: 15px; }
686         .bottomBarCell { font-size: 12px; line-height: 14px; }
687         .footer, .footer td a { font-size: 11px; }
688         #CC table { font-size: 10pt; }
689         #CC .previous, #CC .next { font-size: 1.4em; }
690 }