theme/noname/scss/moodle/core.scss

   1 /* core.less */
   2
   3 /** Page layout CSS starts **/
   4 .layout-option-noheader #page-header,
   5 .layout-option-nonavbar #page-navbar,
   6 .layout-option-nofooter #page-footer,
   7 .layout-option-nocourseheader .course-content-header,
   8 .layout-option-nocoursefooter .course-content-footer {
   9     display:none;
  10 }
  11
  12 /** Page layout CSS ends **/
  13
  14 .dir-ltr,
  15 .mdl-left {
  16     text-align: left;
  17 }
  18 .dir-rtl,
  19 .mdl-right {
  20     text-align: right;
  21 }
  22 #add,
  23 #remove,
  24 .centerpara,
  25 .mdl-align {
  26     text-align: center;
  27 }
  28 a.dimmed,
  29 a.dimmed:link,
  30 a.dimmed:visited,
  31 a.dimmed_text,
  32 a.dimmed_text:link,
  33 a.dimmed_text:visited,
  34 .dimmed_text,
  35 .dimmed_text a,
  36 .dimmed_text a:link,
  37 .dimmed_text a:visited,
  38 .usersuspended,
  39 .usersuspended a,
  40 .usersuspended a:link,
  41 .usersuspended a:visited,
  42 .dimmed_category,
  43 .dimmed_category a {
  44     @extend .text-muted
  45 }
  46 .activity.label .dimmed_text {
  47     opacity: 0.5;
  48 }
  49 .unlist,
  50 .unlist li,
  51 .inline-list,
  52 .inline-list li,
  53 .block .list,
  54 .block .list li,
  55 .section li.activity,
  56 .section li.movehere,
  57 .tabtree li {
  58     list-style: none;
  59     margin: 0;
  60     padding: 0;
  61 }
  62 .inline,
  63 .inline-list li {
  64     display: inline;
  65 }
  66 .notifytiny {
  67     font-size: $font-size-xs;
  68 }
  69 .notifytiny li,
  70 .notifytiny td {
  71     font-size: 100%;
  72 }
  73 .red,
  74 .notifyproblem {
  75     @extend .text-warning;
  76 }
  77 .green,
  78 .notifysuccess {
  79     @extend .text-success;
  80 }
  81 .highlight {
  82     @extend .text-info;
  83 }
  84 .reportlink {
  85     text-align: right;
  86 }
  87 a.autolink.glossary:hover {
  88     cursor: help;
  89 }
  90 /* Block which is hidden if javascript enabled, prevents fickering visible when JS from footer used! */
  91 .collapsibleregioncaption {
  92     white-space: nowrap;
  93 }
  94 .pagelayout-mydashboard.jsenabled .collapsibleregioncaption {
  95     cursor: pointer;
  96 }
  97 .collapsibleregioncaption img {
  98     vertical-align: middle;
  99 }
 100
 101 .jsenabled .hiddenifjs {
 102     display: none;
 103 }
 104 .visibleifjs {
 105     display: none;
 106 }
 107 .jsenabled .visibleifjs {
 108     display: inline;
 109 }
 110 .jsenabled .collapsibleregion {
 111     overflow: hidden;
 112 }
 113 .jsenabled .collapsed .collapsibleregioninner {
 114     visibility: hidden;
 115 }
 116 .collapsible-actions {
 117     display: none;
 118     text-align: right;
 119 }
 120 .jsenabled .collapsible-actions {
 121     display: block;
 122 }
 123 .collapsible-actions .collapseexpand {
 124     padding-left: 20px;
 125     background: url([[pix:t/collapsed]]) 2px center no-repeat;
 126 }
 127 /* rtl:ignore */
 128 .dir-rtl .collapsible-actions .collapseexpand {
 129     background: url([[pix:t/collapsed_rtl]]) right center no-repeat;
 130 }
 131 .collapsible-actions .collapse-all {
 132     background-image: url([[pix:t/expanded]]);
 133 }
 134 .yui-overlay .yui-widget-bd {
 135     background-color: #FFEE69;
 136     border: 1px solid #A6982B;
 137     border-top-color: #D4C237;
 138     color: #000000;
 139     left: 0;
 140     padding: 2px 5px;
 141     position: relative;
 142     top: 0;
 143     z-index: 1;
 144 }
 145 .clearer {
 146     background: transparent;
 147     border-width: 0;
 148     clear: both;
 149     display: block;
 150     height: 1px;
 151     margin: 0;
 152     padding: 0;
 153 }
 154 .bold,
 155 .warning,
 156 .errorbox .title,
 157 .pagingbar .title,
 158 .pagingbar .thispage {
 159     font-weight: bold;
 160 }
 161 img.resize {
 162     height: 1em;
 163     width: 1em;
 164 }
 165 .action-menu {
 166     white-space: nowrap;
 167 }
 168 .action-menu img {
 169     width: 16px;
 170     height: 16px;
 171     box-sizing: content-box;
 172     padding-right: 0.5rem;
 173 }
 174 .action-menu .userpicture {
 175     width: auto;
 176     height: auto;
 177     padding-left: 1rem;
 178 }
 179 .mform {
 180     max-width: 720px;
 181 }
 182 .block img.resize,
 183 .breadcrumb img.resize {
 184     height: 0.9em;
 185     width: 0.8em;
 186 }
 187 /* Icon styles */
 188 img.icon,
 189 img.iconhelp, .helplink img {
 190     height: 16px;
 191     vertical-align: text-bottom;
 192     width: 16px;
 193     padding-right: 0.5rem;
 194     box-sizing: content-box;
 195 }
 196 img.iconlarge {
 197     height: 24px;
 198     width: 24px;
 199     vertical-align: middle;
 200 }
 201 img.iconsort {
 202     vertical-align: text-bottom;
 203     padding-left: .3em;
 204     margin-bottom: .15em;
 205 }
 206 img.icontoggle {
 207     height: 17px;
 208     vertical-align: middle;
 209     width: 50px;
 210 }
 211 img.iconkbhelp {
 212     height: 17px;
 213     width: 49px;
 214 }
 215 .boxaligncenter {
 216     margin-left: auto;
 217     margin-right: auto;
 218 }
 219 .boxalignright {
 220     margin-left: auto;
 221     margin-right: 0;
 222 }
 223 .boxalignleft {
 224     margin-left: 0;
 225     margin-right: auto;
 226 }
 227 .boxwidthnarrow {
 228     width: 30%;
 229 }
 230 .boxwidthnormal {
 231     width: 50%;
 232 }
 233 .boxwidthwide {
 234     width: 80%;
 235 }
 236 .headermain {
 237     font-weight: bold;
 238 }
 239 #maincontent {
 240     display: block;
 241     height: 1px;
 242     overflow: hidden;
 243 }
 244 img.uihint {
 245     cursor: help;
 246 }
 247 #addmembersform table {
 248     margin-left: auto;
 249     margin-right: auto;
 250 }
 251 table.flexible .emptyrow {
 252     display: none;
 253 }
 254 img.emoticon {
 255     vertical-align: middle;
 256     width: 15px;
 257     height: 15px;
 258 }
 259 form.popupform,
 260 form.popupform div {
 261     display: inline;
 262 }
 263 .arrow_button input {
 264     overflow: hidden;
 265 }
 266 /** The 1-pixel padding is there to avoid phantom scroll bars on OS X (FF, Safari and Chrome)**/
 267 .no-overflow {
 268     overflow: auto;
 269     padding-bottom: 1px;
 270 }
 271 .pagelayout-report .no-overflow {
 272     overflow: visible;
 273 }
 274 .no-overflow > .generaltable {
 275     margin-bottom: 0;
 276 }
 277 // Accessibility features
 278
 279 // Accessibility: text 'seen' by screen readers but not visual users.
 280 .accesshide {
 281     position: absolute;
 282     left: -10000px;
 283     font-weight: normal;
 284     font-size: 1em;
 285 }
 286 span.hide,
 287 div.hide {
 288     display: none;
 289 }
 290 // Accessibility: Skip block link, for keyboard-only users.
 291 a.skip-block,
 292 a.skip {
 293     position: absolute;
 294     top: -1000em;
 295     font-size: 0.85em;
 296     text-decoration: none;
 297 }
 298 a.skip-block:focus,
 299 a.skip-block:active,
 300 a.skip:focus,
 301 a.skip:active {
 302     position: static;
 303     display: block;
 304 }
 305 .skip-block-to {
 306     display: block;
 307     height: 1px;
 308     overflow: hidden;
 309 }
 310 // Blogs
 311 .addbloglink {
 312     text-align: center;
 313 }
 314 .blog_entry .audience {
 315     text-align: right;
 316     padding-right: 4px;
 317 }
 318 .blog_entry .tags {
 319     margin-top: 15px;
 320 }
 321 .blog_entry .content {
 322     margin-left: 43px;
 323 }
 324 // Group
 325 #page-group-index #groupeditform {
 326     text-align: center;
 327 }
 328 #doc-contents h1 {
 329     margin: 1em 0 0 0;
 330 }
 331 #doc-contents ul {
 332     margin: 0;
 333     padding: 0;
 334     width: 90%;
 335 }
 336 #doc-contents ul li {
 337     list-style-type: none;
 338 }
 339 .groupmanagementtable td {
 340     vertical-align: top;
 341 }
 342 .groupmanagementtable #existingcell,
 343 .groupmanagementtable #potentialcell {
 344     width: 42%;
 345 }
 346 .groupmanagementtable #buttonscell {
 347     width: 16%;
 348 }
 349 .groupmanagementtable #buttonscell p.arrow_button input {
 350     width: auto;
 351     min-width: 80%;
 352     margin: 0 auto;
 353 }
 354 .groupmanagementtable #removeselect_wrapper,
 355 .groupmanagementtable #addselect_wrapper {
 356     width: 100%;
 357 }
 358 .groupmanagementtable #removeselect_wrapper label,
 359 .groupmanagementtable #addselect_wrapper label {
 360     font-weight: normal;
 361 }
 362 #group-usersummary {
 363     width: 14em;
 364 }
 365 .groupselector {
 366     margin-top: 3px;
 367     margin-bottom: 3px;
 368     display: inline-block;
 369 }
 370 .groupselector label {
 371     display: inline-block;
 372 }
 373 // Data format selector
 374 .dataformatselector {
 375     margin: 1em 0;
 376 }
 377 .dataformatselector label {
 378     display: inline-block;
 379     margin: 0 5px 10px 0;
 380     line-height: 30px;
 381     vertical-align: top;
 382 }
 383
 384 // Login
 385 .loginbox {
 386     margin: 15px;
 387     overflow: visible;
 388 }
 389 .loginbox.twocolumns {
 390     margin: 15px;
 391 }
 392 .loginbox h2,
 393 .loginbox .subcontent {
 394     margin: 5px;
 395     padding: 10px;
 396     text-align: center;
 397 }
 398 .loginbox .loginpanel .desc {
 399     margin: 0;
 400     padding: 0;
 401     margin-bottom: 5px;
 402     margin-top:15px;
 403 }
 404 .loginbox .signuppanel .subcontent {
 405     text-align: left;
 406 }
 407 .loginbox .loginsub {
 408     margin-left: 0;
 409     margin-right: 0;
 410 }
 411 .loginbox .guestsub,
 412 .loginbox .forgotsub,
 413 .loginbox .potentialidps {
 414     margin: 5px 12%;
 415 }
 416 .loginbox .potentialidps .potentialidplist {
 417     margin-left: 40%;
 418 }
 419 .loginbox .potentialidps .potentialidplist div {
 420     text-align: left;
 421 }
 422 .loginbox .loginform {
 423     margin-top: 1em;
 424     text-align: left;
 425 }
 426 .loginbox .loginform .form-label {
 427     float: left;
 428     text-align: right;
 429     width: 49%;
 430     white-space: nowrap;
 431 }
 432 .loginbox .loginform .form-input {
 433     float: right;
 434     width: 50%;
 435 }
 436 .loginbox .loginform .form-input input {
 437     width: 6em;
 438 }
 439 .loginbox .signupform {
 440     margin-top: 1em;
 441     text-align: center;
 442 }
 443 .loginbox.twocolumns .loginpanel,
 444 .loginbox.twocolumns .signuppanel {
 445     width: 48%;
 446     border: 0;
 447     margin: 0;
 448     padding: 0;
 449     display: block;
 450     float: left;
 451     margin-left: 2.76243%;
 452     min-height: 30px;
 453     margin-bottom: -2000px;
 454     padding-bottom: 2000px;
 455 //  @include box-sizing(border-box);
 456 }
 457
 458 // Notes
 459 .notepost {
 460     margin-bottom: 1em;
 461 }
 462 .notepost .userpicture {
 463     float: left;
 464     margin-right: 5px;
 465 }
 466 .notepost .content,
 467 .notepost .footer {
 468     clear: both;
 469 }
 470 .notesgroup {
 471     margin-left: 20px;
 472 }
 473
 474 // My Moodle
 475 .path-my .coursebox .overview {
 476     margin: 15px 30px 10px 30px;
 477 }
 478 .path-my .coursebox .info {
 479     float: none;
 480     margin: 0;
 481 }
 482
 483 // Modules
 484 .mod_introbox {
 485     padding: 10px;
 486 }
 487 table.mod_index {
 488     width: 100%;
 489 }
 490
 491 // Comments
 492 .comment-ctrl {
 493     font-size: 12px;
 494     display: none;
 495     margin: 0;
 496     padding: 0;
 497 }
 498 .comment-ctrl h5 {
 499     margin: 0;
 500     padding: 5px;
 501 }
 502 .comment-area {
 503     max-width: 400px;
 504     padding: 5px;
 505 }
 506 .comment-area textarea {
 507     width: 100%;
 508     overflow: auto;
 509     &.fullwidth {
 510         -webkit-box-sizing: border-box;
 511         -moz-box-sizing: border-box;
 512         box-sizing: border-box;
 513     }
 514 }
 515 .comment-area .fd {
 516     text-align: right;
 517 }
 518 .comment-meta span {
 519     color: gray;
 520 }
 521 .comment-link img {
 522     vertical-align: text-bottom;
 523 }
 524 .comment-list {
 525     font-size: 11px;
 526     overflow: auto;
 527     list-style: none;
 528     padding: 0;
 529     margin: 0;
 530 }
 531 .comment-list li {
 532     margin: 2px;
 533     list-style: none;
 534     margin-bottom: 5px;
 535     clear: both;
 536     padding: .3em;
 537     position: relative;
 538 }
 539 .comment-list li.first {
 540     display: none
 541 }
 542 .comment-paging{
 543     text-align: center;
 544 }
 545 .comment-paging .pageno{
 546     padding: 2px;
 547 }
 548 .comment-paging .curpage{
 549     border: 1px solid #CCC;
 550 }
 551 .comment-message .picture {
 552     width: 20px;
 553     float: left;
 554 }
 555 .comment-message .text {
 556     margin: 0;
 557     padding: 0;
 558 }
 559 .comment-message .text p {
 560     padding: 0;
 561     margin: 0 18px 0 0;
 562 }
 563 .comment-delete {
 564     position: absolute;
 565     top: 0;
 566     right: 0;
 567     margin: .3em;
 568 }
 569 .comment-report-selectall{
 570     display: none
 571 }
 572 .comment-link {
 573     display: none
 574 }
 575 .jsenabled .comment-link {
 576     display: block
 577 }
 578 .jsenabled .showcommentsnonjs{
 579     display: none
 580 }
 581 .jsenabled .comment-report-selectall{
 582     display: inline
 583 }
 584 /**
 585 * Completion progress report
 586 */
 587 .completion-expired {
 588     @extend .text-warning;
 589 }
 590 .completion-expected {
 591     font-size: $font-size-xs;
 592 }
 593 .completion-sortchoice,
 594 .completion-identifyfield {
 595     font-size: $font-size-xs;
 596     vertical-align: bottom;
 597 }
 598 .completion-progresscell {
 599     text-align: right;
 600 }
 601 .completion-expired .completion-expected {
 602     font-weight: bold;
 603 }
 604 /**
 605 * Tags
 606 */
 607 img.user-image {
 608     height: 100px;
 609     width: 100px;
 610 }
 611 #tag-search-box {
 612     text-align: center;
 613     margin: 10px auto;
 614 }
 615
 616 .path-tag .tag-index-items .tagarea {
 617     border: 1px solid #E3E3E3;
 618     border-radius: 4px;
 619     padding: 10px;
 620     margin-top: 10px;
 621 }
 622
 623 .path-tag .tag-index-items .tagarea h3 {
 624     display: block;
 625     padding: 3px 0 10px 0;
 626     margin: 0px;
 627     font-size: 1.1em;
 628     font-weight: bold;
 629     line-height: 20px;
 630     color: #999;
 631     text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.5);
 632     text-transform: uppercase;
 633     word-wrap: break-word;
 634     border-bottom: solid 1px #E3E3E3;
 635     margin-bottom: 10px;
 636 }
 637
 638 .path-tag .tagarea .controls,
 639 .path-tag .tagarea .taggeditems {
 640     @include clearfix();
 641 }
 642 .path-tag .tagarea .controls,
 643 .path-tag .tag-backtoallitems {
 644     text-align: center;
 645 }
 646 .path-tag .tagarea .controls .gotopage.nextpage {
 647     float: right;
 648 }
 649 .path-tag .tagarea .controls .gotopage.prevpage {
 650     float: left;
 651 }
 652 .path-tag .tagarea .controls .exclusivemode {
 653     display: inline-block;
 654 }
 655 .path-tag .tagarea .controls.controls-bottom {
 656     margin-top: 5px;
 657 }
 658 .path-tag .tagarea .controls .gotopage.nextpage::after {
 659     padding-right: 5px;
 660     padding-left: 5px;
 661     content: "»";
 662 }
 663 .path-tag .tagarea .controls .gotopage.prevpage::before {
 664     padding-right: 5px;
 665     padding-left: 5px;
 666     content: "«";
 667 }
 668
 669 span.flagged-tag,
 670 tr.flagged-tag,
 671 span.flagged-tag a,
 672 tr.flagged-tag a {
 673     @extend .text-warning;
 674 }
 675 .tag-management-table td,
 676 .tag-management-table th {
 677     vertical-align: middle;
 678     padding: 4px;
 679 }
 680 .tag-management-table .inplaceeditable.inplaceeditingon input {
 681     width: 150px;
 682 }
 683 .path-admin-tag .addstandardtags {
 684     float: right;
 685     img {
 686         margin: 0 5px;
 687     }
 688 }
 689 .path-tag .tag-relatedtags {
 690     padding-top: 10px;
 691 }
 692 .path-tag .tag-management-box {
 693     text-align: right;
 694 }
 695 .path-tag .tag-index-toc {
 696     padding: 10px;
 697     text-align: center;
 698 }
 699 .path-tag .tag-index-toc li,
 700 .path-tag .tag-management-box li {
 701     margin-left: 5px;
 702     margin-right: 5px;
 703 }
 704 .path-tag .tag-management-box li a.edittag {
 705     background-image: url([[pix:moodle|i/settings]]);
 706 }
 707 .path-tag .tag-management-box li a.flagasinappropriate {
 708     background-image: url([[pix:moodle|i/flagged]]);
 709 }
 710 .path-tag .tag-management-box li a.removefrommyinterests {
 711     background-image: url([[pix:moodle|t/delete]]);
 712 }
 713 .path-tag .tag-management-box li a.addtomyinterests {
 714     background-image: url([[pix:moodle|t/add]]);
 715 }
 716 .path-tag .tag-management-box li a {
 717     background-repeat: no-repeat;
 718     background-position: left;
 719     padding-left: 17px;
 720 }
 721 .tag_feed.media-list .media .itemimage {
 722     float: left;
 723 }
 724 .tag_feed.media-list .media .itemimage img {
 725     height: 35px;
 726     width: 35px;
 727 }
 728 .tag_feed.media-list .media .media-body {
 729     padding-right: 10px;
 730     padding-left: 10px;
 731 }
 732 .tag_feed .media .muted a {
 733     @extend .text-muted;
 734 }
 735 .tag_cloud {
 736     text-align: center;
 737 }
 738 .tag_cloud .inline-list li {
 739     padding: 0px 0.2em;
 740 }
 741 .tag_cloud .tag_overflow {
 742     margin-top: 1em;
 743     font-style: italic;
 744 }
 745 .tag_cloud .s20 {
 746     font-size: 2.7em;
 747 }
 748 .tag_cloud .s19 {
 749     font-size: 2.6em;
 750 }
 751 .tag_cloud .s18 {
 752     font-size: 2.5em;
 753 }
 754 .tag_cloud .s17 {
 755     font-size: 2.4em;
 756 }
 757 .tag_cloud .s16 {
 758     font-size: 2.3em;
 759 }
 760 .tag_cloud .s15 {
 761     font-size: 2.2em;
 762 }
 763 .tag_cloud .s14 {
 764     font-size: 2.1em;
 765 }
 766 .tag_cloud .s13 {
 767     font-size: 2em;
 768 }
 769 .tag_cloud .s12 {
 770     font-size: 1.9em;
 771 }
 772 .tag_cloud .s11 {
 773     font-size: 1.8em;
 774 }
 775 .tag_cloud .s10 {
 776     font-size: 1.7em;
 777 }
 778 .tag_cloud .s9 {
 779     font-size: 1.6em;
 780 }
 781 .tag_cloud .s8 {
 782     font-size: 1.5em;
 783 }
 784 .tag_cloud .s7 {
 785     font-size: 1.4em;
 786 }
 787 .tag_cloud .s6 {
 788     font-size: 1.3em;
 789 }
 790 .tag_cloud .s5 {
 791     font-size: 1.2em;
 792 }
 793 .tag_cloud .s4 {
 794     font-size: 1.1em;
 795 }
 796 .tag_cloud .s3 {
 797     font-size: 1em;
 798 }
 799 .tag_cloud .s2 {
 800     font-size: 0.9em;
 801 }
 802 .tag_cloud .s1 {
 803     font-size: 0.8em;
 804 }
 805 .tag_cloud .s0 {
 806     font-size: 0.7em;
 807 }
 808 .tag_list ul {
 809     display: inline;
 810 }
 811 .tag_list.hideoverlimit .overlimit {
 812     display:none;
 813 }
 814 .tag_list .tagmorelink {
 815     display:none;
 816 }
 817 .tag_list.hideoverlimit .tagmorelink {
 818     display:inline;
 819 }
 820 .tag_list.hideoverlimit .taglesslink {
 821     display:none;
 822 }
 823
 824 /**
 825 * Web Service
 826 */
 827 #webservice-doc-generator td {
 828     text-align: left;
 829     border: 0 solid black;
 830 }
 831 /**
 832 * Smart Select Element
 833 */
 834 .smartselect {
 835     position: absolute;
 836 }
 837 .smartselect .smartselect_mask {
 838     background-color: #fff;
 839 }
 840 .smartselect ul  {
 841     padding: 0;
 842     margin: 0;
 843 }
 844 .smartselect ul li {
 845     list-style: none;
 846 }
 847 .smartselect .smartselect_menu {
 848     margin-right: 5px;
 849 }
 850 .safari .smartselect .smartselect_menu {
 851     margin-left: 2px;
 852 }
 853 .smartselect .smartselect_menu,
 854 .smartselect .smartselect_submenu {
 855     border: 1px solid #000;
 856     background-color: #FFF;
 857     display: none;
 858 }
 859 .smartselect .smartselect_menu.visible,
 860 .smartselect .smartselect_submenu.visible {
 861     display: block;
 862 }
 863 .smartselect .smartselect_menu_content ul li {
 864     position: relative;
 865     padding: 2px 5px;
 866 }
 867 .smartselect .smartselect_menu_content ul li a {
 868     color: #333;
 869     text-decoration: none;
 870 }
 871 .smartselect .smartselect_menu_content ul li a.selectable {
 872     color: inherit;
 873 }
 874 .smartselect .smartselect_submenuitem {
 875     background-image: url([[pix:moodle|t/collapsed]]);
 876     background-repeat: no-repeat;
 877     background-position: 100%;
 878 }
 879 /** Spanning mode */
 880 .smartselect.spanningmenu .smartselect_submenu {
 881     position: absolute;
 882     top: -1px;
 883     left: 100%;
 884 }
 885 .smartselect.spanningmenu .smartselect_submenu a {
 886     white-space: nowrap;
 887     padding-right: 16px;
 888 }
 889 .smartselect.spanningmenu .smartselect_menu_content ul li a.selectable:hover {
 890     text-decoration: underline;
 891 }
 892 /** Compact mode */
 893 .smartselect.compactmenu .smartselect_submenu {
 894     position: relative;
 895     margin: 2px -3px;
 896     margin-left: 10px;
 897     display: none;
 898     border-width: 0;
 899     z-index: 1010;
 900 }
 901 .smartselect.compactmenu .smartselect_submenu.visible {
 902     display: block;
 903 }
 904 .smartselect.compactmenu .smartselect_menu {
 905     z-index: 1000;
 906     overflow: hidden;
 907 }
 908 .smartselect.compactmenu .smartselect_submenu .smartselect_submenu {
 909     z-index: 1020;
 910 }
 911 .smartselect.compactmenu .smartselect_submenuitem:hover > .smartselect_menuitem_label {
 912     font-weight: bold;
 913 }
 914 /**
 915 * Registration
 916 */
 917 #page-admin-registration-register .registration_textfield {
 918     width: 300px;
 919 }
 920 /**
 921 * Enrol
 922 */
 923 .userenrolment {
 924     width: 100%;
 925     border-collapse: collapse;
 926 }
 927 .userenrolment tr {
 928     vertical-align:top;
 929 }
 930 .userenrolment td {
 931     padding: 0;
 932     height: 41px;
 933 }
 934 .userenrolment .subfield {
 935     margin-right: 5px;
 936 }
 937 .userenrolment .col_userdetails .subfield {
 938     margin-left: 40px;
 939 }
 940 .userenrolment .col_userdetails .subfield_picture {
 941     float: left;
 942     margin-left: 0;
 943 }
 944 .userenrolment .col_lastseen {
 945     width: 150px;
 946 }
 947 .userenrolment .col_role {
 948     width: 262px;
 949 }
 950 .userenrolment .col_role .roles,
 951 .userenrolment .col_group .groups {
 952     margin-right: 30px;
 953 }
 954 .userenrolment .col_role .role,
 955 .userenrolment .col_group .group {
 956     float: left;
 957     padding: 3px;
 958     margin: 3px;
 959     white-space: nowrap;
 960 }
 961 .userenrolment .col_role .role a,
 962 .userenrolment .col_group .group a {
 963     margin-left: 3px;
 964     cursor: pointer;
 965 }
 966 .userenrolment .col_role .addrole,
 967 .userenrolment .col_group .addgroup {
 968     float: right;
 969     padding: 3px;
 970     margin: 3px;
 971     > a:hover {
 972         border-bottom:1px solid #666;
 973     }
 974 }
 975 .userenrolment .col_role .addrole img,
 976 .userenrolment .col_group .addgroup img {
 977     vertical-align: baseline;
 978 }
 979
 980 .userenrolment .hasAllRoles .col_role .addrole {
 981     display: none;
 982 }
 983
 984 .userenrolment .col_enrol .enrolment {
 985     float: left;
 986     padding: 3px;
 987     margin: 3px;
 988 }
 989 .userenrolment .col_enrol .enrolment a {
 990     float: right;
 991     margin-left: 3px;
 992 }
 993 #page-enrol-users {
 994     .enrol_user_buttons {
 995         float: right;
 996         .enrolusersbutton {
 997             display: inline;
 998             div,
 999             form {
1000                 display: inline;
1001                 margin-right: 0;
1002             }
1003         }
1004     }
1005     #filterform {
1006         @extend .card;
1007         display: inline-block;
1008         .fitem {
1009             display: inline-block;
1010             line-height: $line-height * 2;
1011             margin-right: .3em;
1012             white-space: nowrap;
1013             label {
1014                 display: inline;
1015                 line-height: $line-height;
1016                 padding-right: .3em;
1017             }
1018             :before,
1019             :after {
1020                 display: inline;
1021             }
1022         }
1023         div,
1024         fieldset {
1025             display: inline;
1026             float: none;
1027             clear: none;
1028             width: auto;
1029             margin: 0;
1030         }
1031         select,
1032         .ftext input {
1033             width: 7em;
1034         }
1035         input,
1036         select {
1037             margin-bottom: 0;
1038         }
1039     }
1040   .user-enroller-panel .uep-search-results .user .details {
1041     width: 237px;
1042   }
1043   .user-enroller-panel .uep-search-results .cohort .details {
1044     width: 237px;
1045   }
1046 }
1047 #page-enrol-users .enrol-users-page-action input {
1048     margin-left: 0
1049 }
1050 .corelightbox {
1051     background-color: #CCC;
1052     position: absolute;
1053     top: 0;
1054     left: 0;
1055     width: 100%;
1056     height: 100%;
1057     text-align: center;
1058 }
1059 .corelightbox img {
1060     position: fixed;
1061     top: 50%;
1062     left: 50%;
1063 }
1064
1065 .mod-indent-outer {
1066     display: table;
1067 }
1068 .mod-indent {
1069     display: table-cell;
1070 }
1071 .label .mod-indent {
1072   float:left;
1073   padding-top:20px
1074 }
1075
1076 $mod-indent-size: 30px;
1077 /* Creates a series of .mod-indent-# rule declarations based on indent size and number of indent levels. */
1078 @for $i from 1 through 16 {
1079    $width: ($i * $mod-indent-size);
1080
1081    .mod-indent-#{$i} {
1082        width: $width;
1083    }
1084 }
1085 .mod-indent-huge {
1086    width: (16 * $mod-indent-size);
1087 }
1088
1089 /* Audio player size in 'block' mode (can only change width, height is hardcoded in JS) */
1090 .resourcecontent .mediaplugin_mp3 object {
1091     height: 25px;
1092     width: 600px
1093 }
1094 .resourcecontent audio.mediaplugin_html5audio {
1095     width: 600px
1096 }
1097 /** Large resource images should avoid hidden overflow **/
1098 .resourceimage {
1099     max-width: 100%;
1100 }
1101 /* Audio player size in 'inline' mode (can only change width, as above) */
1102 .mediaplugin_mp3 object {
1103     height: 15px;
1104     width: 300px
1105 }
1106 audio.mediaplugin_html5audio {
1107     width: 300px
1108 }
1109 /* TinyMCE moodle media preview frame should not have padding */
1110 .core_media_preview.pagelayout-embedded #content {
1111     padding: 0;
1112 }
1113 .core_media_preview.pagelayout-embedded #maincontent {
1114     height: 0;
1115 }
1116 body#page-lib-editor-tinymce-plugins-moodlemedia-preview {
1117     padding: 0;
1118     margin: 0;
1119     min-width: 0;
1120     background: none;
1121 }
1122 .path-rating .ratingtable {
1123     width: 100%;
1124     margin-bottom: 1em;
1125 }
1126 .path-rating .ratingtable th.rating {
1127     width: 100%;
1128 }
1129 .path-rating .ratingtable td.rating,
1130 .path-rating .ratingtable td.time {
1131     white-space: nowrap;
1132     text-align: center;
1133 }
1134 .initialbar {
1135     a, strong {
1136         padding-left: 3px;
1137         padding-right: 3px;
1138     }
1139 }
1140
1141 /* Moodle Dialogue Settings (moodle-core-dialogue)  */
1142 .moodle-dialogue-base .moodle-dialogue-lightbox {
1143     background-color: #AAA;
1144 }
1145 .moodle-dialogue-base .hidden,
1146 .moodle-dialogue-base .moodle-dialogue-hidden {
1147     display: none;
1148 }
1149 .no-scrolling {
1150     overflow: hidden;
1151 }
1152 .moodle-dialogue-base .moodle-dialogue-fullscreen {
1153     left: 0px;
1154     top: 0px;
1155     right: 0px;
1156     bottom: -50px;
1157     position: fixed;
1158 }
1159 .moodle-dialogue-base .moodle-dialogue-fullscreen .moodle-dialogue-content {
1160     overflow: auto;
1161 }
1162 .moodle-dialogue-base .moodle-dialogue-fullscreen .closebutton {
1163     width: 28px;
1164     height: 16px;
1165     background-size: 100%;
1166 }
1167 .moodle-dialogue-base .moodle-dialogue-wrap.moodle-dialogue-content {
1168     @extend .modal-content;
1169 }
1170 .moodle-dialogue-base .moodle-dialogue-wrap .moodle-dialogue-hd {
1171     @extend .modal-header;
1172 }
1173 .moodle-dialogue-base .moodle-dialogue-wrap .moodle-dialogue-hd.yui3-widget-hd {
1174     // Undo some YUI damage.
1175     min-height: 3rem;
1176     color: initial;
1177     background-color: initial;
1178     background: initial;
1179     font-size: 1.5rem;
1180     line-height: 1.5;
1181 }
1182 .moodle-dialogue-base .moodle-dialogue-wrap .moodle-dialogue-hd h1 {
1183     @extend .modal-title;
1184 }
1185 .moodle-dialogue-base .moodle-dialogue-wrap .moodle-dialogue-hd .yui3-widget-buttons {
1186     padding: 5px;
1187 }
1188 .moodle-dialogue-base .closebutton {
1189     @extend .close;
1190     margin: 0;
1191     padding: 10px ! important;
1192     background: 0;
1193     border-style: none;
1194     box-shadow: none;
1195 }
1196 .moodle-dialogue-base .closebutton::after {
1197     content: "×";
1198 }
1199 .moodle-dialogue-base .moodle-dialogue .moodle-dialogue-bd {
1200     @extend .modal-body;
1201 }
1202
1203 .moodle-dialogue-base .moodle-dialogue-fullscreen .moodle-dialogue-content {
1204     overflow: auto;
1205     position: absolute;
1206     top: 0px;
1207     bottom: 50px;
1208     left: 0px;
1209     right: 0px;
1210     margin: 0px;
1211     border: 0px;
1212 }
1213 .moodle-dialogue-confirm .confirmation-dialogue {
1214     text-align: center;
1215 }
1216 .moodle-dialogue-confirm .confirmation-dialogue input {
1217     text-align: center;
1218 }
1219 .moodle-dialogue-exception .moodle-exception-message {
1220     text-align: center
1221 }
1222 .moodle-dialogue-exception .moodle-exception-param label {
1223     font-weight: bold;
1224 }
1225 .moodle-dialogue-exception .param-stacktrace label {
1226     background-color: #EEE;
1227     border: 1px solid #ccc;
1228     border-bottom-width: 0;
1229 }
1230 .moodle-dialogue-exception .param-stacktrace pre {
1231     border: 1px solid #ccc;
1232     background-color: #fff;
1233 }
1234 .moodle-dialogue-exception .param-stacktrace .stacktrace-file {
1235     color: navy;
1236     font-size: $font-size-sm;
1237 }
1238 .moodle-dialogue-exception .param-stacktrace .stacktrace-line {
1239     @extend .text-warning;
1240     font-size: $font-size-sm;
1241 }
1242 .moodle-dialogue-exception .param-stacktrace .stacktrace-call {
1243     color: #333;
1244     font-size: 90%;
1245     border-bottom: 1px solid #eee;
1246 }
1247 .moodle-dialogue-base .moodle-dialogue .moodle-dialogue-content .moodle-dialogue-ft {
1248     @extend .modal-footer;
1249 }
1250 .moodle-dialogue-base .moodle-dialogue .moodle-dialogue-content .moodle-dialogue-ft.yui3-widget-ft {
1251     // Undo some YUI damage.
1252     background: initial;
1253 }
1254 .moodle-dialogue-confirm .confirmation-message {
1255     margin: 0.5em 1em;
1256 }
1257 .moodle-dialogue-confirm .confirmation-dialogue input {
1258     min-width: 80px
1259 }
1260 .moodle-dialogue-exception .moodle-exception-message {
1261     margin: 1em;
1262 }
1263 .moodle-dialogue-exception .moodle-exception-param {
1264     margin-bottom: 0.5em;
1265 }
1266 .moodle-dialogue-exception .moodle-exception-param label {
1267     width: 150px;
1268 }
1269 .moodle-dialogue-exception .param-stacktrace label {
1270     display: block;
1271     margin: 0;
1272     padding: 4px 1em;
1273 }
1274 .moodle-dialogue-exception .param-stacktrace pre {
1275     display: block;
1276     height: 200px;
1277     overflow: auto;
1278 }
1279 .moodle-dialogue-exception .param-stacktrace .stacktrace-file {
1280     display: inline-block;
1281     margin: 4px 0;
1282 }
1283 .moodle-dialogue-exception .param-stacktrace .stacktrace-line {
1284     display: inline-block;
1285     width: 50px;
1286     margin: 4px 1em;
1287 }
1288 .moodle-dialogue-exception .param-stacktrace .stacktrace-call {
1289     padding-left: 25px;
1290     margin-bottom: 4px;
1291     padding-bottom: 4px;
1292 }
1293 .moodle-dialogue .moodle-dialogue-bd .content-lightbox {
1294     opacity: 0.75;
1295     width: 100%;
1296     height: 100%;
1297     top: 0;
1298     left: 0;
1299     background-color: white;
1300     text-align: center;
1301     padding: 10% 0;
1302 }
1303 /* Apply a default max-height on tooltip text */
1304 .moodle-dialogue .tooltiptext {
1305     max-height: 300px;
1306 }
1307
1308 .moodle-dialogue-base .moodle-dialogue.moodle-dialogue-tooltip {
1309     z-index: 3001;
1310
1311     .moodle-dialogue-bd {
1312         overflow: auto;
1313     }
1314 }
1315
1316 /**
1317  * Chooser Dialogues (moodle-core-chooserdialogue)
1318  *
1319  * This CSS belong to the chooser dialogue which should work both with, and
1320  * without javascript enabled
1321  */
1322 /* Hide the dialog and it's title */
1323 .chooserdialoguebody,
1324 .choosertitle {
1325     display: none;
1326 }
1327 .moodle-dialogue.chooserdialogue .moodle-dialogue-content .moodle-dialogue-ft {
1328     margin: 0;
1329 }
1330 .chooserdialogue .moodle-dialogue-wrap .moodle-dialogue-bd {
1331     padding: 0;
1332     background: #F2F2F2;
1333     @include border-bottom-radius(10px);
1334 }
1335 /* Center the submit buttons within the area */
1336 .choosercontainer #chooseform .submitbuttons {
1337     padding: 0.7em 0;
1338     text-align: center;
1339 }
1340 /* Fixed for safari browser on iPhone4S with ios7@mixin */
1341 @media (max-height: 639px) {
1342     .ios.safari .choosercontainer #chooseform .submitbuttons {
1343         padding: 45px 0;
1344     }
1345 }
1346 .choosercontainer #chooseform .submitbuttons input {
1347     min-width: 100px;
1348     margin: 0 0.5em;
1349 }
1350 /* Various settings for the options area */
1351 .choosercontainer #chooseform .options {
1352     position: relative;
1353     border-bottom: 1px solid #BBBBBB;
1354 }
1355 /* Only set these options if we're showing the js container */
1356 .jschooser .choosercontainer #chooseform .alloptions {
1357     overflow-x: hidden;
1358     overflow-y: auto;
1359     max-width: 20.3em;
1360     @include box-shadow(inset 0 0 30px 0px #ccc);
1361     .option {
1362         input[type=radio] {
1363             display: inline-block;
1364         }
1365         .modicon {
1366             display: inline-block;
1367         }
1368         .typename {
1369             display: inline-block;
1370             width: 65%;
1371         }
1372     }
1373 }
1374 /* Settings for option rows and option subtypes */
1375 .choosercontainer #chooseform .moduletypetitle,
1376 .choosercontainer #chooseform .option,
1377 .choosercontainer #chooseform .nonoption {
1378     margin-bottom: 0;
1379     padding: 0 1.6em 0 1.6em;
1380 }
1381 .choosercontainer #chooseform .moduletypetitle {
1382     text-transform: uppercase;
1383     padding-top: 1.2em;
1384     padding-bottom: 0.4em;
1385 }
1386 .choosercontainer #chooseform .option .typename,
1387 .choosercontainer #chooseform .option span.modicon img.icon,
1388 .choosercontainer #chooseform .nonoption .typename,
1389 .choosercontainer #chooseform .nonoption span.modicon img.icon {
1390     padding: 0 0 0 0.5em;
1391 }
1392
1393 .chooserdialogue-course-modchooser .choosercontainer #chooseform .option span.modicon img.icon,
1394 .chooserdialogue-course-modchooser .choosercontainer #chooseform .nonoption span.modicon img.icon {
1395     height: 24px;
1396     width: 24px;
1397 }
1398 .choosercontainer #chooseform .option input[type=radio],
1399 .choosercontainer #chooseform .option span.typename,
1400 .choosercontainer #chooseform .option span.modicon {
1401     vertical-align: middle;
1402 }
1403 .choosercontainer #chooseform .option label {
1404     display: block;
1405     padding: 0.3em 0 0.1em 0;
1406     border-bottom: 1px solid #FFFFFF;
1407 }
1408 .choosercontainer #chooseform .nonoption {
1409     padding-left: 2.7em;
1410     padding-top: 0.3em;
1411     padding-bottom: 0.1em;
1412 }
1413 .choosercontainer #chooseform .subtype {
1414     margin-bottom: 0;
1415     padding: 0 1.6em 0 3.2em;
1416 }
1417 .choosercontainer #chooseform .subtype .typename {
1418     margin: 0 0 0 0.2em;
1419 }
1420 /* The instruction/help area */
1421 .jschooser .choosercontainer #chooseform .instruction,
1422 .jschooser .choosercontainer #chooseform .typesummary {
1423    display: none;
1424     position: absolute;
1425     top: 0;
1426     right: 0;
1427     bottom: 0;
1428     left: 20.3em;
1429     margin: 0;
1430     padding: 1.6em;
1431     background-color: #fff;
1432     overflow-x: hidden;
1433     overflow-y: auto;
1434     line-height: 2em;
1435 }
1436 /* Selected option settings */
1437 .jschooser .choosercontainer #chooseform .instruction,
1438 .choosercontainer #chooseform .selected .typesummary {
1439     display: block;
1440 }
1441 .choosercontainer #chooseform .selected {
1442     background-color: #fff;
1443     @include box-shadow(0px 0 10px 0 #ccc);
1444 }
1445 /* Form element: listing */
1446 .formlistingradio {
1447     padding-bottom: 25px;
1448     padding-right: 10px;
1449 }
1450 .formlistinginputradio {
1451     float: left;
1452 }
1453 .formlistingmain {
1454     min-height: 225px;
1455 }
1456 .formlisting {
1457     position: relative;
1458     margin: 15px 0;
1459     padding: 1px 19px 14px;
1460     background-color: white;
1461     border: 1px solid #DDD;
1462     @include border-radius(4px);
1463 }
1464 .formlistingmore {
1465     position: absolute;
1466     cursor: pointer;
1467     bottom: -1px;
1468     right: -1px;
1469     padding: 3px 7px;
1470     font-size: 12px;
1471     font-weight: bold;
1472     background-color: whiteSmoke;
1473     border: 1px solid #ddd;
1474     color: #9DA0A4;
1475     @include border-radius(4px 0 4px 0);
1476 }
1477 .formlistingall {
1478     margin: 15px 0;
1479     padding: 0;
1480     @include border-radius(4px);
1481 }
1482 .formlistingrow {
1483     cursor: pointer;
1484     border-bottom: 1px solid;
1485     border-color: #E1E1E8;
1486     border-left: 1px solid #E1E1E8;
1487     border-right: 1px solid #E1E1E8;
1488     background-color: #F7F7F9;
1489     @include border-radius(0 0 4px 4px);
1490     padding: 6px;
1491     top: 50%;
1492     left: 50%;
1493     min-height: 34px;
1494     float: left;
1495     width: 150px;
1496 }
1497 body.jsenabled .formlistingradio {
1498     display: none;
1499 }
1500 body.jsenabled .formlisting {
1501     display: block;
1502 }
1503
1504 /* Badges styles */
1505 table.collection {
1506     @extend .table;
1507     @extend .table-bordered;
1508     @extend .table-striped;
1509 }
1510 table.collection .name {
1511     text-align: left;
1512     vertical-align: middle;
1513 }
1514 table.collection .awards {
1515     width: 10%;
1516     text-align: center;
1517     vertical-align: middle;
1518 }
1519 table.collection .criteria {
1520     width: 40%;
1521     text-align: left;
1522     vertical-align: top;
1523 }
1524 table.collection .badgeimage,
1525 table.collection .status {
1526     width: 15%;
1527     text-align: center;
1528     vertical-align: middle;
1529 }
1530 table.collection .description {
1531     width: 25%;
1532     text-align: left;
1533 }
1534 table.collection .actions {
1535     width: 11em;
1536     text-align: center;
1537     vertical-align: middle;
1538 }
1539
1540 a.criteria-action {
1541     padding: 0px 3px;
1542     float: right;
1543 }
1544 div.criteria-description {
1545     padding: 10px 15px;
1546     margin: 5px 0px;
1547     background: none repeat scroll 0 0 #f9f9f9;
1548     border: 1px solid #EEE;
1549 }
1550 ul.badges {
1551     margin: 0;
1552     list-style: none;
1553 }
1554 .badges li {
1555     position: relative;
1556     display: inline-block;
1557     padding-top: 1em;
1558     text-align: center;
1559     vertical-align: top;
1560     width: 150px;
1561 }
1562 .badges li .badge-name {
1563     display: block;
1564     padding: 5px;
1565 }
1566 .badges li > img {
1567     position: absolute;
1568 }
1569 .badges li .badge-image {
1570     width: 100px;
1571     height: 100px;
1572     left: 10px;
1573     top: 0px;
1574     z-index: 1;
1575 }
1576 .badges li .badge-actions {
1577     position: relative;
1578 }
1579 .badges li .expireimage {
1580     width: 100px;
1581     height: 100px;
1582     left: 25px;
1583     top: 0px;
1584     position: absolute;
1585     z-index: 10;
1586     opacity: 0.85;
1587 }
1588
1589 #badge-image {
1590     background-color: transparent;
1591     padding: 0;
1592     position: relative;
1593     min-width: 100px;
1594     width: 20%;
1595     display: inline-block;
1596     vertical-align: top;
1597     margin-top: 17px;
1598
1599     .expireimage {
1600         width: 100px;
1601         height: 100px;
1602         left: 0px;
1603         top: 0px;
1604         opacity: 0.85;
1605         position: absolute;
1606         z-index:10;
1607     }
1608
1609     .singlebutton {
1610         padding-top: 5px;
1611
1612         input {
1613             margin-left: 0px;
1614         }
1615     }
1616 }
1617 #badge-details {
1618     display: inline-block;
1619     width: 79%;
1620 }
1621
1622 #badge-overview dl,
1623 #badge-details dl {
1624     margin: 0;
1625
1626     dt,
1627     dd {
1628         vertical-align: top;
1629         padding: 3px 0;
1630     }
1631     dt {
1632         clear: both;
1633         display: inline-block;
1634         width: 20%;
1635         min-width: 100px;
1636     }
1637     dd {
1638         display: inline-block;
1639         width: 79%;
1640         margin-left: 1%;
1641     }
1642 }
1643
1644 .badge-profile {
1645     vertical-align: top;
1646 }
1647 .connected {
1648     @extend .text-success;
1649 }
1650 .notconnected {
1651     @extend .text-danger;
1652 }
1653 .connecting {
1654     @extend .text-warning;
1655 }
1656 #page-badges-award .recipienttable tr td {
1657     vertical-align: top;
1658 }
1659 #page-badges-award .recipienttable tr td.actions .actionbutton {
1660     margin: 0.3em 0;
1661     padding: 0.5em 0;
1662     width: 100%;
1663 }
1664 #page-badges-award .recipienttable tr td.existing,
1665 #page-badges-award .recipienttable tr td.potential {
1666     width: 42%;
1667 }
1668
1669 #issued-badge-table .activatebadge {
1670     display: inline-block;
1671 }
1672 .statusbox.active {
1673     background-color: $state-success-bg;
1674 }
1675 .statusbox.inactive {
1676     background-color: $state-warning-bg;
1677 }
1678 .statusbox {
1679     text-align: center;
1680     margin-bottom: 5px;
1681     padding: 5px;
1682 }
1683 .statusbox .activatebadge {
1684     display: inline-block;
1685 }
1686 .statusbox .activatebadge input[type=submit]{
1687     margin: 3px;
1688 }
1689 .activatebadge {
1690     margin: 0px;
1691     text-align: left;
1692     vertical-align: middle;
1693 }
1694 img#persona_signin {
1695     cursor: pointer;
1696 }
1697 .addcourse {
1698     float: right;
1699 }
1700 .invisiblefieldset {
1701     display: inline;
1702     margin: 0;
1703     padding: 0;
1704     border-width: 0;
1705 }
1706 .breadcrumb-nav {
1707     float: left;
1708     margin-bottom: 10px;
1709 }
1710 .breadcrumb-button .singlebutton div {
1711     margin-right: 0;
1712 }
1713 .breadcrumb-nav .breadcrumb {
1714     margin: 0;
1715 }
1716
1717 /** Header-bar styles **/
1718 .page-context-header {
1719     // We need to be explicit about the height of the header.
1720     $pageHeaderHeight: 140px;
1721
1722     // Do not remove these rules.
1723     overflow: hidden;
1724
1725     .page-header-image,
1726     .page-header-headings {
1727         display: block;
1728         position: relative;
1729     }
1730     .page-header-image {
1731         float: left;
1732         margin-right: 1em;
1733         margin-bottom: 1em;
1734     }
1735     .page-header-headings {
1736         margin-top: 30px;
1737         margin-bottom: 10px;
1738
1739         h1 {
1740             display: block;
1741         }
1742     }
1743
1744     .page-header-headings,
1745     .header-button-group {
1746         position: relative;
1747         line-height: 24px;
1748         vertical-align: middle;
1749     }
1750
1751     .header-button-group {
1752         display: block;
1753         float: left;
1754         a {
1755             position: relative;
1756
1757             // Don't touch it unless you know exactly what you are doing.
1758             top: -0.4em;
1759         }
1760     }
1761 }
1762
1763 ul.dragdrop-keyboard-drag li {
1764     list-style-type: none;
1765 }
1766
1767 .block-control-actions .moodle-core-dragdrop-draghandle img {
1768     width: 12px;
1769     height: 12px;
1770 }
1771
1772 a.disabled:hover,
1773 a.disabled {
1774     text-decoration: none;
1775     cursor: default;
1776     font-style: italic;
1777     color: #808080;
1778 }
1779 body.lockscroll {
1780   height: 100%;
1781   overflow: hidden;
1782 }
1783
1784 .progressbar_container {
1785     max-width: 500px;
1786     margin: 0 auto;
1787 }
1788
1789 /* IE10 only fix for calendar titling */
1790 .ie10 .yui3-calendar-header-label {
1791     display: inline-block;
1792 }
1793
1794 dd:before,
1795 dd:after {
1796   display: block;
1797   content: " ";
1798 }
1799 dd:after {
1800   clear: both;
1801 }
1802
1803 // Active tabs with links should have a different
1804 // cursor to indicate they are clickable.
1805 .nav-tabs > .active > a[href],
1806 .nav-tabs > .active > a[href]:hover,
1807 .nav-tabs > .active > a[href]:focus {
1808     cursor: pointer;
1809 }
1810
1811 .inplaceeditable {
1812
1813     &.inplaceeditingon {
1814         position: relative;
1815
1816         .editinstructions {
1817             margin-top: -30px;
1818             font-weight: normal;
1819             margin-right: 0;
1820             margin-left: 0;
1821             left: 0;
1822             right: auto;
1823             white-space: nowrap;
1824         }
1825
1826         input {
1827             width: 330px;
1828             height: 16px;
1829             vertical-align: text-bottom;
1830             margin-bottom: 0;
1831         }
1832
1833         select {
1834             margin-bottom: 0;
1835         }
1836     }
1837
1838     .quickediticon img {
1839         opacity: 0.2;
1840     }
1841
1842     .quickeditlink {
1843         color: inherit;
1844         text-decoration: inherit;
1845     }
1846
1847     &:hover .quickeditlink .quickediticon img,
1848     .quickeditlink:focus .quickediticon img {
1849         opacity: 1;
1850     }
1851
1852     &.inplaceeditable-toggle .quickediticon {
1853         display: none;
1854     }
1855 }
1856
1857 h3.sectionname .inplaceeditable.inplaceeditingon .editinstructions {
1858     margin-top: -20px;
1859 }
1860 // Reset for ul.
1861 ul {
1862     padding-left: 1rem;
1863 }