themes/canvas/default.css

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