[Summary view] [Print] [Text view]

   1  /**
   2   * CSS for displaying courses and everything in them
   3   */
   4  .section_add_menus {
   5      text-align: right;
   6  }
   7  
   8  .dir-rtl .section_add_menus {
   9      text-align: left;
  10  }
  11  
  12  .section_add_menus .horizontal div,
  13  .section_add_menus .horizontal form {
  14      display: inline;
  15  }
  16  
  17  .section_add_menus optgroup {
  18      font-weight: normal;
  19      font-style: italic;
  20  }
  21  
  22  .section_add_menus .urlselect {
  23      margin-left: .4em;
  24  }
  25  
  26  .dir-rtl .section_add_menus .urlselect {
  27      margin-right: .4em;
  28      margin-left: 0;
  29  }
  30  
  31  .section_add_menus .urlselect select {
  32      margin-left: .2em;
  33  }
  34  
  35  .dir-rtl .section_add_menus .urlselect select {
  36      margin-right: .2em;
  37      margin-left: 0;
  38  }
  39  
  40  .section_add_menus .urlselect img.iconhelp {
  41      padding: 0;
  42      margin: 0;
  43      vertical-align: text-bottom;
  44  }
  45  
  46  .sitetopic ul.section {
  47      margin: 5px;
  48      padding: 0;
  49  }
  50  
  51  .course-content ul.section {
  52      margin: 1em;
  53  }
  54  
  55  .sitetopic .section .activity img.activityicon,
  56  .course-content .section .activity img.activityicon {
  57      vertical-align: text-bottom;
  58      margin-right: 3px;
  59      margin-left: 3px;
  60      width: 24px;
  61      height: 24px;
  62  }
  63  
  64  .sitetopic .section .activity .activityinstance,
  65  .course-content .section .activity .activityinstance,
  66  .section .activity .activityinstance {
  67      display: inline-block;
  68  }
  69  
  70  .section .side.left {
  71      float: left;
  72  }
  73  
  74  .dir-rtl .section .side.left {
  75      float: right;
  76  }
  77  
  78  .section .side.right {
  79      float: right;
  80  }
  81  
  82  .dir-rtl .section .side.right {
  83      float: left;
  84  }
  85  
  86  .section .activity .editing_move {
  87      position: absolute;
  88      left: 0;
  89      top: 0;
  90  }
  91  
  92  .dir-rtl .section .activity .editing_move {
  93      left: auto;
  94      right: 0;
  95  }
  96  
  97  .section .activity .mod-indent-outer {
  98      display: table;
  99      padding-left: 24px;
 100  }
 101  
 102  .section .label .mod-indent-outer {
 103      padding-left: 24px;
 104      display: block;
 105  }
 106  
 107  .dir-rtl .section .activity .mod-indent-outer {
 108      padding-right: 24px;
 109  }
 110  
 111  .section .activity .actions {
 112      position: absolute;
 113      right: 0;
 114      top: 0;
 115  }
 116  
 117  .dir-rtl .section .activity .actions {
 118      left: 0;
 119      right: auto;
 120  }
 121  
 122  .course-content  li.section li.activity ul {
 123      list-style: disc;
 124  }
 125  
 126  .course-content  li.section li.activity ul ul {
 127      list-style: circle;
 128  }
 129  
 130  .course-content  li.section li.activity ul ul ul {
 131      list-style: square;
 132  }
 133  
 134  .sitetopic .section .activity .activityinstance div,
 135  .course-content .section .activity .activityinstance div {
 136      display: inline;
 137  }
 138  
 139  .course-content .section .activity .activityinstance form {
 140      display: inline;
 141  }
 142  
 143  .sitetopic .section .activity .activityinstance,
 144  .course-content .section .activity .activityinstance {
 145      height: 2em;
 146  }
 147  
 148  .editing .sitetopic .section .activity .activityinstance,
 149  .editing .course-content .section .activity .activityinstance,
 150  .editing .sitetopic .section .activity .contentwithoutlink,
 151  .editing .course-content .section .activity .contentwithoutlink {
 152      padding-right: 200px;
 153  }
 154  
 155  .dir-rtl.editing .sitetopic .section .activity .activityinstance,
 156  .dir-rtl.editing .course-content .section .activity .activityinstance,
 157  .dir-rtl.editing .sitetopic .section .activity .contentwithoutlink,
 158  .dir-rtl.editing .course-content .section .activity .contentwithoutlink {
 159      padding-left: 200px;
 160      padding-right: inherit;
 161  }
 162  
 163  .sitetopic .section .activity .activityinstance,
 164  .course-content .section .activity .activityinstance,
 165  .sitetopic .section .activity .contentwithoutlink,
 166  .course-content .section .activity .contentwithoutlink {
 167      padding-right: 32px;
 168      height: 2em;
 169      display: table-cell;
 170  }
 171  
 172  .sitetopic .section .label .activityinstance,
 173  .course-content .section .label .activityinstance,
 174  .sitetopic .section .label .contentwithoutlink,
 175  .course-content .section .label .contentwithoutlink {
 176      padding-right: 32px;
 177      display: block;
 178      height: inherit;
 179  }
 180  
 181  .dir-rtl .sitetopic .section .activity .activityinstance,
 182  .dir-rtl .course-content .section .activity .activityinstance,
 183  .dir-rtl .sitetopic .section .activity .contentwithoutlink,
 184  .dir-rtl .course-content .section .activity .contentwithoutlink {
 185      padding-left: 32px;
 186      padding-right: inherit;
 187  }
 188  
 189  .sitetopic .section .activity .filler,
 190  .course-content .section .activity .filler {
 191      width: 16px;
 192      height: 16px;
 193      margin: 4px;
 194      display: inline-block;
 195      vertical-align: text-bottom;
 196  }
 197  
 198  .dir-rtl .sitetopic .section .activity .activityinstance,
 199  .dir-rtl .course-content .section .activity .activityinstance {
 200      padding-right: 0;
 201      padding-left: 3em;
 202  }
 203  
 204  .sitetopic .section .activity .commands,
 205  .course-content .section .activity .commands {
 206      white-space: nowrap;
 207      display: inline-block;
 208  }
 209  
 210  .section .activity .moodle-actionmenu .menu > li > *,
 211  .section .activity .moodle-actionmenu .menubar > li > * {
 212      display: inline-block;
 213      min-height: 16px;
 214  }
 215  
 216  .section .activity .moodle-actionmenu[data-enhanced] .menu > li > * {
 217      display: block;
 218  }
 219  
 220  .section .activity .moodle-actionmenu[data-enhanced] .menu {
 221      margin-left: -2.8em;
 222  }
 223  
 224  .section .activity .moodle-actionmenu:not([data-enhanced]) .menubar > li .toggle-display {
 225      display: none;
 226  }
 227  
 228  .section img.iconsmall {
 229      vertical-align: text-bottom;
 230      width: 16px;
 231      height: 16px;
 232      margin: 4px;
 233  }
 234  
 235  .section .editing_title img.iconsmall {
 236      width: 12px;
 237      height: 12px;
 238      margin: 4px 8px 4px 0;
 239  }
 240  
 241  .section .activity.editor_displayed a.editing_title,
 242  .section .activity.editor_displayed .moodle-actionmenu {
 243      display: none;
 244  }
 245  
 246  .single-section h3.sectionname {
 247      text-align: center;
 248      clear: both;
 249  }
 250  
 251  .sitetopic .section li.activity,
 252  .course-content .section li.activity {
 253      padding: .2em;
 254  }
 255  
 256  .section .activity .activityinstance .groupinglabel {
 257      padding-left: .45em;
 258  }
 259  
 260  .sitetopic .section .activity .availabilityinfo,
 261  .sitetopic .section .activity .contentafterlink,
 262  .course-content .section .activity .availabilityinfo,
 263  .course-content .section .activity .contentafterlink {
 264      margin-top: 0.5em;
 265  }
 266  
 267  .dir-rtl .sitetopic .section .activity .availabilityinfo,
 268  .dir-rtl .sitetopic .section .activity .contentafterlink,
 269  .dir-rtl .course-content .section .activity .availabilityinfo,
 270  .dir-rtl .course-content .section .activity .contentafterlink {
 271      margin-left: 0;
 272      margin-right: 30px;
 273  }
 274  
 275  .availabilityinfo > ul {
 276      margin-top: 0;
 277  }
 278  
 279  .section .activity .contentafterlink p {
 280      margin: .5em 0;
 281  }
 282  
 283  .sitetopic .section .activity:hover,
 284  .course-content .section .activity:hover {
 285      background-color: #EEE;
 286  }
 287  
 288  .course-content .section-summary {
 289      border: 1px solid #DDD;
 290      margin-top: 5px;
 291      list-style: none;
 292  }
 293  
 294  .course-content .section-summary .section-title {
 295      margin: 2px 5px 10px 5px;
 296  }
 297  
 298  .course-content .section-summary .summarytext {
 299      margin: 2px 5px 2px 5px;
 300  }
 301  
 302  .course-content .section-summary .section-summary-activities .activity-count {
 303      color: #AAA;
 304      font-size: 12px;
 305      margin-right: 15px;
 306  }
 307  
 308  .course-content .section-summary .summary {
 309      margin-top: 5px;
 310  }
 311  
 312  .course-content .single-section {
 313      margin-top: 1em;
 314  }
 315  
 316  .course-content .single-section .section-navigation {
 317      display: block;
 318      padding: 0.5em;
 319      margin-bottom: -0.5em;
 320  }
 321  
 322  .course-content .single-section .section-navigation .title {
 323      font-weight: bold;
 324      font-size: 108%;
 325  }
 326  
 327  .course-content .single-section .section-navigation .mdl-left {
 328      font-weight: normal;
 329      float: left;
 330      margin-right: 1em;
 331  }
 332  
 333  .dir-rtl .course-content .single-section .section-navigation .mdl-left {
 334      float: right;
 335  }
 336  
 337  .course-content .single-section .section-navigation .mdl-left .larrow {
 338      margin-right: 0.1em;
 339  }
 340  
 341  .course-content .single-section .section-navigation .mdl-right {
 342      font-weight: normal;
 343      float: right;
 344      margin-left: 1em;
 345  }
 346  
 347  .dir-rtl .course-content .single-section .section-navigation .mdl-right {
 348      float: left;
 349  }
 350  
 351  .course-content .single-section .section-navigation .mdl-right .rarrow {
 352      margin-left: 0.1em;
 353  }
 354  
 355  .course-content .single-section .section-navigation .mdl-bottom {
 356      margin-top: 0;
 357  }
 358  
 359  #page-site-index .subscribelink {
 360      text-align: right;
 361  }
 362  
 363  #site-news-forum h2,
 364  #frontpage-course-list h2,
 365  #frontpage-category-names h2,
 366  #frontpage-category-combo h2 {
 367      margin-bottom: 9px;
 368  }
 369  
 370  #page-site-index .clearfloat {
 371      float: none;
 372      clear: both;
 373      height: 0px;
 374  }
 375  
 376  .path-course-view a.reduce-sections {
 377      padding-left: 0.2em;
 378  }
 379  
 380  .path-course-view .subscribelink {
 381      text-align: right;
 382  }
 383  
 384  .path-course-view .unread {
 385      margin-left: 3em;
 386  }
 387  
 388  .path-course-view .block.drag .header {
 389      cursor: move;
 390  }
 391  
 392  .path-course-view .completionprogress {
 393      text-align: right;
 394  }
 395  
 396  .dir-rtl.path-course-view .completionprogress {
 397      text-align: left;
 398  }
 399  
 400  .path-course-view .single-section .completionprogress {
 401      margin-right: 5px;
 402  }
 403  
 404  .path-course-view .section .summary {
 405      line-height: normal;
 406  }
 407  
 408  .path-site li.activity > div,
 409  .path-course-view li.activity > div {
 410      position: relative;
 411  }
 412  
 413  .path-course-view li.activity form.togglecompletion .ajaxworking {
 414      position: absolute;
 415      right: 22px;
 416      width: 16px;
 417      height: 16px;
 418      background: url([[pix:i/ajaxloader]]) no-repeat;
 419  }
 420  
 421  .path-course-view li.activity form.togglecompletion div {
 422      display: inline;
 423  }
 424  
 425  .dir-rtl.path-course-view li.activity form.togglecompletion,
 426  .dir-rtl.path-course-view li.activity span.autocompletion {
 427      left: 1.7em;
 428      right: auto;
 429      padding: 0px;
 430  }
 431  
 432  .dir-rtl.path-course-view .completionprogress {
 433      float: none;
 434  }
 435  
 436  .dir-rtl.path-course-view li.activity form.togglecompletion .ajaxworking {
 437      right: -22px;
 438  }
 439  
 440  li.section.hidden span.commands a.editing_hide,
 441  li.section.hidden span.commands a.editing_show {
 442      cursor: default;
 443  }
 444  
 445  .section img.movetarget {
 446      height: 16px;
 447      width: 80px;
 448  }
 449  
 450  .weeks-format,
 451  .topics-format {
 452      margin-top: 8px;
 453      min-width: 763px;
 454  }
 455  
 456  #page-course-pending .singlebutton,
 457  #page-course-index .singlebutton,
 458  #page-course-index-category .singlebutton,
 459  #page-course-editsection .singlebutton {
 460      text-align: center;
 461  }
 462  
 463  #coursesearch {
 464      margin-top: 1em;
 465      text-align: center;
 466  }
 467  
 468  #page-course-pending .pendingcourserequests {
 469      margin-bottom: 1em;
 470  }
 471  
 472  #page-course-pending .pendingcourserequests .singlebutton {
 473      display: inline;
 474  }
 475  
 476  #page-course-pending .pendingcourserequests .cell {
 477      padding: 0 5px;
 478  }
 479  
 480  #page-course-pending .pendingcourserequests .cell.c6 {
 481      white-space: nowrap;
 482  }
 483  
 484  /* Courses and categories lists */
 485  
 486  .coursebox {
 487      width: 100%;
 488      margin-bottom: 15px;
 489  }
 490  
 491  .coursebox.collapsed {
 492      margin-bottom: 0;
 493  }
 494  
 495  .coursebox.collapsed > .content {
 496      display: none;
 497  }
 498  
 499  .coursebox > .info > .coursename a {
 500      display: block;
 501      background-image: url([[pix:moodle|i/course]]);
 502      background-repeat: no-repeat;
 503      padding-left: 21px;
 504      background-position: left top;
 505  }
 506  
 507  .coursebox.remotehost .coursename a {
 508      background-image: url([[pix:moodle|i/mnethost]]);
 509  }
 510  
 511  .coursebox > .info > .coursename,
 512  .coursebox .content .teachers,
 513  .coursebox .content .courseimage,
 514  .coursebox .content .coursefile {
 515      float: left;
 516      width: 40%;
 517      clear: left;
 518  }
 519  
 520  .coursebox .content .teachers li {
 521      list-style-type: none;
 522      padding: 0;
 523      margin: 0;
 524  }
 525  
 526  .coursebox .enrolmenticons {
 527      padding: 3px 0;
 528      float: right;
 529  }
 530  
 531  .coursebox .moreinfo {
 532      padding: 3px 0;
 533      float: right;
 534  }
 535  
 536  .coursebox .enrolmenticons img,
 537  .coursebox .moreinfo img {
 538      margin: 0 .2em;
 539  }
 540  
 541  .coursebox .content {
 542      clear: both;
 543      overflow: hidden;
 544  }
 545  
 546  .coursebox .content .summary,
 547  .coursebox .content .coursecat {
 548      float: right;
 549      width: 55%;
 550  }
 551  
 552  .coursebox .content .coursecat {
 553      text-align: right;
 554      clear: right;
 555  }
 556  
 557  .coursebox.remotecoursebox .remotecourseinfo {
 558      float: left;
 559      width: 40%;
 560  }
 561  
 562  .coursebox .content .courseimage img {
 563      max-width: 100px;
 564      max-height: 100px;
 565  }
 566  
 567  .coursebox > .info > .coursename {
 568      margin: 5px;
 569      padding: 0;
 570  }
 571  
 572  .coursebox .content .teachers,
 573  .coursebox .content .coursecat,
 574  .coursebox .content .summary,
 575  .coursebox .content .courseimage,
 576  .coursebox .content .coursefile,
 577  .coursebox.remotecoursebox .remotecourseinfo {
 578      margin: 3px 5px;
 579      padding: 0;
 580  }
 581  
 582  .dir-rtl .coursebox > .info > .coursename a {
 583      padding-left: 0;
 584      padding-right: 21px;
 585      background-position: top right;
 586  }
 587  
 588  .dir-rtl .coursebox > .info > .coursename,
 589  .dir-rtl .coursebox .teachers,
 590  .dir-rtl .coursebox .content .courseimage,
 591  .dir-rtl .coursebox .content .coursefile {
 592      float: right;
 593      clear: right;
 594  }
 595  
 596  .dir-rtl .coursebox .enrolmenticons,
 597  .dir-rtl .coursebox .moreinfo {
 598      float: left;
 599  }
 600  
 601  .dir-rtl .coursebox .summary,
 602  .dir-rtl .coursebox .coursecat {
 603      float: left;
 604  }
 605  
 606  .dir-rtl .coursebox .coursecat {
 607      text-align: left;
 608      clear: left;
 609  }
 610  
 611  .course_category_tree .category .numberofcourse {
 612      font-size: 0.85em;
 613  }
 614  
 615  .dir-rtl .course_category_tree .category .numberofcourse {
 616      padding-right: 20px;
 617  }
 618  
 619  .course_category_tree .controls {
 620      visibility: hidden;
 621  }
 622  
 623  .course_category_tree .controls div {
 624      display: inline;
 625      cursor: pointer;
 626  }
 627  
 628  .jsenabled .course_category_tree .controls {
 629      visibility: visible;
 630  }
 631  
 632  .course_category_tree .category > .info > .categoryname {
 633      background-image: url([[pix:moodle|t/collapsed_empty]]);
 634      background-repeat: no-repeat;
 635      background-position: center;
 636      margin: 0.5em 5px;
 637  }
 638  
 639  .dir-rtl .course_category_tree .category > .info > .categoryname {
 640      background-image: url([[pix:moodle|t/collapsed_empty_rtl]]);
 641      background-position: center;
 642      margin: 0.5em 5px;
 643  }
 644  
 645  .course_category_tree .category.with_children > .info > .categoryname {
 646      background-image: url([[pix:moodle|t/expanded]]);
 647  }
 648  
 649  .course_category_tree .category.with_children.collapsed > .info > .categoryname {
 650      background-image: url([[pix:moodle|t/collapsed]]);
 651  }
 652  
 653  .dir-rtl .course_category_tree .category.with_children.collapsed > .info .categoryname {
 654      background-image: url([[pix:moodle|t/collapsed_rtl]]);
 655  }
 656  
 657  .course_category_tree .category.collapsed > .content {
 658      display: none;
 659  }
 660  
 661  .course_category_tree .category > .info > .categoryname {
 662      padding: 2px 18px;
 663      margin: 3px;
 664  }
 665  
 666  .course_category_tree .category > .content {
 667      padding-left: 16px;
 668      overflow: hidden;
 669  }
 670  
 671  .dir-rtl .course_category_tree .category > .content {
 672      padding-left: 0;
 673      padding-right: 16px;
 674  }
 675  
 676  .course_category_tree .subcategories > .paging,
 677  .courses > .paging {
 678      margin: 0;
 679      padding: 5px;
 680      text-align: center;
 681  }
 682  
 683  .courses > .paging.paging-morelink,
 684  .course_category_tree .subcategories > .paging.paging-morelink {
 685      text-align: left;
 686  }
 687  
 688  .dir-rtl .courses > .paging.paging-morelink,
 689  .dir-rtl .course_category_tree .subcategories > .paging.paging-morelink {
 690      text-align: right;
 691  }
 692  
 693  #page-course-info .generalbox.info,
 694  #page-enrol-index .generalbox.info {
 695      border: none;
 696  }
 697  
 698  .path-course .clearfloat {
 699      float: none;
 700      clear: both;
 701      height: 0px;
 702  }
 703  
 704  .section .spinner {
 705      height: 16px;
 706      width: 16px;
 707  }
 708  
 709  .section .activity .spinner {
 710      margin: 4px;
 711      left: 100%;
 712      position: absolute;
 713  }
 714  
 715  .dir-rtl .section .activity .spinner {
 716      left: auto;
 717      right: 100%;
 718  }
 719  
 720  /* Quick edit of module name */
 721  
 722  .sitetopic .section .activity form.activityinstance,
 723  .course-content .section .activity form.activityinstance {
 724      display: inline;
 725      vertical-align: middle;
 726  }
 727  
 728  span.editinstructions {
 729      position: absolute;
 730      top: 0px;
 731      margin-top: -22px;
 732      margin-left: 30px;
 733      line-height: 16px;
 734      font-size: .85em;
 735      padding: .1em .4em;
 736      background-color: #ffc;
 737      color: #000;
 738      text-decoration: none;
 739      z-index: 9999;
 740      box-shadow: 2px 2px 5px 1px #ccc;
 741      border: 1px solid #ddd;
 742  }
 743  
 744  .dir-rtl span.editinstructions {
 745      left: auto;
 746      right: 32px;
 747  }
 748  
 749  input.titleeditor {
 750      vertical-align: text-bottom;
 751  }
 752  
 753  .editing .course-content .section .activity.editor_displayed .activityinstance {
 754      padding-right: inherit;
 755  }
 756  
 757  .dir-rtl.editing .course-content .section .activity.editor_displayed .activityinstance {
 758      padding-left: inherit;
 759  }
 760  
 761  /* Course drag and drop upload styles */
 762  
 763  #dndupload-status {
 764      width: 40%;
 765      margin: 0 30%;
 766      padding: 6px;
 767      border: 1px solid #ddd;
 768      top: -5px;
 769      text-align: center;
 770      background: #ffc;
 771      position: absolute;
 772      left: 0;
 773      box-shadow: 2px 2px 5px 1px #ccc;
 774      border-radius: 0px 0px 8px 8px;
 775      z-index: 0;
 776  }
 777  
 778  .dndupload-preview {
 779      color: #909090;
 780      border: 1px dashed #909090;
 781      list-style: none;
 782      margin-top: .2em;
 783      padding: .3em;
 784      line-height: 16px;
 785  }
 786  
 787  .dndupload-preview img.icon {
 788      vertical-align: text-bottom;
 789      padding: 0;
 790  }
 791  
 792  .dndupload-progress-outer {
 793      width: 70px;
 794      border: 1px solid black;
 795      border-radius: 4px;
 796      height: 10px;
 797      display: inline-block;
 798      margin: 0;
 799      padding: 0;
 800      overflow: hidden;
 801      position: relative;
 802  }
 803  
 804  .dndupload-progress-inner {
 805      width: 0%;
 806      height: 100%;
 807      background-color: green;
 808      display: inline-block;
 809      margin: 0;
 810      padding: 0;
 811      box-shadow: 0 0 4px #229b15;
 812      border-radius: 2px;
 813      background-repeat: repeat-x;
 814      background-position: top;
 815      background-image: url([[pix:theme_base|progress]]);
 816  }
 817  
 818  .dndupload-hidden {
 819      display: none;
 820  }
 821  
 822  /** Course category management **/
 823  
 824  #course-category-listings {
 825      background-color: #fff;
 826      border: 1px solid #e1e1e8;
 827      margin-bottom: 200px;
 828  }
 829  
 830  /** Two column layout */
 831  
 832  #course-category-listings.columns-2 > #category-listing > div {
 833      border-right: 1px solid #e1e1e8;
 834  }
 835  
 836  .dir-rtl #course-category-listings.columns-2 > #category-listing > div {
 837      border-left: 1px solid #e1e1e8;
 838      border-right: 0;
 839  }
 840  
 841  #course-category-listings.columns-2 > #course-listing > div {
 842      border-left: 1px solid #e1e1e8;
 843      margin-left: -1px;
 844  }
 845  
 846  #course-category-listings.columns-2.viewmode-courses.course-selected > #course-listing > div {
 847      border-right: 1px solid #e1e1e8;
 848      margin-right: -1px;
 849  }
 850  
 851  #course-category-listings.columns-2 > #course-detail > div {
 852      border-left: 1px solid #e1e1e8;
 853  }
 854  
 855  /** Three column layout */
 856  
 857  #course-category-listings.columns-3 #category-listing > div {
 858      border-right: 1px solid #DDD;
 859  }
 860  
 861  #course-category-listings.columns-3 #course-listing > div {
 862      border-right: 1px solid #e1e1e8;
 863      border-left: 1px solid #e1e1e8;
 864      margin-right: -1px;
 865      margin-left: -1px;
 866  }
 867  
 868  #course-category-listings.columns-3 #course-detail > div {
 869      border-left: 1px solid #DDD;
 870  }
 871  
 872  #course-category-listings > div > div {
 873      min-height: 300px;
 874  }
 875  
 876  #course-category-listings h3 {
 877      margin: 0;
 878      padding: 0.6em 1em 0.5em;
 879      text-align: left;
 880      background-color: #f7f7f9;
 881      border-bottom: 1px solid #e1e1e8;
 882  }
 883  
 884  #course-category-listings h4 {
 885      margin: 1em 0 0;
 886      padding: 0.6em 1em 0.5em;
 887      text-align: left;
 888  }
 889  
 890  .dir-rtl #course-category-listings h3,
 891  .dir-rtl #course-category-listings h4 {
 892      text-align: right;
 893  }
 894  
 895  .coursecat-management-header .moodle-actionmenu,
 896  #course-category-listings .moodle-actionmenu {
 897      white-space: nowrap;
 898  }
 899  
 900  #course-category-listings .listing-actions {
 901      text-align: center;
 902      padding: 0.4em 0.3em 0.3em;
 903  }
 904  
 905  #course-category-listings .listing-actions > * {
 906      display: inline-block;
 907      line-height: 2.2em;
 908  }
 909  
 910  #course-category-listings .listing-actions > .moodle-actionmenu {
 911      display: inline-block;
 912  }
 913  
 914  .coursecat-management-header .moodle-actionmenu[data-enhanced].show .menu a,
 915  #course-category-listings .listing-actions > .moodle-actionmenu .menu a {
 916      padding: 4px 1em;
 917  }
 918  
 919  #course-category-listings .listing-actions .iconsmall {
 920      margin-left: 0.5em;
 921  }
 922  
 923  #course-category-listings ul.ml {
 924      list-style: none;
 925      margin: 1em 0;
 926  }
 927  
 928  #course-category-listings ul.ml ul.ml {
 929      margin: 0;
 930  }
 931  
 932  #course-category-listings li {
 933      line-height: 2.2em;
 934  }
 935  
 936  #course-category-listings li > div {
 937      border-bottom: 1px solid #fff;
 938      border-top: 1px solid #fff;
 939  }
 940  
 941  #course-category-listings li > div:hover {
 942      background-color: #fafafa;
 943  }
 944  
 945  #course-category-listings li.highlight {
 946      background-color: transparent;
 947  }
 948  
 949  #course-category-listings li.highlight > div,
 950  #category-listing li.highlight.listitem > div > .ba-checkbox,
 951  #course-category-listings li.highlight > div:hover,
 952  #course-category-listings li[data-selected='1'].highlight> div {
 953      background-color: #ddffaa;
 954  }
 955  
 956  #course-category-listings li + li > div,
 957  #course-category-listings li:first-child > div {
 958      border-top-color: #f7f7f9;
 959  }
 960  
 961  #course-category-listings li .tree-icon {
 962      margin-right: 0.5em;
 963      width: 12px;
 964      height: 12px;
 965  }
 966  
 967  .dir-rtl #course-category-listings li .tree-icon {
 968      margin-left: 0.5em;
 969  }
 970  
 971  #course-category-listings li[data-selected='1']> div {
 972      background-color: #FFFFD8;
 973      border-top-color: #e1e1e8;
 974      border-bottom-color: #f7f7f9;
 975  }
 976  
 977  #course-category-listings li[data-selected='1'] li:first-of-type> div,
 978  #course-category-listings li[data-selected='1'][data-expandable='0']+li> div {
 979      border-top-color: #e1e1e8;
 980  }
 981  
 982  #course-category-listings li[data-selected='1']:last-of-type> div {
 983      border-bottom-color: #e1e1e8;
 984  }
 985  
 986  #course-category-listings > div > div > ul.ml > li:first-child > div {
 987      border-top: 0;
 988  }
 989  
 990  #course-category-listings .moodle-actionmenu.show .menu li {
 991      line-height: 20px;
 992  }
 993  
 994  #course-category-listings .listing-actions .moodle-actionmenu:not([data-enhanced]) li {
 995      line-height: normal;
 996  }
 997  
 998  #course-category-listings .listing-actions .moodle-actionmenu:not([data-enhanced])> .menubar li,
 999  #course-category-listings .listing-actions .moodle-actionmenu:not([data-enhanced])> .menubar a,
1000  #course-category-listings .listing-actions .moodle-actionmenu:not([data-enhanced])> .menu .menu-action-text {
1001      display: inline-block;
1002  }
1003  
1004  #course-category-listings .listing-actions .moodle-actionmenu:not([data-enhanced])> .menubar a {
1005      color: inherit;
1006  }
1007  
1008  #course-category-listings .listing-actions .moodle-actionmenu:not([data-enhanced])> .menubar a> img,
1009  #course-category-listings .listing-actions .moodle-actionmenu:not([data-enhanced])> .menubar .caret {
1010      display: none;
1011  }
1012  
1013  .jsenabled #course-category-listings .moodle-actionmenu[data-enhance] .toggle-display img {
1014      width: auto;
1015  }
1016  
1017  .jsenabled #course-category-listings .moodle-actionmenu[data-enhance] .toggle-display.textmenu {
1018      padding-right: 4px;
1019  }
1020  
1021  .jsenabled #course-category-listings .moodle-actionmenu[data-enhance] .toggle-display.textmenu .caret {
1022      vertical-align: text-top;
1023  }
1024  
1025  #course-category-listings .item-actions {
1026      margin-right: 1em;
1027      display: inline-block;
1028  }
1029  
1030  #course-category-listings .item-actions .menubar img,
1031  #course-category-listings .item-actions > a img {
1032      margin: 0 4px;
1033  }
1034  
1035  #course-category-listings .item-actions .menu img {
1036      max-width: none;
1037      width: 12px;
1038  }
1039  
1040  #course-category-listings li .tree-icon {
1041      margin-left: 0;
1042  }
1043  
1044  #course-category-listings li li .tree-icon {
1045      margin-left: 1em;
1046  }
1047  
1048  #course-category-listings li li li .tree-icon {
1049      margin-left: 2em;
1050  }
1051  
1052  #course-category-listings li li li li .tree-icon {
1053      margin-left: 3em;
1054  }
1055  
1056  #course-category-listings li li li li li .tree-icon {
1057      margin-left: 4em;
1058  }
1059  
1060  #course-category-listings li li li li li li .tree-icon {
1061      margin-left: 4.5em;
1062  }
1063  
1064  #course-category-listings li li li li li li li .tree-icon {
1065      margin-left: 5em;
1066  }
1067  
1068  #course-category-listings li li li li li li li li .tree-icon {
1069      margin-left: 5.5em;
1070  }
1071  
1072  .dir-rtl #course-category-listings li .tree-icon {
1073      margin-right: 0;
1074      margin-left: 0.5em;
1075  }
1076  
1077  .dir-rtl #course-category-listings li li .tree-icon {
1078      margin-right: 1em;
1079  }
1080  
1081  .dir-rtl #course-category-listings li li li .tree-icon {
1082      margin-right: 2em;
1083  }
1084  
1085  .dir-rtl #course-category-listings li li li li .tree-icon {
1086      margin-right: 3em;
1087  }
1088  
1089  .dir-rtl #course-category-listings li li li li li .tree-icon {
1090      margin-right: 4em;
1091  }
1092  
1093  .dir-rtl #course-category-listings li li li li li li .tree-icon {
1094      margin-right: 4.5em;
1095  }
1096  
1097  .dir-rtl #course-category-listings li li li li li li li .tree-icon {
1098      margin-right: 5em;
1099  }
1100  
1101  .dir-rtl #course-category-listings li li li li li li li li .tree-icon {
1102      margin-right: 5.5em;
1103  }
1104  
1105  #course-listing .listitem .drag-handle {
1106      display: none;
1107  }
1108  
1109  .jsenabled #course-listing .listitem .drag-handle {
1110      margin-right: 0.5em;
1111      display: inline-block;
1112      cursor: pointer;
1113  }
1114  
1115  #course-listing .listitem .categoryname {
1116      display: inline-block;
1117      margin-left: 1em;
1118      color: #a1a1a8;
1119  }
1120  
1121  #course-listing .listitem .coursename {
1122      display: inline-block;
1123  }
1124  
1125  #category-listing .course-count {
1126      color: #a1a1a8;
1127      margin-right: 2em;
1128      min-width: 3.5em;
1129      display: inline-block;
1130  }
1131  
1132  #category-listing .listitem.collapsed > ul.ml {
1133      display: none;
1134  }
1135  
1136  #category-listing .course-count .smallicon {
1137      width: 0.8em;
1138      height: 0.8em;
1139      margin: 0 0.3em;
1140  }
1141  
1142  .dir-rtl #category-listing .course-count {
1143      margin-left: 2em;
1144      margin-right: 0;
1145  }
1146  
1147  #category-listing .listitem > div > .ba-checkbox {
1148      vertical-align: middle;
1149      width: 2.2em;
1150      text-align: center;
1151      margin: -1px 0;
1152      padding-top: 2px;
1153      margin-right: 0.5em;
1154  }
1155  
1156  .dir-rtl #category-listing .listitem > div > .ba-checkbox {
1157      margin-left: 0.5em;
1158      margin-right: 0.5em;
1159  }
1160  
1161  #category-listing .listitem[data-selected='1']> div> .ba-checkbox {
1162      margin: 0 0.5em 0 0;
1163      padding: 0;
1164  }
1165  
1166  .dir-rtl #category-listing .listitem[data-selected='1']> div> .ba-checkbox {
1167      margin-left: 0.5em;
1168  }
1169  
1170  .category-bulk-actions {
1171      margin: 0 0.5em 0.5em;
1172  }
1173  
1174  #course-category-listings .listitem .idnumber {
1175      color: #a1a1a8;
1176      margin-right: 2em;
1177  }
1178  
1179  #course-category-listings .listitem > div > .float-left {
1180      float: left;
1181  }
1182  
1183  #course-category-listings .listitem > div > .float-right {
1184      float: right;
1185      text-align: right;
1186  }
1187  
1188  .dir-rtl #course-category-listings .listitem > div > .float-left {
1189      float: right;
1190  }
1191  
1192  .dir-rtl #course-category-listings .listitem > div > .float-right {
1193      float: left;
1194      text-align: left;
1195  }
1196  
1197  #course-category-listings .listitem[data-visible="0"],
1198  #course-category-listings .listitem[data-visible="0"]> div> a {
1199      color: #AAA;
1200  }
1201  
1202  #course-category-listings .listitem > div .item-actions .action-hide,
1203  #course-category-listings .listitem[data-visible="0"]> div .item-actions .action-show {
1204      display: inline;
1205  }
1206  
1207  #course-category-listings .listitem > div .item-actions .action-show,
1208  #course-category-listings .listitem[data-visible="0"]> div .item-actions .action-hide,
1209  #category-listing .listitem:first-child > div .item-actions .action-moveup,
1210  #category-listing .listitem:last-child > div .item-actions .action-movedown,
1211  #course-listing > .firstpage .listitem:first-child > div .item-actions .action-moveup,
1212  #course-listing > .lastpage .listitem:last-child > div .item-actions .action-movedown {
1213      display: none;
1214  }
1215  
1216  #course-category-listings .listitem > div a.without-actions {
1217      color: #333;
1218  }
1219  
1220  #course-listing li > div {
1221      padding-left: 1em;
1222  }
1223  
1224  #course-category-listings .detail-pair {
1225      border-bottom: 1px solid #e1e1e8;
1226      margin: 0 1em;
1227  }
1228  
1229  #course-category-listings .detail-pair > * {
1230      display: inline-block;
1231      line-height: 2.2em;
1232  }
1233  
1234  #course-category-listings .detail-pair .pair-key {
1235      font-weight: bold;
1236      text-align: left;
1237  }
1238  
1239  .dir-rtl #course-category-listings .detail-pair .pair-key {
1240      text-align: right;
1241  }
1242  
1243  #course-category-listings .detail-pair .pair-key span {
1244      margin-right: 1em;
1245      display: block;
1246  }
1247  
1248  .dir-rtl #course-category-listings .detail-pair .pair-key span {
1249      margin-right: 0;
1250  }
1251  
1252  #course-category-listings .detail-pair:last-child {
1253      border-bottom-width: 0;
1254  }
1255  
1256  #course-category-listings .bulk-actions .detail-pair > * {
1257      display: block;
1258      width: 100%;
1259  }
1260  
1261  #course-category-listings .bulk-actions .detail-pair .pair-value {
1262      margin-left: 2.2em;
1263  }
1264  
1265  .dir-rtl #course-category-listings .bulk-actions .detail-pair .pair-value {
1266      margin-left: 0;
1267      margin-right: 2.2em;
1268  }
1269  
1270  #course-category-listings .select-a-category .notifymessage,
1271  #course-category-listings .select-a-category .alert {
1272      margin: 1em;
1273  }
1274  
1275  .dir-rtl.jsenabled .moodle-actionmenu[data-enhanced] .menu.align-tr-br {
1276      right: inherit;
1277  }
1278  
1279  /** Management header styling **/
1280  
1281  .coursecat-management-header {
1282      vertical-align: middle;
1283  }
1284  
1285  .coursecat-management-header h2 {
1286      display: inline-block;
1287      text-align: left;
1288  }
1289  
1290  .coursecat-management-header > div {
1291      display: inline-block;
1292  }
1293  
1294  .coursecat-management-header > div > div {
1295      display: inline-block;
1296      margin-left: 1em;
1297  }
1298  
1299  .dir-rtl .coursecat-management-header h2 {
1300      text-align: right;
1301  }
1302  
1303  .dir-rtl .coursecat-management-header > div {
1304      float: left;
1305      margin-right: 1em;
1306      margin-left: 0;
1307  }
1308  
1309  .coursecat-management-header .view-mode-selector .moodle-actionmenu {
1310      display: inline-block;
1311  }
1312  
1313  .coursecat-management-header .view-mode-selector img {
1314      margin-left: 0.5em;
1315      vertical-align: baseline;
1316  }
1317  
1318  .coursecat-management-header select {
1319      max-width: 300px;
1320      white-space: nowrap;
1321  }
1322  
1323  .listing-pagination,
1324  .listing-pagination-totals {
1325      text-align: center;
1326  }
1327  
1328  .listing-pagination .yui3-button {
1329      background-color: #FFF;
1330      border: 0;
1331      margin: 0.4em 0.2em 0.45em;
1332      font-size: 10.4px;
1333  }
1334  
1335  .listing-pagination .yui3-button.active-page {
1336      background-color: #E5EFFD;
1337  }
1338  
1339  .listing-pagination-totals.dimmed {
1340      color: #999;
1341      margin: 0.4em 1em 0.45em;
1342  }
1343  
1344  #category-listing .bulk-action-checkbox {
1345      vertical-align: middle;
1346      margin: 0 0 0.5em 3px;
1347  }
1348  
1349  .dir-rtl #category-listing .bulk-action-checkbox {
1350      vertical-align: middle;
1351      margin: 0 3px 0.5em 0;
1352  }
1353  
1354  #course-listing .bulk-action-checkbox {
1355      margin-right: 0.6em;
1356      vertical-align: middle;
1357      margin-bottom: 0.5em;
1358  }
1359  
1360  /**
1361   * Display sizes:
1362   * Large displays                   1200        +
1363   * Default displays                  980     1199
1364   * Tablets                           768      979
1365   * Small tablets and large phones    481      767
1366   * Phones                              0      480
1367   */
1368  
1369  @media (min-width: 1200px) and (max-width: 1600px) {
1370      #course-category-listings.columns-3 {
1371          background-color: transparent;
1372          border: 0;
1373      }
1374  
1375      #course-category-listings.columns-3 #category-listing,
1376      #course-category-listings.columns-3 #course-listing {
1377          width: 50%;
1378      }
1379  
1380      #course-category-listings.columns-3 #category-listing > div,
1381      #course-category-listings.columns-3 #course-listing > div,
1382      #course-category-listings.columns-3 #course-detail {
1383          border: 1px solid #e1e1e8;
1384          background-color: #FFF;
1385      }
1386  
1387      #course-category-listings.columns-3 #course-detail > div {
1388          border: 0;
1389      }
1390  
1391      #course-category-listings.columns-3 #course-detail {
1392          width: 100%;
1393          margin-top: 1em;
1394      }
1395  }
1396  
1397  @media (max-width: 1199px) {
1398      #course-category-listings.columns-2,
1399      #course-category-listings.columns-3 {
1400          background-color: transparent;
1401          border: 0;
1402      }
1403  
1404      #course-category-listings.columns-2 #category-listing,
1405      #course-category-listings.columns-2 #course-listing,
1406      #course-category-listings.columns-2 #course-detail,
1407      #course-category-listings.columns-3 #category-listing,
1408      #course-category-listings.columns-3 #course-listing,
1409      #course-category-listings.columns-3 #course-detail {
1410          width: 100%;
1411          margin-bottom: 1em;
1412      }
1413  
1414      #course-category-listings.columns-2 #category-listing > div,
1415      #course-category-listings.columns-2 #course-listing > div,
1416      #course-category-listings.columns-2 #course-detail > div,
1417      #course-category-listings.columns-3 #category-listing > div,
1418      #course-category-listings.columns-3 #course-listing > div,
1419      #course-category-listings.columns-3 #course-detail > div {
1420          border: 1px solid #e1e1e8;
1421          background-color: #FFF;
1422      }
1423  }
1424  
1425  /** Custom YUI grid CSS **/
1426  /*csslint duplicate-properties:false */
1427  
1428  
1429  .grid-col {
1430      display: inline-block;
1431      zoom: 1;
1432      *display: inline;
1433      letter-spacing: normal;
1434      word-spacing: normal;
1435      vertical-align: top;
1436      text-rendering: auto;
1437  }
1438  
1439  .grid-col-1 {
1440      display: block;
1441  }
1442  
1443  .grid-col-1-2 {
1444      width: 50%;
1445  }
1446  
1447  .grid-col-1-3 {
1448      width: 33.33333%;
1449  }
1450  
1451  .grid-col-2-3 {
1452      width: 66.66667%;
1453  }
1454  
1455  .grid-col-1-4 {
1456      width: 25%;
1457  }
1458  
1459  .grid-col-3-4 {
1460      width: 75%;
1461  }
1462  
1463  .grid-col-1-5 {
1464      width: 20%;
1465  }
1466  
1467  .grid-col-2-5 {
1468      width: 40%;
1469  }
1470  
1471  .grid-col-3-5 {
1472      width: 60%;
1473  }
1474  
1475  .grid-col-4-5 {
1476      width: 80%;
1477  }
1478  
1479  .grid-col-1-6 {
1480      width: 16.66667%;
1481  }
1482  
1483  .grid-col-5-6 {
1484      width: 83.33333%;
1485  }
1486  
1487  .grid-col-1-7 {
1488      width: 14.28571%;
1489  }
1490  
1491  .grid-col-2-7 {
1492      width: 28.57143%;
1493  }
1494  
1495  .grid-col-3-7 {
1496      width: 42.85714%;
1497  }
1498  
1499  .grid-col-4-7 {
1500      width: 57.14286%;
1501  }
1502  
1503  .grid-col-5-7 {
1504      width: 71.42857%;
1505  }
1506  
1507  .grid-col-6-7 {
1508      width: 85.71429%;
1509  }
1510  
1511  .grid-col-1-8 {
1512      width: 12.5%;
1513  }
1514  
1515  .grid-col-3-8 {
1516      width: 37.5%;
1517  }
1518  
1519  .grid-col-5-8 {
1520      width: 62.5%;
1521  }
1522  
1523  .grid-col-7-8 {
1524      width: 87.5%;
1525  }
1526  
1527  .grid-col-1-9 {
1528      width: 11.11111%;
1529  }
1530  
1531  .grid-col-2-9 {
1532      width: 22.22222%;
1533  }
1534  
1535  .grid-col-4-9 {
1536      width: 44.44444%;
1537  }
1538  
1539  .grid-col-5-9 {
1540      width: 55.55556%;
1541  }
1542  
1543  .grid-col-6-9 {
1544      width: 66.66667%;
1545  }
1546  
1547  .grid-col-7-9 {
1548      width: 77.77778%;
1549  }
1550  
1551  .grid-col-8-9 {
1552      width: 88.88889%;
1553  }
1554  
1555  .grid-col-1-10 {
1556      width: 10%;
1557  }
1558  
1559  .grid-col-3-10 {
1560      width: 30%;
1561  }
1562  
1563  .grid-col-7-10 {
1564      width: 70%;
1565  }
1566  
1567  .grid-col-9-10 {
1568      width: 90%;
1569  }
1570  
1571  .grid-col-1-11 {
1572      width: 9.09091%;
1573  }
1574  
1575  .grid-col-2-11 {
1576      width: 18.18182%;
1577  }
1578  
1579  .grid-col-3-11 {
1580      width: 27.27273%;
1581  }
1582  
1583  .grid-col-4-11 {
1584      width: 36.36364%;
1585  }
1586  
1587  .grid-col-5-11 {
1588      width: 45.45455%;
1589  }
1590  
1591  .grid-col-6-11 {
1592      width: 54.54545%;
1593  }
1594  
1595  .grid-col-7-11 {
1596      width: 63.63636%;
1597  }
1598  
1599  .grid-col-8-11 {
1600      width: 72.72727%;
1601  }
1602  
1603  .grid-col-9-11 {
1604      width: 81.81818%;
1605  }
1606  
1607  .grid-col-10-11 {
1608      width: 90.90909%;
1609  }
1610  
1611  .grid-col-1-12 {
1612      width: 8.33333%;
1613  }
1614  
1615  .grid-col-5-12 {
1616      width: 41.66667%;
1617  }
1618  
1619  .grid-col-7-12 {
1620      width: 58.33333%;
1621  }
1622  
1623  .grid-col-9-12 {
1624      width: 75%;
1625  }
1626  
1627  .grid-col-11-12 {
1628      width: 91.66667%;
1629  }
1630  
1631  .grid-row-r {
1632      letter-spacing: -0.31em;
1633      *letter-spacing: normal;
1634      word-spacing: -0.43em;
1635  }
1636  
1637  .opera-only :-o-prefocus,
1638  .grid-row-r {
1639      word-spacing: -0.43em;
1640  }
1641  
1642  @media (min-width: 980px) {
1643      .grid-visible-phone {
1644          display: none;
1645      }
1646  
1647      .grid-visible-tablet {
1648          display: none;
1649      }
1650  
1651      .grid-hidden-desktop {
1652          display: none;
1653      }
1654  }
1655  
1656  @media (min-width: 980px) {
1657      .grid-visible-phone {
1658          display: none;
1659      }
1660  
1661      .grid-visible-tablet {
1662          display: none;
1663      }
1664  
1665      .grid-hidden-desktop {
1666          display: none;
1667      }
1668  }
1669  
1670  @media (max-width: 480px) {
1671      .grid-row-r > [class ^= "grid-col"] {
1672          width: 100%;
1673      }
1674  }
1675  
1676  @media (max-width: 767px) {
1677      .grid-row-r > [class ^= "grid-col"] {
1678          width: 100%;
1679      }
1680  
1681      .grid-hidden-phone {
1682          display: none;
1683      }
1684  
1685      .grid-visible-desktop {
1686          display: none;
1687      }
1688  
1689      .grid-hidden-phone {
1690          display: none;
1691      }
1692  
1693      .grid-visible-desktop {
1694          display: none;
1695      }
1696  }
1697  
1698  @media (min-width: 768px) and (max-width: 979px) {
1699      .grid-hidden-tablet {
1700          display: none;
1701      }
1702  
1703      .grid-visible-desktop {
1704          display: none;
1705      }
1706  }