themes/mobile/android.css

   1 /* Style is optimized for Android 2.2, tested on an HTC Dream device.
   2 Note that -webkit properties create errors in the CSS validator.
   3 Classes beginning with ".fl-" are overriding Mobile FSS,
   4 see the API @ http://wiki.fluidproject.org/display/fluid/Mobile+FSS+API
   5 for more details.
   6 */
   7
   8 html, body{
   9         height: 100%;
  10 }
  11 #main{
  12         padding-bottom:
  13         2.3em;
  14         overflow: auto;
  15 }
  16
  17 body,ul,li {
  18         padding:0;
  19         margin:0;
  20 }
  21
  22 .fl-theme-iphone{
  23         background: white;
  24 }
  25
  26 #header{
  27         width:100%;
  28         height:1.063em;
  29         line-height:2.813em;
  30         padding:0;
  31         font-size:1.063em;
  32 }
  33 #header-section-title {
  34         text-align: center;
  35         background-image: -webkit-gradient(linear, left top, left bottom,
  36         from(#4b6b90),
  37     color-stop(0.5, #6d8cb3),
  38     color-stop(0.50, #4b6b90),
  39     color-stop(0.5, #6d8cb3),
  40     to(#4b6b90)
  41     );
  42
  43
  44 }
  45 .fl-theme-iphone .fl-navbar{
  46         border: none;
  47         border-top: none;
  48 }
  49 .fl-tabs{
  50
  51 }
  52 .fl-navbar a{
  53         font-size: 0.969em;
  54         background-image: -webkit-gradient(linear, left top, left bottom,
  55         from(#4b6b90),
  56     color-stop(0.5, #6d8cb3),
  57     color-stop(0.50, #4b6b90),
  58     color-stop(0.5, #6d8cb3),
  59     to(#4b6b90)
  60     );
  61 }
  62 .fl-navbar .fl-tabs {
  63         padding-top: .3em;
  64         padding-bottom: .3em;
  65         border-top: 1px solid black;
  66         border-bottom: .5px solid black;
  67         background-color: #4b6b90;
  68     height: 2em;
  69 }
  70
  71 #navigation-contentwrapper{
  72         position: relative;
  73         background-color: #4b6b90;
  74         height: 2.5em;
  75 }
  76 #navigation-bar{
  77         height: 2.5em;
  78     border-bottom: .5px solid black;
  79     padding-bottom: .3em;
  80
  81 }
  82 #wrapper{
  83         width:100%;
  84         overflow:hidden;
  85         overflow: auto;
  86         min-height: 100%;
  87 }
  88
  89 #site-name, h1#section-title{
  90         display: inline;
  91         text-shadow: none;
  92         font-size: 90%;
  93         color: #4C566C;
  94         color: white;
  95 }
  96 /*this CSS creates a button that looks exactlty like a Mobile FSS tab.*/
  97 .navigation-bar-button{
  98     border-width:5px;
  99     -webkit-border-radius: 5px;
 100         font-size: 18px;/*keep this in px*/
 101         padding: 0 .3em;
 102         color: white;
 103         position: relative;
 104         top: .69em;
 105         left: 0.188em;
 106     /* Default mobile fss color scheme for tabs not AA compliant. Here is a compliant bg image: */
 107     background-image: -webkit-gradient(linear, left top, left bottom,
 108         from(#3b5371),
 109         color-stop(0.5, #374e6b),
 110         color-stop(0.50, #354d68),
 111         to(#354d68)
 112     );
 113         -webkit-border-image: url(images/navbar_normal_button_insetShadow.png) 5 5 5 5 stretch;
 114     -webkit-border-left-image: none;
 115     -webkit-background-origin: border;
 116     -webkit-background-clip: border;
 117     /* To mimick the mobile FSS scolor scheme (iphone) uncomment these lines
 118         background-image: -webkit-gradient(linear, left top, left bottom,
 119         from(#9aafca),
 120         color-stop(0.5, #6d8cb3),
 121         color-stop(0.50, #4b6b90),
 122         to(#4b6b90)
 123     );*/
 124 }
 125
 126 .fl-theme-iphone .fl-tabs li{
 127     /* default mobile fss color scheme for tabs not AA compliant against a white foreground text.therefore its backgroud-image must be overrided */
 128     background-image: -webkit-gradient(linear, left top, left bottom,
 129         from(#3b5371),
 130         color-stop(0.5, #374e6b),
 131         color-stop(0.50, #354d68),
 132         to(#354d68)
 133     );
 134 }
 135
 136 div#content-link-container{
 137         background-color:#F5F5F5;
 138         padding:.375em;
 139         border: #A9ADB0 solid 1px;
 140         -webkit-border-radius: 2px;
 141 }
 142 #content_link{
 143         display: block;
 144 }
 145 #home-guide{
 146         position: absolute;
 147         top: .45em;
 148         right: 0.188em;
 149         font-size: 17px;/*keep this in px*/
 150         white-space:nowrap;
 151         display: inline;
 152
 153 }
 154 /* main body attributes */
 155 p {
 156     text-align: left;
 157     line-height: 150%;
 158         font-size: 1em;
 159         padding:.75em 0;
 160         margin: 0 auto;
 161 }
 162
 163 p a {
 164     text-decoration: underline;
 165 }
 166
 167 p a:visited {
 168         color: #3F2670;
 169     background-color: transparent;
 170 }
 171 p a:active {
 172         color: #A50707;
 173     background-color: transparent;
 174 }
 175
 176 h1, h2, h3, h4, h5, h6 {
 177     color: #4C566C;
 178     clear: right;
 179     font: 100% Verdana, Helvetica, Arial, sans-serif;
 180         font-weight: bold;
 181     margin: 0;
 182         padding: 0;
 183 }
 184
 185 h1 {
 186     font-size: 160%;
 187         color: #FFF;
 188 }
 189
 190 h2 {
 191     font-size: 150%;
 192 }
 193 h2.sidebox{
 194     font-size: 110%;
 195 }
 196 h3 {
 197     font-size: 130%;
 198         padding: 0;
 199 }
 200 h3.browse-courses{
 201         font-size: 90%;
 202         text-decoration: none;
 203         clear: none;
 204         display: inline;
 205 }
 206 h3 a {
 207     font-size: 100%;
 208 }
 209 h4 {
 210     font-size: 120%;
 211 }
 212
 213
 214 h5 {
 215     font-size: 100%;
 216 }
 217
 218
 219
 220 /* Preferences tabs */
 221 .etabbed-list-container {
 222         padding:0;
 223         margin: 0;
 224         font-size:inherit;
 225         width:70%;
 226         clear: left;
 227         height: 3em;
 228 }
 229
 230 .prefs_buttontab {
 231         padding:0;
 232         margin: 0;
 233         color: #4C566C;
 234         white-space: nowrap;
 235         background-color: #ffffff;
 236         margin-bottom: .5px;
 237         border:0;
 238         font-weight:500;
 239         text-decoration: underline;
 240 }
 241 .prefs_tab{
 242         padding:0.7em 0 0;
 243         margin: 0;
 244         white-space: nowrap;
 245     display: inline;
 246 }
 247
 248 .prefs_tab_selected{
 249         padding:0.9em 0 0;
 250         margin: 0;
 251         margin: 0px;
 252         font-weight:bold;
 253         text-align:center;
 254         white-space: nowrap;
 255     display: inline;
 256 }
 257
 258
 259 /*  Table of content attributes*/
 260 p.toc{
 261         font-family: Verdana, Helevetica, Arial, sans-serif;
 262         background-color: #E9F4F3;
 263         padding: .6em;
 264         margin-bottom: .6em;
 265         margin-top: 0em;
 266         margin-left: 1em;
 267         margin-right: 3em;
 268         border: 1px #ACCFCC solid;
 269 }
 270
 271
 272 /* link attributes */
 273 a:link, a:visited  {
 274         color: #4C566C;
 275         text-decoration: underline;
 276 }
 277 a:hover {
 278         color: #4C566C;
 279         text-decoration: underline;
 280 }
 281 a:active {
 282         color: #ffffff;
 283         text-decoration: underline;
 284 }
 285 /* align text to the left */
 286 .left {
 287         text-align: left;
 288 }
 289
 290 a.dropdown-title {
 291         color: white;
 292         font-weight: normal;
 293         text-decoration: none;
 294 }
 295
 296
 297 /* table border */
 298 .tableborder {
 299         border: 1px #595241 solid;
 300 }
 301
 302 /* main submit button */
 303 .button {
 304         background-color: #808080;
 305         font-weight: normal;
 306         color: black;
 307         text-align: center;
 308         -webkit-border-radius:3px;
 309         padding-top: 0.313em;
 310         padding-bottom: 0.313em;
 311
 312 }
 313 .button:focus {
 314         border:1px solid #A50707;
 315         background-color:  #FFDAB9;
 316 }
 317 /* small submit button at top */
 318 .button2 {
 319         font-family: Verdana, Helevetica, Arial, sans-serif;
 320         background-color: #E9F4F3;
 321
 322 }
 323 .button2:focus {
 324         background-color: #E9F4F3;
 325         border:  #ACCFCC  solid 1px;
 326 }
 327
 328 /* date attributes */
 329 small.date {
 330         font-family: Verdana, Helevetica, Arial, sans-serif;
 331         color: #595241;
 332         margin-bottom: 0;
 333         margin-top: 0;
 334         margin-left: 0.313em;
 335         margin-right: 0;
 336         font-size:1em;
 337 }
 338
 339 /* page breakline */
 340 hr {
 341         color: #ACCFCC;
 342         background-color: white;
 343         height: .063em;
 344 }
 345
 346 /* message box styles */
 347
 348 /* Editor box small */
 349 .editorsmallbox {
 350         font-family: Verdana, Helevetica, Arial, sans-serif;
 351         background-color: #E9F4F3;
 352         padding: 0.125em;
 353         padding-right: .188em;
 354         border: 1px #ACCFCC solid;
 355 }
 356
 357 /* Editor box large */
 358 .editorlargebox {
 359         font-family: Verdana, Helevetica, Arial, sans-serif;
 360         background-color: #E9F4F3;
 361         margin-left:1em;
 362         padding-left: .2em;
 363         padding-right: .5em;
 364         padding-top: .5em;
 365         padding-bottom: .4em;
 366         border: 1px #ACCFCC solid;
 367 }
 368
 369
 370 select.dropdown {
 371         font-family: Verdana, Helevetica, Arial, sans-serif;
 372 }
 373
 374 .highlight, a.highlight {
 375         background-color: #5B8E88;
 376         color: white;
 377 }
 378
 379 a .highlight{
 380         background-color: #5B8E88;
 381         color: white;
 382 }
 383
 384 .center {
 385         text-align: center;
 386 }
 387
 388
 389 /* edit content tabs */
 390 .buttontab {
 391         background-color: #E6E6E6;
 392         font-weight: 500;
 393         border:0;
 394         padding-left: .188em;
 395         padding-right: .188em;
 396         padding-top: .188em;
 397
 398 }
 399
 400 .tab {
 401         color: black;
 402         background-color: #E6E6E6;
 403         border-top: 1px #B8AE9C solid;
 404         border-left: 1px #B8AE9C solid;
 405         border-right: 1px #B8AE9C solid;
 406         text-decoration: none;
 407         text-align: center;
 408         font-weight: bold;
 409
 410
 411 }
 412 .buttontab selected {
 413         font-family: Helvetica, Arial, Helvetica, sans-serif;
 414         background-color: #6F7172;
 415         font-weight: 600;
 416         border:0;
 417         padding-left: .188em;
 418         padding-right: .188em;
 419         padding-top: .188em;
 420
 421 }
 422 td.selected{
 423         font-family: Helvetica, Arial, Helvetica, sans-serif;
 424         font-weight: 600;
 425         text-decoration: none;
 426         text-align: center;
 427         background-color: white;
 428         border-top: 1px #B8AE9C solid;
 429         border-left: 1px #B8AE9C solid;
 430         border-right: 1px #B8AE9C solid;
 431 }
 432 .econtainer{
 433         background-color: #fffaf0;
 434         border:1px #6F7172 solid;
 435         margin-left:.5em;
 436 }
 437
 438 .tab a:link, .etab a:visited {
 439         color: black;
 440         background-color: white;
 441
 442 }
 443 .tab a:hover {
 444         color: black;
 445         background-color: white;
 446 }
 447
 448 .etabself {
 449         background-color: #6F7172;
 450
 451         text-align: center;
 452         font-weight: bold;
 453         padding: 0.125em;
 454 }
 455
 456
 457 .unsaved {
 458         color: red;
 459         background-color: #FFFDE0;
 460         font-weight: bold;
 461 }
 462 .saved {
 463         background-color: #FFFDE0;
 464         margin: 0.625em;
 465 }
 466
 467
 468
 469 /* the side menu */
 470 /* the side menu heading */
 471 td.dropdown-heading {
 472         background-color: #DBFDD4;
 473         color: #595241;
 474         border-left: 1px solid #ECFEEA;
 475         border-right: 1px solid #ECFEEA;
 476         border-top: 1px solid #ECFEEA;
 477         font-weight: bold;
 478         padding: 0.125em;
 479 }
 480
 481 td.dropdown-heading a, td.dropdown-heading a:hover, td.dropdown-heading a:visited {
 482         text-decoration: none;
 483 }
 484
 485 td.dropdown-heading.closed {
 486         border-bottom: 1px solid #ECFEEA;
 487 }
 488
 489 /* the side menu content */
 490 td.dropdown {
 491         padding: 0.125em;
 492         background-color: white;
 493         color: black;
 494         border-left: 1px solid #ECFEEA;
 495         border-right: 1px solid #ECFEEA;
 496         border-bottom: 1px solid #ECFEEA;
 497         font-weight: normal;
 498 }
 499 td.dropdown a, td.dropdown a:visited  {
 500         color: #595241;
 501         text-decoration: none;
 502 }
 503 td.dropdown a:hover {
 504         color: #595241;
 505         text-decoration: underline;
 506 }
 507 td.dropdown.cell {
 508         border-bottom: 0;
 509 }
 510 td.dropdown strong {
 511         color: #2A6C28;
 512 }
 513
 514 /* added for 1.4.2: */
 515 .results {
 516         padding-left: 1.25em;
 517 }
 518
 519 h5.search-results {
 520         padding: 0.063em;
 521         margin-bottom: 0.313em;
 522         margin-top: 1em;
 523         padding-top: 3em;
 524         margin-left: 0.313em;
 525 }
 526
 527 small.search-info {
 528         color: #595241;
 529 }
 530
 531 p.search-description {
 532         background-color: #FFFCE5;
 533         color: #595241;
 534 }
 535
 536 .test-box {
 537         background-color: #F7F3ED;
 538         color: #595241;
 539         border-left: 1px solid #595241;
 540         border-right: 1px solid #595241;
 541         border-top: 1px solid #595241;
 542         font-weight: bold;
 543         padding: 0.125em;
 544 }
 545
 546 /* preferences */
 547
 548 .input-form{
 549         width: 100%;
 550 }
 551 .input-form
 552 table.tabbed-table {
 553         width: 100%;
 554         border:thin black solid;
 555 }
 556 table.tabbed-table th#left-empty-tab {
 557         background-color: transparent;
 558         width: 0.938em;
 559         border-bottom: 1px solid #B8AE9C;
 560 }
 561 table.tabbed-table th#right-empty-tab {
 562         text-align: right;
 563         background-color: transparent;
 564         border-bottom: 1px solid #B8AE9C;
 565         width: 25em;
 566         padding-right: 0.313em;
 567 }
 568 table.tabbed-table th#right-empty-tab a {
 569         text-decoration: underline;
 570 }
 571 table.tabbed-table th.tab-spacer {
 572         background-color: transparent;
 573         width: 0.313em;
 574         border-bottom: 1px solid #B8AE9C;
 575 }
 576
 577 table.tabbed-table th.tab {
 578         padding-top: 0.125em;
 579         padding-bottom: 0.125em;
 580         width: 6.875em;
 581         background-color: #E9F4F3;
 582         border-bottom: 1px solid #B8AE9C;
 583         border-left: 1px solid #B8AE9C;
 584         border-top: 1px solid #B8AE9C;
 585         border-right: 1px solid #B8AE9C;
 586 }
 587 table.tabbed-table th.tab:hover {
 588         background-color: #ACCFCC;
 589 }
 590
 591 table.tabbed-table th.tab a:focus {
 592         color: white;
 593 }
 594 table.tabbed-table th.selected {
 595         padding-top: 0.125em;
 596         padding-bottom: 0.125em;
 597         width: 6.875em;
 598         background-color: #ACCFCC;
 599         border-left: 1px solid #B8AE9C;
 600         border-top: 1px solid #B8AE9C;
 601         border-right: 1px solid #B8AE9C;
 602 }
 603
 604 table.tabbed-table a, table.tabbed-table a:visited, table.tabbed-table a:hover {
 605         color: black;
 606         text-decoration: none;
 607 }
 608 .preference-buttons-container{
 609         background-color: red;
 610         height: 2.5em;
 611         width: 100%;
 612         text-align: center;
 613 }
 614
 615 div.preference-buttons-container li{
 616         display: inline;
 617         float: right;
 618 }
 619
 620 .etabbed-table{
 621         margin: 0 auto;
 622 }
 623 #previewText{
 624         font-family: monospace;
 625         border: 2px solid rgb(0, 0, 0);
 626         padding: 2em;
 627         width: 80%;
 628         color: rgb(255, 255, 255);
 629         background-color: rgb(0, 0, 0);
 630 }
 631 #previewArea{;
 632         padding: 0em;
 633         border-bottom-width: 0;
 634         margin-left: auto;
 635         margin-right: auto;
 636         font-weight: normal;
 637         width: 70%;
 638         float:left;
 639         clear:right;
 640 }
 641 #display-settings-preview{
 642         width:90%;
 643         height:20em;
 644         margin: 0 auto;
 645 }
 646 #feedback{
 647         width: 90%;
 648 }
 649 #defaultfontsize-wrapper{
 650         width:90%;
 651 }
 652
 653 /* end of preferences */
 654
 655 a#my-start-page {
 656         padding: 0.125em;
 657         padding-left:  0.938em;
 658         background-repeat: no-repeat;
 659         background-position: 0.125em 0.313em;
 660 }
 661
 662 a#back-to {
 663         padding-left: 1.25em;
 664         background-image: url(images/back.gif);
 665         background-repeat: no-repeat;
 666         background-position: 0 0;
 667 }
 668
 669 .breadcrumbs, .previous-next /*a#guide*/{
 670     /* The path bar, including breadcrumbs and add to favorites */
 671         clear:both;
 672     font-size: 0.85em;
 673         padding:0 0.375em;
 674         color: #4C566C;
 675         background-color: white;
 676
 677 }
 678 #breadcrumbs-container{
 679         background-color: #4d4d4d;
 680         position: relative;
 681 }
 682 .breadcrumbs{
 683         display:none;
 684 }
 685 h2.page-title {
 686         padding-top: .5em;
 687         margin-top: .5em;
 688 }
 689 h1 {
 690         margin-bottom: 0.313em;
 691
 692 }
 693
 694
 695 div#help {
 696         border-left: 1px solid black;
 697         border-right: 1px solid black;
 698         border-bottom: 1px solid black;
 699         padding-left: 0.313em;
 700         padding-right: 0.313em;
 701         padding-bottom: 0.313em;
 702         background-color: #F7F3ED;
 703         margin-left: 0.313em;
 704         margin-right: 0.313em;
 705         font-size: small;
 706 }
 707
 708 h3#help-title {
 709         margin-left: 0.313em;
 710         margin-right: 0.313em;
 711         border-left: 1px solid black;
 712         border-right: 1px solid black;
 713         padding: 0.063em;
 714         background-color: #F7F3ED;
 715 }
 716 .line {
 717         border-bottom: 1px solid black;
 718 }
 719 div#help p {
 720         padding: 0;
 721         margin: 0;
 722 }
 723
 724 div#toctoggle {
 725         float: left;
 726         padding-left: 0.625em;
 727 }
 728
 729 h1#section-title {
 730         font-size: 90%;
 731 }
 732
 733 div#top-links {
 734         margin: 0 auto;
 735         font-size: .938em;
 736 /* moved inside of #footer for mobile theme */
 737 }
 738 #footer{
 739         /*width:100%;*/
 740         height:2.3em;
 741         background-color: #4b6b90;
 742         margin-top: -2.3em;
 743         position: relative;
 744         clear: both;
 745
 746 }
 747
 748 div#top-links a:link, div#top-links a:visited {
 749         text-decoration:none;
 750 }
 751 div#top-links a:focus{
 752         /*color:black;
 753         background-color:#F6EAD6;*/
 754 }
 755
 756 #jumpmenu:focus{
 757         background-color:#F6EAD6;
 758 }
 759 #jumpmenu{
 760         margin: 0 auto;
 761 }
 762
 763 a#editor-link {
 764         background-color: #F7F3ED;
 765         padding-top: 0.063em;
 766         padding-bottom: 0.063em;
 767         padding-left:  0.938em;
 768         padding-right: 0.5em;
 769         border: 1px solid #cccccc;
 770         font-weight: normal;
 771         text-decoration: none;
 772 }
 773
 774 a#editor-link:hover {
 775         background-color: #F7F3ED;
 776         border: 1px solid #B8AE9C;
 777 }
 778
 779 a#editor-link.off {
 780         background-image: url(images/pen.gif);
 781         background-repeat: no-repeat;
 782         background-position: 0 0.125em;
 783 }
 784 a#editor-link.on {
 785         background-image: url(images/pen2.gif);
 786         background-repeat: no-repeat;
 787         background-position: 0 0.125em;
 788 }
 789
 790
 791 /* for data tables */
 792 table.data {
 793         width: 95%;
 794         margin: 0 auto;
 795         padding: 0;
 796         color: black;
 797         text-align: left;
 798         -webkit-border-radius:5px;
 799         border: #6D7B8D 1px solid;
 800
 801 }
 802 /* contains the headings */
 803 table.data th {
 804
 805         padding: 0.188em;
 806 }
 807
 808 table.data th a {
 809         color: #595241;
 810         background-image: url('../default/images/sort.gif');
 811         background-repeat: no-repeat;
 812         background-position: right;
 813 }
 814
 815 table.data tbody {
 816         border-top: 1px solid #B8AE9C;
 817         border-bottom: 1px solid #B8AE9C;
 818 }
 819 /*headings text*/
 820 table.data tbody th {
 821         text-align: left;
 822
 823 }
 824
 825 table.data td {
 826         padding: 0.188em;
 827         color: black;
 828         font-size: .875em;
 829         font-style: normal;
 830 }
 831 table.data td a:link, a:visited{
 832         color: black;
 833 }
 834 table.data tbody tr:hover {
 835         background-color: #efefef;
 836         cursor: pointer;
 837 }
 838
 839 table.data tbody tr.selected {
 840         background-color: #E9F4F3;
 841         cursor: auto;
 842 }
 843
 844 table.data tfoot {
 845         background-color: #F7F3ED;
 846 }
 847
 848 table.data tfoot tr:first-child td {
 849         padding: 0.313em;
 850         background-image: url('images/arrow_ltr.gif');
 851         background-repeat: no-repeat;
 852         background-position: .25em 0.313em;
 853 }
 854
 855 table.data.static tfoot td, table.data.static tfoot tr:first-child td {
 856         border-top: 1px solid #B8AE9C;
 857         padding: 0.313em;
 858         background-image: none;
 859         padding-left: 0;
 860
 861 }
 862 /* add borders to row in Required Information, Personal Information*/
 863 .row{
 864         padding:.375em 0;
 865         border-bottom: 1px #cccccc solid;
 866         font-size: 0.938em;
 867 }
 868 #last-row, .row-buttons, #last-row1, .row-blurb{
 869         border: none;
 870 }
 871 #browse-courses-table{
 872         font-size: .875em;
 873 }
 874
 875
 876 /*buttons*/
 877 table.data tfoot input {
 878         background-color: #efefef;
 879         font-weight: normal;
 880         border:  #AAA  solid 1px;
 881 }
 882 table.data tfoot input:focus {
 883         background-color: #FFDAB9;
 884         border:  #AAA  solid 1px;
 885 }
 886
 887
 888 /* used for static tables with no form elements: */
 889 table.data.static tbody tr:hover {
 890         background-color: transparent;
 891         cursor: auto;
 892 }
 893
 894
 895
 896 /* course browser: */
 897
 898 div#browse {
 899         margin-left: auto;
 900         margin-right: auto;
 901         width: 80%;
 902 }
 903
 904 div.browse-selected {
 905         background-image: url('images/side_arrow.gif');
 906         background-repeat: no-repeat;
 907         padding-left: 0.563em;
 908         background-position: center left;
 909 }
 910
 911 div.browse-unselected {
 912         padding-left: 0.563em;
 913 }
 914
 915 ul.browse-list {
 916         list-style: none;
 917         padding:0;
 918 }
 919
 920 /* feedback /errors */
 921 div#error {
 922         width: 89%;
 923         margin-left: auto;
 924         margin-right: auto;
 925         margin-top:  0.938em;
 926         margin-bottom:  0.938em;
 927         border: 1px solid #DD0000;
 928         padding: 0.313em;
 929         background-color: #F4DCDC;
 930         color: #A50707;
 931         background-color: #F4DCDC;
 932         padding-left: 1.563em;
 933         font-weight: bold;
 934         -webkit-border-radius:5px;
 935 }
 936 div#error h4 {
 937         color: black;
 938         margin-left: 0;
 939 }
 940
 941 div#error ul, div#feedback ul, div#help ul {
 942         position: relative;
 943         list-style: none;
 944         margin-left: 0;
 945         padding-left: 0;
 946 }
 947
 948 div#error ul li{
 949         margin-top: 0.313em;
 950 }
 951
 952 div#feedback, div#info {
 953         width: 95%;
 954         margin-left: auto;
 955         margin-right: auto;
 956         margin-top: 0.313em;
 957         padding-left: 0.313em;
 958         padding-right: 0.313em;
 959         font-family: Helvetica, Arial, sans-serif;
 960         -webkit-border-radius:5px;
 961         border: 1px solid #17B506;
 962         background-color: #E7EFD0;
 963         color: #3f4559;
 964         font-size: 90%;
 965         z-index: -1;
 966 }
 967 div#feedback li, div#info li, div#error li{
 968         color: #4C566C;
 969         z-index: -1;
 970 }
 971
 972 div#help {
 973         width: 95%;
 974         margin-left: auto;
 975         margin-right: auto;
 976         margin-top:  0.938em;
 977         margin-bottom:  0.938em;
 978         border: 1px solid #ACCFCC;
 979         padding: 0.313em;
 980         background-color: #E9F4F3;
 981         color: #024C41;
 982 }
 983 /*
 984 div#info {
 985         width: 50%;
 986         margin-left: auto;
 987         margin-right: auto;
 988         margin-top:  0.938em;
 989         margin-bottom:  0.938em;
 990         border: 1px solid #B8AE9C;
 991         padding: 0.313em;
 992         background-color: #EFE6FF;
 993         color: #595241;
 994         font-weight: bold;
 995 } */
 996
 997 div#warning {
 998         width: 95%;
 999         margin-left: auto;
1000         margin-right: auto;
1001         margin-top:  0.938em;
1002         margin-bottom:  0.938em;
1003         border: 1px solid #FF8400;
1004         padding: 0.313em;
1005         background-color: #FFF6ED;
1006         color: #D95900;
1007         font-weight: bold;
1008 }
1009 acronym {
1010         cursor: help;
1011 }
1012
1013 div.news p {
1014         margin: 0;
1015         padding:0;
1016 }
1017 div.news span.date {
1018         font-family:Helevetica, Arial, sans-serif;
1019         color: #4C566C;
1020 }
1021
1022 .news{
1023         padding: 0;
1024 }
1025 /* home page links */
1026 div.home-link {
1027         padding: 0.125em;
1028         float: left;
1029         text-align: center;
1030         margin: 0.125em;
1031         width: 7.5em;
1032         height: 5.625em;
1033 }
1034 div.home-link:hover {
1035         padding: 0.063em;
1036         background-color: #F7F3ED;
1037         border: 1px solid #afafaf;
1038         float: left;
1039         text-align: center;
1040         margin: 0.125em;
1041 }
1042 div.home-link a {
1043         text-decoration: none;
1044         font-weight: bold;
1045 }
1046
1047 div.home-link img {
1048         border: 0;
1049 }
1050
1051 /* sequence links */
1052 div#sequence-links {
1053
1054         margin-top: 0.625em;
1055         padding-right: 0.313em;
1056         padding-top:0.438em;
1057 }
1058 div#sequence-links a {
1059         text-decoration: none;
1060         display: block;
1061 }
1062
1063 .previous-next{
1064         display: block;
1065 }
1066 div.dropdown {
1067         width: 12.5em;
1068         padding: 0.125em;
1069         background-color: white;
1070         color: black;
1071         border-left: 1px solid #ECFEEA;
1072         border-right: 1px solid #ECFEEA;
1073         border-bottom: 1px solid #ECFEEA;
1074         font-weight: normal;
1075 }
1076
1077 div.dropdown-heading {
1078         background-color: #ACCFCC;
1079         color: #595241;
1080         border-left: 1px solid #ECFEEA;
1081         border-right: 1px solid #ECFEEA;
1082         border-top: 1px solid #ECFEEA;
1083         font-weight: bold;
1084         padding: 0.125em;
1085 }
1086
1087 div.required {
1088         font-weight: bold;
1089         color: red;
1090         font-size: large;
1091         float: left;
1092         position: relative;
1093         margin-top: -0.313em;
1094         height:  0.938em;
1095         padding-right: 0.125em;
1096 }
1097
1098 div#content_text {
1099         margin-left: 0.313em;
1100 }
1101 /*needs to be set to display: none so drawer can open */
1102 #content{
1103         display: none;
1104         padding-top:.5em;
1105         margin-top: .5em;
1106         background-color: #F5F5F5;
1107 }
1108 form {
1109         display:inline;
1110         max-width: 100%;
1111 }
1112
1113
1114 optgroup {
1115         /*font-size: small;*/
1116 }
1117
1118 /* paging*/
1119 div.paging {
1120
1121 }
1122 div.paging ul {
1123     list-style: none;
1124     display: inline;
1125     padding: 0;
1126         max-width: 10%;
1127         margin-bottom: 1em;
1128 }
1129 div.paging li {
1130         float: left;
1131         display: inline;
1132         padding-left: 0.125em;
1133         padding-right: 0.125em;
1134         padding-top: 0;
1135         padding-bottom: 0;
1136         width: 10%;
1137 }
1138
1139 div.paging li a {
1140         text-decoration: none;
1141         padding-left: 0.25em;
1142         padding-right: 0.25em;
1143         border-left: 1px solid white;
1144         border-right: 1px solid white;
1145 }
1146
1147 div.paging li a:hover, div.paging li a.current {
1148    background-color: #5B8E88;
1149    border-left: 1px solid #000;
1150    border-right: 1px solid #000;
1151    color: white;
1152 }
1153
1154 #tl_corner{
1155
1156         background-image:url(images/tl_corner.gif);
1157         background-position: top left;
1158         background-repeat: no-repeat;
1159         padding:0;
1160 }
1161 div.top {
1162     /* Top space
1163     background-color: #595241;
1164         color: #FFF;
1165     margin: 0;
1166     padding: 0;
1167         padding-top:0.563em; */
1168 }
1169 div.tabs {
1170         /* Navigational Plone Tabs */
1171     background-color: transparent;
1172         border-collapse: collapse;
1173         border-bottom: 1px solid #B8AE9C;
1174         padding: 0.5em 0em 0em 2em;
1175         white-space: nowrap;
1176 }
1177
1178 div.tabs a {
1179     /* The normal, unselected tabs. They are all links */
1180     background-color: transparent;
1181     border-color: #B8AE9C;
1182     border-width: 1px;
1183     border-style: solid solid none solid;
1184     color: #595241;
1185     height: 1.2em;
1186     margin-right: 0.5em;
1187     padding: 0em 2em 0em;
1188
1189 }
1190
1191 div.tabs a.selected {
1192     /* The selected tab. There's only one of this */
1193     background-color: white;
1194     border-bottom: #B8AE9C 1px solid;
1195     color: #595241;
1196     font-weight: normal;
1197 }
1198
1199 div.tabs a:hover, div.tabs a.active {
1200     background-color: #B8AE9C;
1201     border-bottom: 1px solid #B8AE9C;
1202     color: white;
1203 }
1204
1205 .headingbox a{
1206         color: #4C566C;
1207         text-decoration:underline;
1208 }
1209 div.box {
1210 }
1211 h4.box {
1212         background-color: #F5F5F5;
1213         padding: .313em;
1214 }
1215 h4.box a {
1216         display: block;
1217         color: #4C566C;
1218         background-color: #F5F5F5;
1219         text-decoration: none;
1220 }
1221 .content-expand {
1222         background-image:url("images/content-arrow-down.png");
1223         background-position: top right;
1224         background-repeat: no-repeat;
1225 }
1226 .content-closed{
1227         background-image:url("images/content-arrow-up.png");
1228         background-position: center right;
1229         background-repeat: no-repeat;
1230 }
1231
1232 div.box {
1233         padding: 0.313em;
1234         background-color: #F5F5F5;
1235         color: black;
1236         border: 1px solid #B8AE9C;
1237         font-size:0.85em;
1238         font-weight: normal;
1239         padding:0.125em;
1240 }
1241
1242 h5.box {
1243     background-color: #6F7172;
1244     border: 1px solid #B8AE9C;
1245     border-style: solid solid none solid;
1246     color: Black;
1247     padding: 0em 1em 0em 1em;
1248     display: inline;
1249         font-size:  1em;
1250     height: 1em;
1251 }
1252
1253 div.box a:link {
1254         text-decoration: none;
1255 }
1256
1257 div.box a:visited {
1258         color: #2A6C28;
1259         text-decoration: none;
1260 }
1261
1262 div.box a:hover {
1263         text-decoration: underline;
1264 }
1265
1266 .boxDetails {
1267     text-align: right;
1268 }
1269
1270 div.box .content {
1271     padding: 1em;
1272         font-size:  1em;
1273 }
1274
1275 div.box a.close {
1276     float: right;
1277     text-transform: none;
1278     border-left: 1pt solid #B8AE9C;
1279     padding: 0em 0.2em;
1280 }
1281
1282 div.box h1,
1283 div.box h2,
1284 div.box h3,
1285 div.box h4 {
1286     margin: 0;
1287     padding: 0;
1288 }
1289
1290 div.box .even {
1291     background-color: #F7F3ED;
1292 }
1293
1294 div.box .odd {
1295     background-color: transparent;
1296 }
1297
1298
1299 /* users/index.php */
1300
1301 div.course {
1302         position: relative;
1303         width: 12.5em;
1304         height: 10.5em;
1305         border: rgb(204, 204, 204) 1px solid;
1306         background-color: #F7F7F7;
1307         float: left;
1308         margin: 0.188em;
1309         padding: 0.313em;
1310 }
1311
1312 div.course.break {
1313         clear: left;
1314 }
1315
1316 div.course h2 {
1317         border: 0;
1318         font-weight: normal;
1319         font-size: large;
1320
1321 }
1322
1323 div.course:hover {
1324         background-color:#FBF4E9;
1325         border: #B8AE9C 1px solid;
1326 }
1327
1328
1329 table.data .odd img.headicon{
1330         width: 2.469em;
1331         height: 2.469em;
1332         -webkit-border-radius:5px;
1333 }
1334
1335 .icon{
1336         -webkit-border-radius:10px;
1337         border-color: white;
1338         width: 2.5em;
1339         height: 2.5em;
1340         float: left;
1341 }
1342 div.course div.shortcuts {
1343         text-align: right;
1344         clear: left;
1345         vertical-align: middle;
1346         width: 12.5em;
1347 }
1348
1349 fieldset#shortcuts {
1350         float: right;
1351         background-color: #FEFDEF;
1352         border: 1pt solid #B8AE9C;
1353         margin: -5pt 5pt 5pt 5pt;
1354         padding-right: 10pt;
1355         padding-bottom: 5pt;
1356         padding-left: 10pt;
1357 }
1358
1359 .shortcuts{
1360
1361 }
1362
1363 fieldset {
1364         margin-bottom: 10pt;
1365         -webkit-border-radius:5px;
1366         padding: 0 0.375em;
1367         width: 90%;
1368         margin: 0 auto;
1369         width:95%;
1370         margin:0 auto;
1371         border:thin #6D7B8D solid;
1372         margin-bottom: 1em;
1373 }
1374 #shortcuts legend {
1375 }
1376 #shortcuts ul {
1377         position: relative;
1378         margin-top: 0pt;
1379         margin-bottom: 0pt;
1380         margin-left: 0pt;
1381         list-style-type:  none;
1382         padding-left: 0pt;
1383 }
1384
1385 /*a#guide,*/ a#my-courses-link {
1386         background-color: #6D84A2;
1387 }
1388
1389 #guide img{
1390         border:none;
1391 }
1392
1393 #guide a:hover{
1394
1395 }
1396 div#content-text {
1397         padding-right: 5pt;
1398         line-height:150%;
1399 }
1400
1401 div#content-text li {
1402         margin-left: 15pt;
1403 }
1404
1405 div#content-test, div.content-from-module {
1406         float: left;
1407         margin-top: 2em;
1408         margin-bottom: 2em;
1409         padding-right: 5pt;
1410         width: 80%;
1411 }
1412 div#content-test ol{
1413         margin-right: 5pt;;
1414 }
1415
1416 div#content-test ol ul li{
1417         list-style: none;
1418         padding: 0 0.125em 0  0.938em;
1419         margin-bottom: 0.063em;
1420         line-height: 200%;
1421         background-color: #fdfdfd;
1422         border-bottom: 1px solid #efefef;
1423         border: 1px solid #eeeeff;
1424 }
1425
1426 div#content-info {
1427         margin: 5pt;
1428         font-size: small;
1429         color: #b8ae9c;
1430         clear: both;
1431 }
1432
1433 div#container {
1434         text-align: left;
1435         margin: 0 auto;
1436         padding: 0;
1437         border:0;
1438         width: 95%;
1439 }
1440
1441 div#menutoggle{
1442         text-align: right;
1443         padding-bottom: 0.625em;
1444         padding-right: 0.625em;
1445         float: left;
1446         margin-top: 0.625em;
1447         padding-right: 0.313em;
1448         font-size:0.95em;
1449 }
1450
1451
1452 /* login page */
1453 div.column {
1454         float: left;
1455         width: 45%;
1456         margin: 0.313em;
1457         min-width: 10.625em;
1458 }
1459
1460 div.column h3 {
1461         background-color: #F6EAD6;
1462         border-bottom: .05em solid #6F7172;
1463         font-size: small;
1464         display:block;
1465         color:black;
1466         font-weight:600;
1467         padding-left:0.5em;
1468 }
1469
1470 div.insidecol {
1471    min-height: 10.625em;
1472    height: 10.625em;
1473    padding:0.313em;
1474 }
1475
1476
1477 /* index page */
1478 ul#home-links, ul#home-detail-links {
1479         list-style: none;
1480 }
1481 ul#home-links li {
1482
1483         display: inline;
1484         float: left;
1485         padding: 0.8em;
1486         text-align: center;
1487         margin: 0.1em;
1488         width: 8.5em;
1489         height: 7.0em;
1490         padding-left:0;
1491
1492 }
1493 ul#home-links li a {
1494         text-decoration: none;
1495         border: 1px transparent;
1496         font-weight: bold;
1497 }
1498 ul#home-links li a img {
1499         border: 0;
1500         display: block;
1501         padding-left:1.563em;
1502 }
1503
1504 /*my start page */
1505 #my_courses_container{
1506         text-align: left;
1507         margin: 0 auto;
1508         border:0;
1509         min-width: 100%;
1510 }
1511 #my-courses-navlist{
1512 }
1513 .my-courses-list{
1514         border: solid 1px #A9ADB0;
1515         -webkit-border-radius:5px;
1516         padding: .375em;
1517         color: #4C566C;
1518         margin: .375em;
1519         padding: .375em;
1520 }
1521 .my-courses-list-ul{
1522         margin: 0 auto;
1523         padding-left: 0;
1524         width: 100%;
1525 }
1526 .my-courses-links{
1527         font-size: 80%;
1528         padding-top: .75em;
1529 }
1530 .my-courses-resume{
1531         float: right;
1532 }
1533 .fl-link-summary{
1534         padding-left: 0.875em;
1535         padding-bottom: 0.875em;
1536         display: inline;
1537 }
1538 .fl-list-menu li a {
1539 }
1540 .fl-theme-iphone [class*="fl-list"]:not(.fl-list):not(.fl-grid) a {
1541 }
1542 .fl-theme-iphone [class*="fl-list"] > li .fl-link-summary{
1543         color: #4C566C;
1544 }
1545 .current_head{
1546         padding-top: .5em;
1547 }
1548 .fl-list-menu {
1549
1550 }
1551
1552 .current_box{
1553         max-width: 100%;
1554 }
1555 .current_list{
1556         width: 95%;
1557         padding: 0 0.375em;
1558 }
1559 .current_list li{
1560         list-style-type: none;
1561         padding:0;
1562         margin:0;
1563
1564 }
1565 .current_list img{
1566
1567 }
1568
1569 #show-all{
1570         text-align: center;
1571 }
1572 /* enrollment tabs */
1573 #navlist {
1574         padding: 0;
1575         margin-left: 0;
1576         margin-right: auto;
1577         margin-left: auto;
1578         margin-bottom: .25em;
1579         margin-top: 0.938em;
1580         white-space: nowrap;
1581 }
1582
1583 #navlist li {
1584         list-style: none;
1585         display: inline;
1586         margin: 0;
1587 }
1588
1589 #navlist li a {
1590         padding: 0.188em 0.563em;
1591         border: 1px solid #F7F3ED;
1592         border-bottom: none;
1593         background-color: #F7F3ED;
1594         text-decoration: none;
1595         margin-left: .25em;
1596         white-space: nowrap;
1597 }
1598
1599 #navlist li a:hover, #navlist li a:active {
1600         color: #000;
1601         background-color: #fff;
1602 }
1603
1604 /* tree */
1605 .img-size-tree {
1606         vertical-align: middle;
1607         margin-top: 0;
1608     padding:0;
1609         height:1.45em;
1610         width:1.5em;
1611 }
1612 /* profile page */
1613
1614 dl#public-profile {
1615         width: 100%;
1616
1617 }
1618
1619 dl#public-profile {
1620         width: 100%;
1621
1622 }
1623 dl#public-profile dt {
1624         float: left;
1625         width: 90%;
1626         border-right: 1px solid #F7F3ED;
1627         padding: 0.313em 0.313em 0.313em 0;
1628
1629         margin-right: 0.313em;
1630 }
1631 dl#public-profile dd {
1632         margin: 0;
1633 }
1634
1635 div.social-right{
1636         margin-left:.5em;
1637         margin-top: 1em;
1638 }
1639 div.social-left{
1640         margin-left:.5em;
1641 }
1642 h4.profile{
1643         float: left;
1644 }
1645 .social-wrapper h3{
1646         padding-top: .5em;
1647 }
1648 .my-contacts h3{
1649         padding-bottom: .375em;
1650 }
1651 img#profile{
1652         border: 1px #cccccc solid;
1653         margin-left: 1em;
1654 }
1655 dd{
1656     margin: 0;
1657 }
1658
1659
1660 /** forum stuff **/
1661 #forum-thread li {border:1px solid #eee; border-bottom: 1px solid #F7F3ED; float:left; width: 97%; list-style: none; }
1662 #forum-thread li.even { background-color: #F7F3ED; border-top: none; }
1663 #forum-thread li.odd { background-color: #fff; }
1664 div.forum-post-author { float:left; width:19.375em; padding:0.5em 0.625em; }
1665 div.forum-post-author a.title {font-size: 1.1em; line-height: 1.2em; font-weight: bold; text-decoration:none; }
1666 div.forum-post-author img.profile-picture { border: 2px solid #F7F3ED; text-align:right;}
1667 div.forum-post-content { margin-left: 19.375em; padding: 0.313em 0 1.125em 1.125em;}
1668 div.forum-post-content h3 { font-weight: 500; float:left;clear:right; }
1669 div.forum-post-ctrl { float: right; padding-right: 0.313em; color: #a1a1a1;}
1670 div.forum-post-ctrl a { text-decoration: none; }
1671 div.forum-post-ctrl span { color: black; background-color: #fefdc2; padding: 0.188em; }
1672 div.forum-post-content p.date { color: #a1a1a1; border-bottom: 1px solid #F7F3ED; }
1673 div.forum-post-content div.body p { margin-bottom:1em; }
1674 div.forum-paginator{border:thin #cccccc solid; padding:.3em; width:95%;margin:auto;background-color:#F7F3ED;}
1675 span.forum-paginator-active{font-weight:700;text-decoration:underline; height:2em;}
1676
1677
1678
1679 /** inbox stuff - reuses some of the forum layout **/
1680 #inbox-msg li {border:1px solid #eee; border-bottom: 1px solid #F7F3ED; width: 95%; list-style: none; min-height: 11em;}
1681
1682 /*  tool list on admin home and manage screens  */
1683  li.top-tool {
1684         list-style: none;
1685         padding: 0.125em 0.125em 0.125em  0.938em;
1686         margin-bottom: 0.313em;
1687         line-height: 200%;
1688         border: solid 1px #A9ADB0;
1689         -webkit-border-radius:5px;
1690 }
1691
1692 li.top-tool a {  font-weight: bold; } /* ol#tools>li>a */
1693
1694 li.child-tool a {
1695         font-size: x-small;
1696         font-weight: normal;
1697 }
1698
1699 /* ol#tools>li>ul, */
1700 ul.child-top-tool {
1701         margin-top: -0.313em;
1702         padding-left: 0;
1703         margin-left: 0;
1704         display: inline;
1705 }
1706 ul.child-top-tool:before {
1707         content: " : ";
1708 }
1709
1710 /* ol#tools>li>ul>li, */
1711 li.child-tool {
1712         display: inline;
1713         margin-right: 0.313em;
1714         font-size: x-small;
1715 }
1716
1717 .img-size-home {
1718         height:3.85em;
1719         width:3.9em;
1720 }
1721
1722 /* browse courses */
1723 div.browse-course {
1724         width: 28em;
1725         padding-bottom: 0.625em;
1726         background-color: #fffaf0;
1727         border:1px #6F7172 solid;
1728         font-size:9pt;
1729         min-height:18em;
1730         margin:auto;
1731         margin-left:1em;
1732         margin-top:1em;
1733 }
1734
1735 dl.browse-course {
1736         width: 90%;
1737         padding-bottom: 0.625em;
1738         background-color: #fffaf0;
1739
1740         margin:auto;
1741         margin-left:1em;
1742 }
1743 dl.browse-course dt {
1744         float: left;
1745         font-weight: bold;
1746         width: 25%;
1747         text-align: right;
1748         clear: left;
1749         padding: 0.313em 0.625em 0.313em 0;
1750         vertical-align: middle;
1751
1752 }
1753 dl.browse-course dd {
1754         margin-bottom: 0.313em;
1755         clear: right;
1756         padding: 0.313em 0 0.313em 0.625em;
1757         margin-left: 26%;
1758
1759 }
1760 .row .buttons{
1761         border: none;
1762 }
1763
1764 /*  form fields grouping for WCAG 2.0 conformance*/
1765
1766 .group_form{
1767
1768 }
1769 fieldset.group_form{
1770
1771         margin:0 auto;
1772         margin-bottom: 1em;
1773         border: 1px #6D7B8D solid;
1774         -webkit-border-radius:5px;
1775 }
1776
1777 legend.group_form{
1778         background-color:white;
1779         font-weight: 600;
1780         color: #4c566c;
1781         padding:.5em;
1782         border: 1px #6D7B8D solid;
1783         -webkit-border-radius:5px;
1784 }
1785 /* file storage */
1786
1787 #fsfloat1{
1788         float:right;
1789 }
1790 #fsfloat2{
1791         float:right;
1792         width:48%;
1793 }
1794
1795
1796 /* highlight active links for WCAG 2.0 conformance */
1797 a:active,a:hover,a:focus{
1798         background-color:#F6EAD6;
1799         color:#000000;
1800 }
1801
1802
1803 /*Added by Silvia */
1804 div.column_primary {
1805         float: left;
1806         width: 42%;
1807         margin: 0.313em;
1808         padding: 0;
1809         min-width: 10.625em;
1810 /*      position: relative;*/
1811 }
1812
1813 div.column_equivalent{
1814         float: left;
1815         width: 52%;
1816         margin-left:  0.938em;
1817         margin-top: 0.313em;
1818         margin-right: 0.313em;
1819         margin-bottom: 0.313em;
1820         min-width: 10.625em;
1821         padding: 0.313em;
1822         border: 1px solid #EEE;
1823         background-color: #FFF;
1824 /*      position: relative;*/
1825
1826 }
1827
1828 div.resource_box{
1829         border: 1px solid #aaa;
1830         width: 95%;
1831         margin: 0.313em;
1832         padding: 0.313em;
1833         min-width: 9.375em;
1834         background-color: #eee;
1835 /*      position: relative;*/
1836 }
1837
1838 h2.alternatives_to{
1839         margin-top: 0.75em;
1840         font-size: 90%;
1841         color: #A50707;
1842
1843 /*      position: relative;*/
1844 }
1845
1846 div.alternative_box{
1847         border: 1px solid #ddd;
1848         /*width: 90%;*/
1849         margin: 0.313em;
1850         padding: 0.313em;
1851         min-width: 9.375em;
1852         background-color: #fff;
1853 /*      position: relative;*/
1854 }
1855
1856 div.alternative_box legend {
1857         color: #000;
1858 }
1859
1860 div.resource_box legend {
1861         color: #000;
1862 }
1863
1864 label.primary a{
1865         color: #A50707;
1866         font-weight: bolder;
1867         background-color: white;
1868 }
1869
1870 /* format of "table of contents" on content page */
1871 #toc a          { display:block; margin:0.188em; }
1872 #toc .h2, #toc .h3, #toc .h4, #toc .h5, #toc .h6{
1873         padding:0 0 0 0;
1874 }
1875
1876
1877 fieldset#toc {
1878         background-color: #FEFDEF;
1879         border: 1pt solid #B8AE9C;
1880         width:89%;
1881 }
1882
1883 #side-menu{
1884         overflow:hidden;
1885 }
1886
1887 /* cleans up glossary question mark line spacing*/
1888 sup{
1889         border: 1pt solid #B8AE9C;
1890         vertical-align:bottom;
1891         margin-top: 1em;
1892 }
1893
1894 /* jQuery tooltip styles */
1895 #tooltip{
1896         position:absolute;
1897         z-index:3000;
1898         border:3px solid #111;
1899         background-color:#eeeeee;
1900         padding:0.313em;
1901 }
1902 #tooltip h3,#tooltip div{
1903         margin:0;
1904 }
1905
1906 /* style for home page modules "detail view" */
1907 div.home_box {
1908         padding: .75em 0;
1909         margin: 0 auto;
1910 }
1911
1912 .outside_box{
1913         background:#e0e0e0;
1914         width: 17em;
1915         margin: .375em;
1916         padding: 0;
1917         height:9.8em;
1918 }
1919
1920
1921 .inside_box{
1922         width:100%;
1923         margin:auto;
1924         height:52%;
1925         margin-bottom:.2em;
1926         background:#eeeeee;
1927
1928 }
1929 .details_or{
1930         width:28.8em;
1931         height:9.8em;
1932         margin:0;
1933         background-image:url(images/details_r.png);
1934         background-position: top right;
1935         background-repeat:no-repeat;
1936 }
1937 .details_ol{
1938         height:9.8em;
1939         margin:0;
1940         width:.45em;
1941         background-image:url(images/details_l.png);
1942         background-position: top left;
1943         background-repeat:no-repeat;
1944 }
1945 .details_ir{
1946         width:.5em;
1947         height:100%;
1948         float:right;
1949         background-image:url(images/details_ir.png);
1950         background-position: top right;
1951         background-repeat:no-repeat;
1952 }
1953 .details_il{
1954         height:100%;
1955         float:left;
1956         background-image:url(images/details_il.png);
1957         background-position: top left;
1958         background-repeat:no-repeat;
1959 }
1960 .home-title{
1961         font-size:12pt;
1962 }
1963 .buttonbox{
1964         float:right;
1965 }
1966 .details_text{
1967         margin-left:1em;
1968 }
1969 .draggable_selected {
1970         background-color: lightgrey;
1971         cursor: move;
1972 }
1973
1974 div.menuedit{
1975         float:right;
1976         margin-top:-1.2em;
1977         border:1px solid #cccccc;
1978 }
1979 li.folders {
1980         list-style: disc url(../../images/folder.gif) outside;
1981         font-family: Verdana, Helevetica, Arial, sans-serif;
1982         margin-bottom: 0;
1983         margin-top: 0;
1984         margin-right: 0;
1985 }
1986
1987 li.folders .disabled {
1988         color: #B8AE9C;
1989 }
1990
1991 ul.folder{
1992         list-style-image:none;
1993         list-style-position:outside;
1994         list-style-type:none;
1995         margin:0em;
1996         padding:0em;
1997 }
1998
1999 /*      Top navlist */
2000
2001 #topnavlist-link {
2002         color: white;
2003         text-decoration: none;
2004         font-weight: bold;
2005 }
2006
2007 ul#topnavlist {
2008         display: none;
2009         position: relative;
2010         top: 1.2em;
2011         z-index: 1;
2012         background-color: white;
2013 }
2014
2015 ul#topnavlist li {
2016         padding: 0;
2017         margin: 0;
2018 }
2019 ul#topnavlist li a.active {
2020         color: black;
2021         font-style: italic;
2022         }
2023 ul#topnavlist li a:hover, ul#topnavlist li a:focus {
2024         color: black;
2025 }
2026
2027 ul#topnavlist li a  {
2028         color: #4C566C;
2029         text-decoration: none;
2030 }
2031
2032
2033 /*      Sub naviaation list */
2034
2035 div.toolcontainer{
2036         width:90%;
2037         margin:auto;
2038         border:thin solid #e8e8e8;
2039         padding-top:1em;
2040         padding-bottom:1em;
2041 }
2042
2043 ul#subnavlist {
2044         padding: 0;
2045         padding-bottom: 0.313em;
2046         margin: 0;
2047         font-size: 90%;
2048 }
2049
2050
2051 ul#subnavlist li {
2052         display: inline;
2053 }
2054
2055 ul#subnavlist li#test{
2056         display: none;
2057 }
2058
2059 ul#subnavlist li a, ul#subnavlist li a:visited {
2060         color: #4C566C;
2061 }
2062
2063
2064 /* List attributes */
2065 ul {
2066         list-style: none;
2067 }
2068 li {
2069         color: black;
2070         list-style: none;
2071 }
2072 ol#tools>li:hover, ol#tools>li:hover a {
2073         border: 1px solid #e0e0e0;
2074         background-color: #e6e6e6;
2075         color: black;
2076 }
2077 #subnavigation, #subnavigation a:link, #subnavigation a:visited{
2078 }
2079
2080 #contentwrapper{
2081         background-color: white;
2082         overflow:auto;
2083         padding-bottom: 1em;
2084 }
2085
2086 #leftcolumn{
2087         float: left;
2088         width: 17em;
2089         margin-left: 0.313em;
2090         margin-top:-0.625em;
2091 }
2092
2093 #copyright{
2094         font-size: 0.5em;
2095 }
2096
2097 #gototop{
2098         text-align: center;
2099         color: #4B6B90;
2100 }
2101
2102  #tools{
2103         margin: 0 auto;
2104         padding: 0.375em;
2105 }
2106
2107
2108 /* ATutor Social Styles */
2109
2110 div .profile_container {
2111         background-color:#eee;
2112         border: 1px solid #8e8e8e;
2113         width:80%;
2114         padding:0.5em;
2115         margin-bottom: 0.5em;
2116 }
2117
2118 div .profile_container .top_right {
2119         float: right;
2120 }
2121
2122 dl.public-profile dd{
2123         margin-left:0;
2124 }
2125 dl.public-profile dt {
2126         float: left;
2127         font-weight: bold;
2128         min-width:12em;
2129 }
2130
2131 /* Search form */
2132 div .search_form {
2133         margin-bottom: 1em;
2134 }
2135
2136 div .search_form .row{
2137         background-color: #DEDEC0;
2138         padding: 0.5em;
2139 }
2140 div .button {
2141         background-color: #eee;
2142         border: 1px solid #aaa;
2143 }
2144 div .button:hover{
2145         background-color: #cccccc;
2146         color: #ffffff;
2147 }
2148
2149 /* Side menu */
2150
2151
2152 ul.social_side_menu {
2153         padding-left: 2em;
2154 }
2155 ul.social_side_menu li {
2156         padding-bottom: 0.2em;
2157         list-style: circle;
2158 }
2159
2160 div .divider {
2161         border-bottom:1px solid #C1C157;
2162         padding-bottom:0.5em;
2163         margin-bottom:0.5em;
2164 }
2165
2166 .activity{
2167         line-height:18pt;
2168         font-size:.8em;
2169 }
2170
2171
2172 div.contentbox, input-form{
2173
2174         background-color: #ffffff;
2175     overflow:hidden;
2176     border: #A9ADB0 solid 1px;
2177         -webkit-border-radius: 5px;
2178 }
2179
2180 div.suggestions{
2181         border:1px solid #a50707;
2182         margin-left:0.625em;
2183         width:50%;
2184 }
2185 li.inlinelist{
2186         display: inline;
2187         padding-right: 1em;
2188 }
2189 ul.social_inline_menu{
2190         background-color: #eeeeee;
2191         border:thin #cccccc solid;
2192         padding:.5em;
2193         width:90%;
2194         margin:auto;
2195 }
2196 div.social-wrapper{
2197         width: 100%;
2198 }
2199
2200 .contentbox-a{
2201     width: 100%;
2202 }
2203 .contentbox-b{
2204     padding-bottom:0.2em;
2205 }
2206
2207 div.logo{
2208 float:left;
2209 clear:right;
2210 margin-left:2em;}
2211