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