docs/themes/default/styles.css

   1 /************************************************************************/
   2 /* Transformable                                                        */
   3 /************************************************************************/
   4 /* Copyright (c) 2009                                                   */
   5 /* Adaptive Technology Resource Centre / University of Toronto          */
   6 /*                                                                      */
   7 /* This program is free software. You can redistribute it and/or        */
   8 /* modify it under the terms of the GNU General Public License          */
   9 /* as published by the Free Software Foundation.                        */
  10 /************************************************************************/
  11 /* @import url(http://fonts.googleapis.com/css?family=Droid+Sans:regular,bold); */
  12
  13 @font-face {
  14   font-family: 'Droid Sans';
  15   font-style: normal;
  16   font-weight: bold;
  17   src: local('Droid Sans'), url('fonts/DroidSans-Bold.ttf') format('truetype');
  18 }
  19
  20 @font-face {
  21   font-family: 'Droid Sans';
  22   font-style: normal;
  23   font-weight: normal;
  24   src: local('Droid Sans'), url('fonts/DroidSans.ttf') format('truetype');
  25 }
  26
  27 html,body{
  28   height:100%;
  29 }
  30 /* main body attributes */
  31 body {
  32   font-family: 'Droid Sans', Cantarell, Tahoma, Geneva,sans-serif;;
  33   font-size:.9em;
  34   margin:0px;
  35   background-color:  #FFFFFF;
  36   /* background-image:url('images/texture_bg.png'); */
  37 }
  38 p {
  39     /*text-align: justify;*/
  40   line-height: 150%;
  41   font-size: 1em;
  42 }
  43 p a {
  44   text-decoration: underline;
  45 }
  46 p a:visited {
  47   color: #3F2670;
  48   background-color: transparent;
  49 }
  50 p a:active {
  51   color: #A50707;
  52   background-color: transparent;
  53 }
  54 h1, h2, h3, h4, h5, h6 {
  55   color: #000000;
  56   clear: right;
  57   font: 100% Verdana, Helvetica, Arial, sans-serif;
  58   font-weight: bold;
  59   margin: 0;
  60   padding-top: 0.5em;
  61   /*border-bottom: 1px solid #B8AE9C;*/
  62 }
  63 h1 {
  64   font-size: 160%;
  65   color: #000;
  66 }
  67 h2 {
  68     font-size: 120%;
  69 }
  70 h3 {
  71     font-size: 100%;
  72 }
  73 h4 {
  74     font-size: 90%;
  75 }
  76 h5 {
  77     font-size: 100%;
  78 }
  79 p.subgroup {
  80   margin:0 0 0 2em;
  81 }
  82 /* list attributes */
  83 ul {
  84   margin-bottom: 0px;
  85   margin-top: 0px;
  86   margin-right: 0px;
  87 }
  88 li {
  89   margin-bottom: 0px;
  90   margin-top: 0px;
  91   margin-right: 0px;
  92 }
  93 img {
  94   border: none;
  95 }
  96 ul.msg {
  97   line-height: 150%
  98 }
  99 li.msg_err, li.msg_info {
 100   margin-bottom: 30px;
 101   margin-top: 0px;
 102   margin-right: 10px;
 103   margin-left: 10px;
 104   font-size: 110%;
 105   list-style: none;
 106 }
 107
 108 /* span attributes */
 109 span.err_type{
 110   padding: .1em .5em;
 111   font-size: smaller;
 112 }
 113 span.msg{
 114   line-height: 150%;
 115 }
 116 span.congrats_msg{
 117   line-height: 120%;
 118   color: green;
 119   padding: 1em 1em;
 120   font-size: large;
 121   font-weight: bold;
 122   white-space:nowrap;
 123 }
 124 span.info_msg{
 125   line-height: 100%;
 126   color: blue;
 127   padding: 1em 1em;
 128   font-size: large;
 129   font-weight: bold;
 130 }
 131 span.padding_left {
 132   padding-left: 1em;
 133 }
 134 em {
 135   font-weight: bold;
 136 }
 137 span.small_font {
 138   font-size: smaller;
 139 }
 140
 141 /* link attributes */
 142 a:link, a:visited  {
 143   color: #1A4A72;
 144 }
 145 a:hover {
 146   color: #932318;
 147   color:#ffffff;
 148 }
 149 a:active {
 150   color: #932318;
 151 }
 152 /* align text to the left */
 153 .left {
 154   text-align: left;
 155 }
 156
 157 /* main submit button */
 158
 159 input[type=button] {
 160   cursor:pointer;
 161   border:outset 1px #ccc;
 162   font-weight:bold;
 163   padding: 1px 2px;
 164 }
 165 input[type=submit] {
 166   cursor:pointer;
 167   border:outset 1px #ccc;
 168   font-weight:bold;
 169 }
 170 input[type=text] {
 171   cursor:pointer;
 172   border-bottom:solid 1px #ccc;
 173   border-right:solid 1px #ccc;
 174   border-top:solid 1px #000;
 175   border-left:solid 1px #000;
 176   font-weight:bold;
 177   background:#fff;
 178   padding: 1px 2px;
 179 }
 180 .button:focus {
 181   border:1px solid #A50707;
 182   background-color:  #FFDAB9;
 183 }
 184 /* small submit button at top */
 185 .button2 {
 186   background-color: #E9F4F3;
 187 }
 188 .button2:focus {
 189   background-color: #E9F4F3;
 190   border:  #ACCFCC  solid 1px;
 191 }
 192 .center {
 193   text-align: center;
 194 }
 195 /* paging */
 196 div.paging {
 197   width: 100%;
 198   text-align: center;
 199   margin: 0.5em auto;
 200   font-size: smaller;
 201 }
 202 div.paging ul {
 203   list-style: none;
 204   display: inline;
 205   padding: 0px;
 206 }
 207 div.paging li {
 208   display: inline;
 209   padding-left: 1px;
 210   padding-right: 1px;
 211 }
 212 div.paging li a {
 213   padding-left: 4px;
 214   padding-right: 4px;
 215 }
 216 div.paging li a:hover, div.paging li a.current {
 217    color: #FFA20C;
 218 }
 219 /* floating layout */
 220 #contentwrapper{
 221   width: 99%;
 222 }
 223 #contentcolumn {
 224   margin-left: 0.5em;
 225   padding-right: 5px;
 226 }
 227 #contentcolumn_shiftright {
 228   margin-left: 18em;
 229 }
 230 #leftcolumn{
 231   float: left;
 232   width: 17em;
 233   margin-left: 5px;
 234   margin-top:-10px;
 235 }
 236 #footer{
 237   /*position:absolute;
 238   bottom:0px;*/
 239   clear: left;
 240   width: 100%;
 241   text-align: center;
 242   padding: 4px 0px;
 243 }
 244 #side-menu{
 245   overflow:hidden;
 246   padding:.2em;
 247 }
 248
 249 /* sequence links */
 250 div#sequence-links {
 251   float:right;
 252   padding-right: 5px;
 253   padding-top:.3em;
 254 }
 255 div#sequence-links a {
 256   text-decoration: none;
 257 }
 258
 259 /***************************************************************/
 260 /* NEW STUFF */
 261 table.tabbed-table {
 262   width: 100%;
 263   border:1px black solid;
 264 }
 265 table.tabbed-table th#left-empty-tab {
 266   background-color: transparent;
 267   width: 15px;
 268   border-bottom: 1px solid #B8AE9C;
 269 }
 270 table.tabbed-table th#right-empty-tab {
 271   text-align: right;
 272   background-color: transparent;
 273   border-bottom: 1px solid #B8AE9C;
 274   width: 400px;
 275   padding-right: 5px;
 276 }
 277 table.tabbed-table th#right-empty-tab a {
 278   text-decoration: underline;
 279 }
 280 table.tabbed-table th.tab-spacer {
 281   background-color: transparent;
 282   width: 5px;
 283   border-bottom: 1px solid #B8AE9C;
 284 }
 285 table.tabbed-table td.tab-spacer {
 286   background-color: transparent;
 287   width: 5px;
 288   border-bottom: 1px solid #B8AE9C;
 289 }
 290
 291
 292 table.tabbed-table th.tab {
 293   padding-top: 2px;
 294   padding-bottom: 2px;
 295   width: 110px;
 296   background-color: #E9F4F3;
 297   border-bottom: 1px solid #B8AE9C;
 298   border-left: 1px solid #B8AE9C;
 299   border-top: 1px solid #B8AE9C;
 300   border-right: 1px solid #B8AE9C;
 301 }
 302 table.tabbed-table th.tab:hover {
 303   background-color: #ACCFCC;
 304 }
 305
 306 table.tabbed-table th.tab a:focus {
 307   color: white;
 308 }
 309 table.tabbed-table th.selected {
 310   padding-top: 2px;
 311   padding-bottom: 2px;
 312   width: 110px;
 313   background-color: #ACCFCC;
 314   border-left: 1px solid #B8AE9C;
 315   border-top: 1px solid #B8AE9C;
 316   border-right: 1px solid #B8AE9C;
 317 }
 318
 319 table.tabbed-table a, table.tabbed-table a:visited, table.tabbed-table a:hover {
 320   color: black;
 321   text-decoration: none;
 322 }
 323
 324 #banner h1 {
 325   display: inline;
 326   font-size: 130%;
 327 }
 328 #banner {
 329   /* border: 1px #365D95 solid; */
 330   margin: 1.5em 1em 0em 1em;
 331   /* border-bottom: black 1px solid; */
 332   padding-top:4px;
 333   padding-left:4px;
 334   vertical-align:middle;
 335 }
 336 #banner a:visited {
 337   color: #365D95;
 338 }
 339 #banner a:hover {
 340   color: white; background-color: #365D95
 341 }
 342 #banner a:active {
 343   color: white; background-color: #365D95
 344 }
 345 #banner #logininfo {
 346   font-size: small;
 347   font-weight:bold;
 348   margin-left: 10px;
 349   margin-top: 2px;
 350   color: black;
 351   background-color: white;
 352   padding-left: 70%;
 353   padding-right: 5px;
 354 }
 355
 356 #logininfo {
 357 float:right;
 358   font-size: small;
 359   font-weight:bold;
 360   margin-left: 10px;
 361   margin-top: 2px;
 362   color: black;
 363   background-color: transparent;
 364   padding-left: 70%;
 365   padding-right: 5px;
 366 }
 367 #banner #versioninfo {
 368   font-size: 8pt;
 369   margin-right: 500px;
 370   margin-top: 2px;
 371   position: absolute;
 372   right: 0px;
 373   top: 0px;
 374   color: black;
 375   background-color: white;
 376   padding-left: 5px;
 377   padding-right: 5px;
 378 }
 379 #versioninfo{
 380 float:right;
 381 clear:right;
 382 }
 383 h2 #title {
 384   padding: 0px 0px 0px 0px;
 385   margin: 0px 0px 0px 0px;
 386   color: #053188;
 387 }
 388 a#back-to {
 389   padding-left: 20px;
 390   background-image: url(images/back.gif);
 391   background-repeat: no-repeat;
 392   background-position: 0px 0px;
 393 }
 394 div#breadcrumbs {
 395     /* The path bar, including breadcrumbs and add to favorites */
 396   font-size: 0.85em;
 397   margin: 0em 2em 1em 2em;
 398   padding-left:4px;
 399 }
 400 h2.page-title {
 401   clear:right;
 402   margin-left:1em;
 403 }
 404 h1 {
 405    margin-bottom: 5px;
 406 }
 407 div#sub-menu {
 408     color: #555;
 409   background-color:#FAEBD7;
 410   padding-top: 3px;
 411    font-size:0.85em;
 412     border-top:1px solid #cccccc;
 413     height:2.1em;
 414 }
 415 div#sub-navigation {
 416    float:left;
 417 }
 418 div#subnavlistcontainer {
 419   width:95%;
 420   height:auto;
 421   height:1.6em;
 422 }
 423 ul#subnavlist {
 424   margin-top: 0px;
 425   font-size:.8em;
 426   margin-left:.5em;
 427 }
 428 ul#subnavlist li {
 429   background-color: #FAEBD7;
 430   list-style: none;
 431   display: inline-block;
 432   text-align:center;
 433   border-top:1px solid #cccccc;
 434   border-left:1px solid #cccccc;
 435   border-right:1px solid #cccccc;
 436   border-bottom:1px solid #cccccc;
 437   border-radius: .3em .3em 0em 0em;
 438   -moz-border-radius: .3em .3em 0em 0em;
 439   padding: .4em 1em .3em 1em ;
 440 }
 441 ul#subnavlist li a:hover, ul#subnavlist li a:focus, ul#subnavlist li:hover{
 442   color: black;
 443   text-decoration:none;
 444   background-color: #FFFEF0;
 445   height:1.2em;
 446 padding-bottom: .35em;
 447   border-bottom:0;
 448
 449 }
 450 ul#subnavlist li.active{
 451   padding-bottom: .5em;
 452   background-color: #FFFEF0;
 453 padding-bottom: .35em;
 454   border-bottom:0;
 455
 456 }
 457 ul#subnavlist li a {
 458   /* The normal, unselected tabs. They are all links */
 459   color: #555;
 460   height: 1.0em;
 461   text-decoration:underline;
 462   font-weight:500;
 463 }
 464 div#subnavbacktopage {
 465   padding-top:5px;
 466   padding-left:5px;
 467   float:left;
 468 }
 469 a#guide {
 470   background-image: url('images/guide.png');
 471   background-repeat: no-repeat;
 472   background-position: 2px 2px;
 473   padding: 3px 10px 1px 25px;
 474   text-decoration:none;
 475   font-size:0.85em;
 476   float:right;
 477 }
 478 div#guide_box{
 479   background-color:#FAEBD7;
 480 /*
 481   border-left:1px solid #cccccc;
 482   border-right:1px solid #cccccc;
 483   border-bottom:1px solid #cccccc;
 484 */
 485   border-radius: 0em 0em .5em .5em;
 486   -moz-border-radius: 0em 0em .5em .5em;
 487   line-height:1.5em;
 488   float:right;
 489   margin-right:2em;
 490   padding:.1em;
 491 }
 492 div#guide {
 493   padding-right: 5px;
 494   float:right;
 495 }
 496 div#sub-navigation strong {
 497   color: black;
 498 }
 499 div#help {
 500   border-left: 1px solid black;
 501   border-right: 1px solid black;
 502   border-bottom: 1px solid black;
 503   padding-left: 5px;
 504   padding-right: 5px;
 505   padding-bottom: 5px;
 506   background-color: #F7F3ED;
 507   margin-left: 5px;
 508   margin-right: 5px;
 509   font-size: small;
 510 }
 511 h3#help-title {
 512   margin-left: 5px;
 513   margin-right: 5px;
 514   border-left: 1px solid black;
 515   border-right: 1px solid black;
 516   padding: 1px;
 517   background-color: #F7F3ED;
 518 }
 519 .line {
 520   border-bottom: 1px solid black;
 521 }
 522 div#help p {
 523   padding: 0px;
 524   margin: 0px;
 525 }
 526 div#toctoggle {
 527   float: left;
 528   padding-left: 10px;
 529 }
 530 h1#section-title {
 531   float: left;
 532   white-space:nowrap;
 533   margin-left:1em;
 534   margin-bottom: -0.5em;
 535 }
 536 div#top-links {
 537   float:right;
 538   padding-right: 5px;
 539   margin-right:205px;
 540   margin-top:1em;
 541   white-space:nowrap;
 542 }
 543 div#top-links a:link, div#top-links a:visited {
 544   text-decoration:none;
 545   margin-left:10px;
 546 }
 547 div#top-links a:focus{
 548   color:black;
 549   background-color:#F6EAD6;
 550 }
 551
 552 /* for filter tables */
 553 table.filter {
 554   clear:left;
 555   margin-left: auto;
 556   margin-right: auto;
 557   text-align: left;
 558 }
 559 table.filter th {
 560   font-weight: bold;
 561 }
 562 table.filter td {
 563   padding: 5px;
 564   white-space: nowrap;
 565 }
 566
 567 /* for data tables */
 568 table.data {
 569   clear:right;
 570   width: 95%;
 571   margin-right: auto;
 572   margin-left: auto;
 573   text-align: left;
 574 }
 575 table.data th {
 576   background-color: #F6EAD6;
 577   padding: 3px;
 578   white-space: nowrap;
 579 }
 580 table.data th a {
 581   color: #595241;
 582   padding-right: 15px;
 583   margin-right: 15px;
 584   background-image: url('../default/images/sort.gif');
 585   background-repeat: no-repeat;
 586   background-position: right;
 587 }
 588 table.data tbody {
 589   border-top: 1px solid #B8AE9C;
 590   border-bottom: 1px solid #B8AE9C;
 591 }
 592 table.data tbody th {
 593   text-align: left;
 594   background-color: #F7F3ED;
 595   cursor: auto;
 596 }
 597 table.data td {
 598   padding: 3px;
 599 }
 600 table.data tbody tr:hover {
 601   background-color: #efefef;
 602   cursor: pointer;
 603 }
 604 table.data tbody tr.selected {
 605   background-color: #E9F4F3;
 606   cursor: auto;
 607 }
 608 table.data tfoot {
 609   background-color: #F7F3ED;
 610   /*border-top: 1px solid #B8AE9C;*/
 611 }
 612 table.data tfoot tr:first-child td {
 613   /*border-top: 1px solid #B8AE9C;*/
 614   padding: 5px;
 615   background-image: url('images/arrow_ltr.gif');
 616   background-repeat: no-repeat;
 617   background-position: 4px 5px;
 618   padding-left: 40px;
 619 }
 620 table.data.static tfoot td, table.data.static tfoot tr:first-child td {
 621   border-top: 1px solid #B8AE9C;
 622   padding: 15px;
 623   background-image: none;
 624   padding-left: 0px;
 625 }
 626 /*buttons*/
 627 table.data tfoot input {
 628   background-color: #efefef;
 629   font-weight: normal;
 630   border:  #AAA  solid 1px;
 631 }
 632 table.data tfoot input:focus {
 633   background-color: #FFDAB9;
 634   border:  #AAA  solid 1px;
 635 }
 636
 637 /* used for static tables with no form elements: */
 638 table.data.static tbody tr:hover {
 639   background-color: transparent;
 640   cursor: auto;
 641 }
 642 .data-table-tip {
 643   margin-left: 2em;
 644 }
 645 div#error {
 646   width: 50%;
 647   margin-left: auto;
 648   margin-right: auto;
 649   margin-top: 15px;
 650   margin-bottom: 15px;
 651   border: 1px solid #DD0000;
 652   padding: 5px;
 653   background-color: #F4DCDC;
 654   color: #A50707;
 655   background-color: #F4DCDC;
 656   padding-left: 25px;
 657   font-weight: bold;
 658   border-radius:.3em .3em .3em .3em;
 659   -moz-border-radius:.3em .3em .3em .3em;
 660 }
 661 div#error h4 {
 662   color: black;
 663   margin-left: 0px;
 664 }
 665 div#error ul, div#feedback ul, div#help ul {
 666   position: relative;
 667   list-style: none;
 668   margin-left: 0px;
 669   padding-left: 0px;
 670
 671 }
 672 div#error ul li{
 673   margin-top: 5px;
 674 }
 675 div#feedback {
 676   width: 50%;
 677   margin-left: auto;
 678   margin-right: auto;
 679   margin-top: 15px;
 680   margin-bottom: 15px;
 681   border: 1px solid #17B506;
 682   padding: 5px;
 683   background-color: #F2FCF0;
 684   color: #595241;
 685   font-weight: bold;
 686   border-radius:.3em .3em .3em .3em;
 687   -moz-border-radius:.3em .3em .3em .3em;
 688 }
 689 div#help {
 690   width: 50%;
 691   margin-left: auto;
 692   margin-right: auto;
 693   margin-top: 15px;
 694   margin-bottom: 15px;
 695   border: 1px solid #ACCFCC;
 696   padding: 5px;
 697   background-color: #E9F4F3;
 698   color: #024C41;
 699   border-radius:.3em .3em .3em .3em;
 700   -moz-border-radius:.3em .3em .3em .3em;
 701 }
 702 div#info {
 703   width: 50%;
 704   margin-left: auto;
 705   margin-right: auto;
 706   margin-top: 15px;
 707   margin-bottom: 15px;
 708   border: 1px solid #B8AE9C;
 709   padding: 5px;
 710   background-color: #EFE6FF;
 711   color: #595241;
 712   font-weight: bold;
 713   border-radius:.3em .3em .3em .3em;
 714   -moz-border-radius:.3em .3em .3em .3em;
 715 }
 716 div#warning {
 717   width: 50%;
 718   margin-left: auto;
 719   margin-right: auto;
 720   margin-top: 15px;
 721   margin-bottom: 15px;
 722   border: 1px solid #FF8400;
 723   padding: 5px;
 724   background-color: #FFF6ED;
 725   color: #D95900;
 726   font-weight: bold;
 727   border-radius:.3em .3em .3em .3em;
 728   -moz-border-radius:.3em .3em .3em .3em;
 729 }
 730 acronym {
 731   cursor: help;
 732 }
 733 .required {
 734   font-weight: bold;
 735   color: red;
 736   padding-right: 2px;
 737 }
 738 form {
 739   clear: none;
 740   display:inline;
 741 }
 742 h3.indent {
 743   width: 90%;
 744   padding: 0px 0px 10px 60px;
 745 }
 746 h4.box {
 747   font-size:0.85em;
 748   padding: 3px;
 749   background-color:#FAEBD7;
 750   /*border-top: 1px solid #B8AE9C;
 751   border-left: 1px solid #B8AE9C;
 752   border-right: 1px solid #B8AE9C;
 753   */
 754   -moz-border-radius:.5em .5em 0em 0em;
 755   border-radius:.5em .5em 0em 0em;
 756 }
 757 div.box {
 758   padding: 5px;
 759   background-color: #FAEBD7;
 760   color: black;
 761   /*
 762   border-left: 1px solid #B8AE9C;
 763   border-right: 1px solid #B8AE9C;
 764   border-bottom: 1px solid #B8AE9C;
 765   */
 766   font-size:0.8em;
 767   font-weight: normal;
 768   padding:2px;
 769   -moz-border-radius:.0em .0em .5em .5em;
 770   border-radius:.0em .0em .5em .5em;
 771 }
 772 h5.box {
 773   background-color: #6F7172;
 774   border: 1px solid #B8AE9C;
 775   border-style: solid solid none solid;
 776   color: Black;
 777   padding: 0em 1em 0em 1em;
 778   display: inline;
 779   font-size:  1em;
 780   height: 1em;
 781 }
 782 div.box a:link {
 783   text-decoration: none;
 784 }
 785 div.box a:visited {
 786   color: #2A6C28;
 787   text-decoration: none;
 788 }
 789 div.box a:hover {
 790   text-decoration: underline;
 791 }
 792 .boxDetails {
 793   text-align: right;
 794 }
 795 div.box .content {
 796   padding: 1em;
 797   font-size:  1em;
 798 }
 799 div.box a.close {
 800   float: right;
 801   text-transform: none;
 802   border-left: 1pt solid #B8AE9C;
 803   padding: 0em 0.2em;
 804 }
 805 div.box h1,
 806 div.box h2,
 807 div.box h3,
 808 div.box h4 {
 809     margin: 0;
 810     padding: 0;
 811 }
 812 div.box .even {
 813     background-color: #F7F3ED;
 814 }
 815 div.box .odd {
 816     background-color: transparent;
 817 }
 818 div#container {
 819   text-align: left;
 820   margin: 0px auto;
 821   padding: 0px;
 822   border:0;
 823   width: 95%;
 824 }
 825 div#menutoggle{
 826   text-align: right;
 827   padding-bottom: 10px;
 828   padding-right: 10px;
 829   float: left;
 830   margin-top: 10px;
 831   padding-right: 5px;
 832   font-size:0.95em;
 833 }
 834
 835 /*** header ***/
 836 /*
 837 ul.topnavlist {
 838   padding-top: 10px;
 839   white-space: nowrap;
 840   list-style-position:inside;
 841   list-style: disc inside;
 842   line-height:1.0em;
 843   border:1px solid black;
 844 }
 845 ul.topnavlist li {
 846   list-style: none;
 847   list-style-position:inside;
 848   display: inline;
 849   margin: 0px;
 850 }
 851 ul.topnavlist li a:hover, ul.topnavlist li a:focus, ul.topnavlist li a.active {
 852     background-color: #FAEBD7;
 853     color: black;
 854     text-decoration:none;
 855     line-height:1.6em;
 856 }
 857 ul.topnavlist li a {
 858   color: #555;
 859   font-weight:bold;
 860   padding: 0em .5em 0em;
 861   text-decoration:none;
 862   background-color:white;
 863 }
 864 ul.topnavlist li a.selected {
 865     color: #555;
 866     font-weight: normal;
 867 }
 868 */
 869 ol.remove-margin-left {
 870   margin-left:-3em;
 871 }
 872 /*  form fields grouping for WCAG 2.0 conformance*/
 873 fieldset.group_form{
 874   margin:.5em;
 875   min-height: 40px;
 876 border:none;
 877
 878 }
 879 legend.group_form{
 880   background-color: #eeeeee;
 881   font-weight: 600;
 882   color: black;
 883   height:1.5em;
 884   display:none;
 885 }
 886 fieldset.group_form1{
 887   margin:.5em;
 888   min-height:15em;
 889 }
 890 table.qdb_table{
 891   width:100%;
 892 }
 893 table.qdb_table td{
 894   vertical-align:top;
 895 }
 896 /* highlight active links for WCAG 2.0 conformance */
 897 a:active,a:hover,a:focus{
 898   background-color:#FAEBD7;
 899   color:#000000;
 900 }
 901 .highlight, a.highlight {
 902   background-color: #5B8E88;
 903   color: white;
 904 }
 905 .selected {
 906   font-size : 14px;
 907   color : black;
 908   background: #E6E6E6;
 909   font-weight : bold;
 910   padding: 2px;
 911   width: 45%;
 912 }
 913
 914 table.form-data th,table.form-data td {
 915   padding: 4px;
 916 }
 917 table.form-data{
 918   width:80%;
 919 }
 920 th.box {
 921   border-bottom: #006699 solid 1px;
 922   color: white;
 923   background-color: #006699;
 924 }
 925 table.box {
 926   background-color: white;
 927   border-right: #006699 solid 1px;
 928   border-left: #006699 solid 1px;
 929   border-top: #006699 solid 1px;
 930   margin-right: 500px;
 931   margin-bottom: 10px;
 932 }
 933 table.box th, table.box td {
 934   border-bottom: #006699 solid 1px;
 935   font-size: smaller;
 936 }
 937 #source ol {
 938   background:#F6EAD6 none repeat scroll 0 0;
 939   border:1px solid black;
 940   font-family:"Bitstream Vera Sans Mono",monospace;
 941   list-style-position:inside;
 942   list-style-type:decimal;
 943   margin-top:1em;
 944   line-height: 200%;
 945 }
 946 img.inline-badge {
 947   float:left;
 948   margin-left:3em;
 949   padding:12px;
 950 }
 951 pre.badgeSnippet {
 952   margin-bottom:2em;
 953   margin-left:108px;
 954   padding-left:3em;
 955 }
 956
 957 /* Liquid Round theme elements */
 958 #liquid-round {
 959   background-image:url('images/books_top.jpg');
 960   background-repeat:repeat-x;
 961   width:99%;
 962   margin-left:auto;
 963   margin-right:auto;
 964 }
 965
 966 /*
 967 #liquid-round {
 968 background-color:#ffffff;
 969 background-image:url('images/books_top.jpg');
 970 background-repeat:repeat-x;
 971 border:1px solid #000000;
 972 width:97%;
 973 margin-top:.2em;
 974 margin-left:auto;
 975 margin-right:auto;
 976 -moz-border-radius:.8em .8em .8em .8em;
 977 border-radius:.8em .8em .8em .8em;
 978
 979 }
 980 */
 981 .top {
 982   width:100%;
 983   height:15px;
 984 }
 985 .top span {
 986   display:block;
 987   position:relative;
 988   height:20px;
 989 }
 990 .center-content {
 991   position:relative;
 992   padding:1px 0px 1px 0px;
 993   margin:-1px 0 -50px 0;
 994 }
 995 .bottom {
 996   margin-left:auto;
 997   margin-right:auto;
 998   height:60px;
 999 /*  background-image:url('images/trans_logo2.png'); */
1000   background-repeat: no-repeat;
1001   background-position:98% 0%;
1002 }
1003 .bottom span {
1004   display:block;
1005   position:relative;
1006   height:60px;
1007 }
1008
1009 /* Navigation tab style */
1010 div.topnavlistcontainer {
1011   margin-left:-2.5em;
1012 }
1013 .navigation a
1014 {
1015   color: #000;
1016   background-color: #FFFEF0;
1017   text-decoration: none;
1018   padding-left: 1em;
1019   padding-right: 1em;
1020   padding-top: .2em;
1021   padding-bottom: -.1em;
1022   font-weight:700;
1023   text-decoration:underline;
1024   margin-left:.1em;
1025   border-left:1px solid #cccccc;
1026   border-right:1px solid #cccccc;
1027   border-top:1px solid #cccccc;
1028   border-radius:.3em .3em 0em 0em;
1029   -moz-border-radius:.3em .3em 0em 0em;
1030 }
1031 .navigation li
1032 {
1033   list-style: none;
1034   list-style-position:inside;
1035   display: inline-block;
1036   margin: 0;
1037 }
1038 .navigation a:hover
1039 {
1040   color: #fff;
1041   background: #FAEBD7;
1042   text-decoration:underline;
1043   padding-bottom: -.4em;
1044   padding-top: .2em;
1045   padding-bottom: .1em;
1046 }
1047 .navigation a.active
1048 {
1049   background-color:#FAEBD7;
1050   padding-bottom: -.6em;
1051   font-weight:700;
1052   padding-top: .2em;
1053   padding-bottom: .1em;
1054 }
1055 #logo{
1056   float:left;
1057   clear:right;
1058   margin-left:2em;
1059 }
1060 ul.navigation li a:hover, ul.navigation li a:focus, ul.navigation li a.active {
1061   background-color:#FAEBD7;
1062   color: #000000;
1063   text-decoration:none;
1064 }
1065 ul.navigation li a.active{
1066   background-color: #FAEBD7;
1067   padding-right: 10px;
1068 }
1069
1070 /* course search result display */
1071 .results {
1072   margin: 0 16px;
1073   padding-right: 1em;
1074 }
1075 .search_top{
1076   white-space:nowrap;
1077   font-size:.8em;
1078   margin-right:1em;
1079   float:right;
1080 }
1081 #search_text_at_header{
1082   border:1px solid #cccccc;
1083   background-color:#ffffff;
1084   margin-right: .5em;
1085   border-radius:.3em .3em .3em .3em;
1086   -moz-border-radius:.3em .3em .3em .3em;
1087 }
1088 .search_top input[type=submit]{
1089   -moz-border-radius:.2em;
1090   border-radius:.2em;
1091   font-size:8pt;
1092   border:1px solid #cccccc;
1093 }
1094 li.course {
1095
1096   margin:.5em -.5em;
1097 }
1098 ol li{
1099   list-style:none;
1100 }
1101 div.box ol{
1102   list-style:none;
1103   list-style-position:inherit;
1104   padding:0px;
1105   margin:0px;
1106 }
1107 li.mine{
1108   background-image: url('images/my_own_course.gif');
1109   background-repeat: no-repeat;
1110   background-position: 0px 0px;
1111   padding-left: 18px;
1112   line-height:1.5em;
1113 }
1114 div.box ol li.theirs{
1115   list-style-position:outside;
1116   list-style-image: url('images/others_course.png');
1117   list-style-type: disc;
1118   /*list-style: disc inside url("themes/default/images/my_own_course.gif"); */
1119 }
1120 li.theirs{
1121   background-image: url('images/others_course.png');
1122   background-repeat: no-repeat;
1123   background-position: 0px 0px;
1124   padding-left: 18px;
1125   line-height:1.5em;
1126 }
1127 .results h3 {
1128   display:inline;
1129   font-size:small;
1130   font-weight:normal;
1131   margin:0;
1132   padding:0;
1133 }
1134
1135 /* content display */
1136 div#content-text {
1137   padding-right: 5pt;
1138   line-height:150%;
1139 }
1140 div#content-text li {
1141   margin-left: 15pt;
1142 }
1143 div#content-test {
1144   float: left;
1145   margin-top: 2em;
1146   padding-right: 5pt;
1147   width: 80%;
1148 }
1149 div#content-test ol{
1150   margin-right: 5pt;;
1151 }
1152 div#content-test ol ul li{
1153   list-style: none;
1154   padding: 0px 2px 0px 15px;
1155   margin-bottom: 1px;
1156   line-height: 200%;
1157   background-color: #fdfdfd;
1158   border-bottom: 1px solid #efefef;
1159   /* -moz-border-radius: 4px;  */
1160   border: 1px solid #eeeeff;
1161 }
1162 div#content-info {
1163   margin: 5pt;
1164   font-size: small;
1165   color: #b8ae9c;
1166   clear: both;
1167 }
1168 fieldset#shortcuts {
1169   float: right;
1170   background-color: #FEFDEF;
1171   border: 1pt solid #B8AE9C;
1172   margin: -5pt 5pt 5pt 5pt;
1173   padding-right: 10pt;
1174   padding-bottom: 5pt;
1175   padding-left: 10pt;
1176 }
1177 .shortcuts ul {
1178   position: relative;
1179   margin-top: 0pt;
1180   margin-bottom: 0pt;
1181   margin-left: 0pt;
1182   list-style-type:  none;
1183   padding-left: 0pt;
1184 }
1185 div.menuedit{
1186   float:right;
1187   margin-top:-1.2em;
1188 }
1189 .hidden {
1190   display: none;
1191 }
1192 .nowrap {
1193   white-space: nowrap;
1194 }
1195 .clickable {
1196   cursor: pointer;
1197 }
1198
1199 /* Content editor wrapper div */
1200 .editor_wrapper{
1201   border:1px solid #cccccc;
1202   border-radius:.5em;
1203   -moz-border-radius: .5em .5em .5em .5em;
1204   padding: .1em .5em .1em .5em ;
1205 }
1206 /* Content editor tabs */
1207 table.etabbed-table  {
1208   padding-left:.5em;
1209   font-size:10pt;
1210   width: 95%;
1211 }
1212 table.etabbed-table input[type=submit] {
1213   border:0;
1214 }
1215 table.etabbed-table td.tab-spacer {
1216   background-color: transparent;
1217   width: 5px;
1218 }
1219 .editor_buttontab {
1220   color:#000000;
1221   font-size:10pt;
1222   border:0;
1223   white-space: nowrap;
1224   background-color: #ffffff;
1225   margin: 0px;
1226   font-weight:500;
1227   padding:0em 0em .1em 0em;
1228 }
1229 .editor_tab{
1230   border-top: 1px solid #cccccc;
1231   border-left: 1px solid #cccccc;
1232   border-right: 1px solid #cccccc;
1233   border-bottom:0;
1234   margin-bottom:-.5em;
1235   white-space: nowrap;
1236   background-color: #ffffff;
1237   border-radius: .3em .3em 0em 0em;
1238   -moz-border-radius: .3em .3em 0em 0em;
1239   padding: 0em .5em 0em .5em ;
1240   height:1.4em;
1241   width:5%;
1242 }
1243 .editor_tab:hover, .editor_tab input[type=submit]:hover{
1244   background-color:#FAEBD7;
1245 }
1246
1247 .editor_tab_selected{
1248   border-top: 1px solid #cccccc;
1249   border-left: 1px solid #cccccc;
1250   border-right: 1px solid #cccccc;
1251   border-bottom: #FAEBD7;
1252   padding: .0em .5em 0em .5em ;
1253   background-color: #FAEBD7;
1254   font-weight:bold;
1255   white-space: nowrap;
1256   text-decoration:none;
1257   border-radius: .3em .3em 0em 0em;
1258   -moz-border-radius: .3em .3em 0em 0em;
1259   width:5%;
1260   height:1.5em;
1261 }
1262 .editor_tab input[type=submit]{
1263   height:1.2em;
1264 }
1265 .unsaved {
1266   color: red;
1267   background-color: #FFFDE0;
1268   font-weight: bold;
1269   margin-left:.5em;
1270 }
1271 .saved {
1272   background-color: #FFFDE0;
1273   margin: 10px;
1274 }
1275 .shortcut_icon{
1276   border:0;
1277   vertical-align:middle;
1278 }
1279 div.shortcuts{
1280   border-left:1px solid #cccccc;
1281   border-right:1px solid #cccccc;
1282   border-bottom:1px solid #cccccc;
1283   border-radius: 0em 0em .5em .5em;
1284   -moz-border-radius: 0em 0em .5em .5em;
1285   float:right;
1286   margin-right:2em;
1287   padding: 0.1em 0.3em 0.3em 0.5em;
1288   line-height: 1.5em;
1289 }
1290 .shortcuts ul {
1291   position: relative;
1292   margin-top: 0pt;
1293   margin-bottom: 0pt;
1294   margin-left: 0pt;
1295   list-style-type:  none;
1296   padding-left: 0pt;
1297 }
1298 .shortcuts li{
1299   display: inline;
1300 }
1301 dl.form_layout dt{
1302   text-align:center;
1303   float:left;
1304   clear:left;
1305   padding-bottom:.5em;
1306 }
1307 dl.form_layout dd{
1308   margin-left: 12em;
1309   padding-bottom:.5em;
1310 }
1311 ul#content-tool-links {
1312   list-style: none outside none;
1313 }
1314 ul#content-tool-links li{
1315   display: inline;
1316   float: left;
1317   width: 5em;
1318   padding: 0 3em 0 0;
1319   text-align: center;
1320   font-size: 0.7em;
1321   font-weight:bold;
1322   color: #1A4A72;
1323   line-height:120%;
1324 }
1325 ul#content-tool-links img{
1326   border: 0 none;
1327   display: block;
1328   padding-left: 10px;
1329 }
1330 .hidden {
1331   display: none;
1332 }
1333 .clickable {
1334   cursor: pointer;
1335 }
1336 .nowrap {
1337   white-space: nowrap;
1338 }
1339 .selected-sidemenu {
1340   font-weight:bold;
1341   text-decoration:underline;
1342 }
1343 div#alternatives_shortcuts {
1344   float: right;
1345   margin: 0 2em;
1346   border-radius: .5em .5em .5em .5em;;
1347   -moz-border-radius: .5em .5em .5em .5em;
1348   border:1px solid #cccccc;
1349   padding-top: .2em;
1350   padding-left: .2em;
1351   padding-right: .2em;
1352 }
1353 #filesDiv{
1354   width:95%;
1355 }
1356 img.img1616{
1357 height:1.5em;
1358 width:1.5;
1359 }