mod/assign/styles.css

   1 /* stylelint-disable max-line-length */
   2 /* FIXME: MDL-55370: remove this stylelint disable */
   3 .path-mod-assign div.gradingnavigation div {
   4     float: left;
   5     margin-left: 2em;
   6 }
   7
   8 .path-mod-assign div.submissionstatustable,
   9 .path-mod-assign div.submissionfull,
  10 .path-mod-assign div.submissionlinks,
  11 .path-mod-assign div.usersummary,
  12 .path-mod-assign div.feedback,
  13 .path-mod-assign div.gradingsummary {
  14     margin-bottom: 5em;
  15 }
  16
  17 .path-mod-assign div.submissionstatus .generaltable,
  18 .path-mod-assign div.submissionlinks .generaltable,
  19 .path-mod-assign div.feedback .generaltable,
  20 .path-mod-assign div.submissionsummarytable .generaltable,
  21 .path-mod-assign div.attempthistory table,
  22 .path-mod-assign div.gradingsummary .generaltable {
  23     width: 100%;
  24 }
  25
  26 .path-mod-assign table.generaltable table td {
  27     border: 0 none;
  28 }
  29
  30 .path-mod-assign .gradingsummarytable,
  31 .path-mod-assign .feedbacktable,
  32 .path-mod-assign .lockedsubmission,
  33 .path-mod-assign .submissionsummarytable {
  34     margin-top: 1em;
  35 }
  36
  37 .path-mod-assign div.submissionsummarytable table tbody tr td.c0 {
  38     width: 30%;
  39 }
  40
  41 .path-mod-assign .submittedlate {
  42     color: red;
  43     font-weight: 900;
  44 }
  45
  46 .path-mod-assign.jsenabled .gradingoptionsform [type=submit] {
  47     display: none;
  48 }
  49
  50 .path-mod-assign.jsenabled .gradingtable .c1 select {
  51     display: none;
  52 }
  53
  54 .path-mod-assign .quickgradingform .mform fieldset {
  55     margin: 0;
  56     padding: 0;
  57 }
  58
  59 .path-mod-assign .gradingbatchoperationsform .mform fieldset {
  60     margin: 0;
  61     padding: 0;
  62 }
  63
  64 .path-mod-assign td.submissionstatus,
  65 .path-mod-assign div.submissionstatus,
  66 .path-mod-assign a:link.submissionstatus {
  67     color: black;
  68     background-color: #efefef;
  69 }
  70
  71 .path-mod-assign td.submissionstatusdraft,
  72 .path-mod-assign div.submissionstatusdraft,
  73 .path-mod-assign a:link.submissionstatusdraft {
  74     color: black;
  75     background-color: #efefcf;
  76 }
  77
  78 .path-mod-assign td.submissionstatussubmitted,
  79 .path-mod-assign div.submissionstatussubmitted,
  80 .path-mod-assign a:link.submissionstatussubmitted {
  81     color: black;
  82     background-color: #cfefcf;
  83 }
  84
  85 .path-mod-assign td.submissionlocked,
  86 .path-mod-assign div.submissionlocked {
  87     color: black;
  88     background-color: #efefcf;
  89 }
  90
  91 .path-mod-assign td.submissionreopened,
  92 .path-mod-assign div.submissionreopened {
  93     color: black;
  94     background-color: #efefef;
  95 }
  96
  97 .path-mod-assign td.submissiongraded,
  98 .path-mod-assign div.submissiongraded {
  99     color: black;
 100     background-color: #cfefcf;
 101 }
 102
 103 .path-mod-assign td.submissionnotgraded,
 104 .path-mod-assign div.submissionnotgraded {
 105     color: black;
 106     background-color: #efefef;
 107 }
 108
 109 .path-mod-assign td.latesubmission,
 110 .path-mod-assign a:link.latesubmission,
 111 .path-mod-assign div.latesubmission {
 112     color: black;
 113     background-color: #efcfcf;
 114 }
 115
 116 .path-mod-assign td.earlysubmission,
 117 .path-mod-assign div.earlysubmission {
 118     color: black;
 119     background-color: #cfefcf;
 120 }
 121
 122 .path-mod-assign .gradingtable .c0 {
 123     display: none;
 124 }
 125
 126 .path-mod-assign.jsenabled .gradingtable .c0 {
 127     display: table-cell;
 128 }
 129
 130 .path-mod-assign .gradingbatchoperationsform {
 131     display: none;
 132 }
 133
 134 .path-mod-assign.jsenabled .gradingbatchoperationsform {
 135     display: block;
 136 }
 137
 138 .path-mod-assign .gradingtable tr.selectedrow td {
 139     background-color: #fec;
 140 }
 141
 142 .path-mod-assign .gradingtable tr.unselectedrow td {
 143     background-color: white;
 144 }
 145
 146 .path-mod-assign .gradingtable .c0 div.selectall {
 147     margin-left: 7px;
 148 }
 149
 150 .path-mod-assign .gradingtable .yui3-menu ul {
 151     margin: 0;
 152 }
 153
 154 .path-mod-assign .gradingtable .yui3-menu-label {
 155     padding-left: 0;
 156     line-height: 12px;
 157 }
 158
 159 .path-mod-assign .gradingtable .yui3-menu-label img {
 160     padding: 0 3px;
 161 }
 162
 163 .path-mod-assign .gradingtable .yui3-menu li {
 164     list-style-type: none;
 165 }
 166
 167 .path-mod-assign.jsenabled .gradingtable .yui3-loading {
 168     display: none;
 169 }
 170
 171 .path-mod-assign .gradingtable .yui3-menu .yui3-menu-content {
 172     border: 0;
 173     padding-top: 0;
 174 }
 175
 176 .path-mod-assign div.gradingtable tr .quickgrademodified {
 177     background-color: #fc9;
 178 }
 179
 180 .path-mod-assign td.submissioneditable {
 181     color: red;
 182 }
 183
 184 .path-mod-assign .expandsummaryicon {
 185     cursor: pointer;
 186     display: none;
 187 }
 188
 189 .path-mod-assign.jsenabled .expandsummaryicon {
 190     display: inline;
 191 }
 192
 193 .path-mod-assign .hidefull {
 194     display: none;
 195 }
 196
 197 .path-mod-assign .quickgradingform form .commentscontainer input,
 198 .path-mod-assign .quickgradingform form .commentscontainer textarea {
 199     display: none;
 200 }
 201
 202 .path-mod-assign.jsenabled .quickgradingform form .commentscontainer input,
 203 .path-mod-assign.jsenabled .quickgradingform form .commentscontainer textarea {
 204     display: inline;
 205 }
 206
 207 .path-mod-assign .previousfeedbackwarning {
 208     font-size: 140%;
 209     font-weight: bold;
 210     text-align: center;
 211     color: #500;
 212 }
 213
 214 .path-mod-assign .submissionhistory {
 215     background-color: #b0b0b0;
 216 }
 217
 218 .path-mod-assign .submissionhistory .cell.historytitle {
 219     background-color: #808080;
 220 }
 221
 222 .path-mod-assign .submissionhistory .cell {
 223     background-color: #d0d0d0;
 224 }
 225
 226 .path-mod-assign.jsenabled .mod-assign-history-link {
 227     display: block;
 228     cursor: pointer;
 229     margin-bottom: 7px;
 230 }
 231
 232 .path-mod-assign.jsenabled .mod-assign-history-link h4 {
 233     display: inline;
 234 }
 235
 236 .path-mod-assign.jsenabled .attempthistory h4 {
 237     margin-bottom: 7px;
 238     text-align: left;
 239 }
 240
 241 .path-mod-assign.jsenabled.dir_rtl .attempthistory h4 {
 242     text-align: right;
 243 }
 244
 245 .path-mod-assign.jsenabled .mod-assign-history-link-open {
 246     padding: 0 5px 0 20px;
 247     background: url([[pix:t/expanded]]) 2px center no-repeat;
 248 }
 249
 250 .path-mod-assign.jsenabled .mod-assign-history-link-closed {
 251     padding: 0 5px 0 20px;
 252     background: url([[pix:t/collapsed]]) 2px center no-repeat;
 253 }
 254
 255 /*rtl:raw:
 256 .path-mod-assign.jsenabled .mod-assign-history-link-closed {
 257     background-image: url([[pix:t/collapsed_rtl]]);
 258 }
 259 */
 260
 261 .path-mod-assign .submithelp {
 262     padding: 1em;
 263 }
 264
 265 .path-mod-assign .feedbacktitle {
 266     font-weight: bold;
 267 }
 268
 269 .path-mod-assign .submitconfirm,
 270 .path-mod-assign .submissionlinks,
 271 .path-mod-assign .submissionaction {
 272     text-align: center;
 273 }
 274
 275 .path-mod-assign .submissionsummarytable .c0,
 276 .path-mod-assign .mod-assign-history-panel .c0 {
 277     width: 150px;
 278 }
 279
 280 .path-mod-assign .gradingtable .moodle-actionmenu {
 281     white-space: nowrap;
 282 }
 283
 284 .path-mod-assign .gradingtable .moodle-actionmenu[data-enhanced].show .menu a {
 285     padding-left: 12px;
 286     padding-right: 12px;
 287 }
 288
 289 .path-mod-assign .gradingtable .menu-action img {
 290     display: none;
 291 }
 292
 293 .path-mod-assign .editsubmissionform input[name="submissionstatement"] {
 294     vertical-align: top;
 295 }
 296
 297 .path-mod-assign .editsubmissionform label[for="id_submissionstatement"] {
 298     display: inline-block;
 299 }
 300
 301 .path-mod-assign.layout-option-nonavbar {
 302     padding-top: 0;
 303 }
 304
 305 .path-mod-assign [data-region="user-selector"] select {
 306     margin-bottom: 0;
 307 }
 308
 309 .path-mod-assign [data-region="user-selector"] .alignment {
 310     float: right;
 311     width: 320px;
 312     text-align: center;
 313     margin-top: 7px;
 314 }
 315
 316 .path-mod-assign [data-region="user-selector"] [data-action="previous-user"],
 317 .path-mod-assign [data-region="user-selector"] [data-action="next-user"] {
 318     font-size: 26px;
 319 }
 320
 321 .path-mod-assign [data-region="user-selector"] [data-action="next-user"] {
 322     margin-left: -10px;
 323 }
 324
 325 .path-mod-assign [data-region="user-selector"] .alignment input {
 326     margin-bottom: 5px;
 327 }
 328
 329 .path-mod-assign [data-region="user-selector"] .alignment .form-autocomplete-downarrow {
 330     top: 0;
 331 }
 332
 333 .path-mod-assign [data-region="user-selector"] .form-autocomplete-selection {
 334     display: none;
 335 }
 336
 337 .path-mod-assign [data-region="user-selector"] .form-autocomplete-suggestions {
 338     text-align: left;
 339 }
 340
 341 .path-mod-assign [data-region="user-selector"] .form-autocomplete-suggestions {
 342     margin-left: 48px;
 343 }
 344
 345 .path-mod-assign [data-region="user-filters"] {
 346     font-size: small;
 347 }
 348
 349 .path-mod-assign [data-region="configure-filters"] {
 350     display: none;
 351     text-align: left;
 352     width: auto;
 353     background-color: #fff;
 354     background-clip: padding-box;
 355     box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
 356     border-radius: 6px;
 357     position: absolute;
 358     margin-top: 28px;
 359     margin-left: -140px;
 360     padding: 10px 0;
 361     z-index: 1;
 362 }
 363
 364 .path-mod-assign [data-region="configure-filters"]::before,
 365 .path-mod-assign [data-region="configure-filters"]::after {
 366     position: absolute;
 367     left: auto;
 368     display: inline-block;
 369     content: '';
 370     border-style: solid;
 371     border-color: transparent;
 372     border-top: none;
 373 }
 374
 375 .path-mod-assign [data-region="configure-filters"]::before {
 376     top: -7px;
 377     right: 12px;
 378     border-width: 7px;
 379     border-bottom-color: rgba(0, 0, 0, 0.2);
 380 }
 381
 382 .path-mod-assign [data-region="configure-filters"]::after {
 383     top: -6px;
 384     right: 13px;
 385     border-width: 6px;
 386     border-bottom-color: #fff;
 387 }
 388
 389 .path-mod-assign [data-region="configure-filters"] label {
 390     padding: 3px 20px;
 391 }
 392
 393 .path-mod-assign .alignment [data-region="configure-filters"] input {
 394     margin-bottom: 0;
 395 }
 396
 397 .path-mod-assign [data-region="grading-navigation-panel"] {
 398     position: absolute;
 399     top: 0;
 400     left: 0;
 401     width: 100%;
 402     height: 6em;
 403     margin: 0;
 404     border-bottom: 1px solid #ddd;
 405 }
 406
 407 .path-mod-assign [data-region="grading-navigation"] {
 408     padding: 1em;
 409 }
 410 .path-mod-assign [data-region="assignment-info"] {
 411     white-space: nowrap;
 412     overflow-x: hidden;
 413     text-overflow: ellipsis;
 414 }
 415 .path-mod-assign [data-region="assignment-info"] small[data-region="assignment-tooltip"] {
 416     margin-left: 0.5em;
 417 }
 418
 419 .path-mod-assign [data-region="user-info"] {
 420     height: 60px;
 421 }
 422
 423 .path-mod-assign [data-region="user-info"] a {
 424     text-decoration: none;
 425 }
 426
 427 .path-mod-assign [data-region="user-info"] .img-rounded {
 428     display: block;
 429     float: left;
 430     margin-top: -3px;
 431     margin-right: 10px;
 432 }
 433
 434 .path-mod-assign [data-region="user-info"] em {
 435     display: block;
 436     font-style: normal;
 437 }
 438
 439 .path-mod-assign [data-region="grading-actions-form"] label {
 440     display: inline-block;
 441 }
 442
 443 .path-mod-assign.pagelayout-embedded {
 444     overflow: hidden;
 445 }
 446
 447 .path-mod-assign [data-region="review-panel"] {
 448     position: absolute;
 449     top: 85px;
 450     bottom: 60px;
 451     left: 0;
 452     right: 30%;
 453     width: auto;
 454     box-sizing: border-box;
 455     -webkit-transition: right 0.5s, left 0.5s;
 456     -moz-transition: right 0.5s, left 0.5s;
 457     transition: right 0.5s, left 0.5s;
 458 }
 459
 460 .path-mod-assign [data-region="review-panel"].grade-panel-collapsed {
 461     right: 30px;
 462 }
 463
 464 .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] {
 465     display: none;
 466     height: 30px;
 467     width: 30px;
 468     position: absolute;
 469     top: 0;
 470     right: 0;
 471     left: auto;
 472     box-sizing: border-box;
 473     border-radius: 0 0 0 4px;
 474     border: 1px solid #ccc;
 475     border-top: none;
 476     background-color: #fff;
 477     z-index: 99999;
 478 }
 479
 480 .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .expand-icon,
 481 .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .collapse-icon {
 482     width: 100%;
 483     height: 100%;
 484     text-align: center;
 485     line-height: 30px;
 486 }
 487
 488 .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .expand-icon .toggle-text,
 489 .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .collapse-icon .toggle-text {
 490     visibility: hidden;
 491     opacity: 0;
 492     height: 0;
 493     overflow: hidden;
 494 }
 495
 496 .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] img {
 497     height: 100%;
 498     float: right;
 499 }
 500
 501 .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .expand-icon {
 502     display: none;
 503 }
 504
 505 .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .collapse-icon {
 506     display: block;
 507 }
 508
 509 .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .collapse-icon.full-width {
 510     display: none;
 511 }
 512
 513 .path-mod-assign [data-region="review-panel"] .pageheader {
 514     border-right: 1px solid #ddd;
 515 }
 516
 517 .path-mod-assign [data-region="review-panel"] + [data-region="grade-panel"] [data-region="grade"] {
 518     margin-left: auto;
 519     margin-right: auto;
 520     max-width: 100%;
 521     -webkit-transition: max-width 0.5s;
 522     -moz-transition: max-width 0.5s;
 523     transition: max-width 0.5s;
 524 }
 525
 526 .path-mod-assign [data-region="review-panel"] .drawingregion {
 527     left: 0;
 528     right: 0;
 529     border-color: #ddd;
 530 }
 531
 532 .path-mod-assign [data-region="review-panel"].collapsed {
 533     left: calc(30px - 70%);
 534     right: calc(100% - 30px);
 535     -webkit-transition: right 0.5s, left 0.5s;
 536     -moz-transition: right 0.5s, left 0.5s;
 537     transition: right 0.5s, left 0.5s;
 538 }
 539
 540 .path-mod-assign [data-region="review-panel"].collapsed [data-region="review-panel-content"] {
 541     visibility: hidden;
 542     -webkit-transition: visibility 0 0.5s;
 543     -moz-transition: visibility 0 0.5s;
 544     transition: visibility 0 0.5s;
 545 }
 546
 547 .path-mod-assign [data-region="review-panel"].collapsed [data-region="review-panel-toggle"] .expand-icon {
 548     display: block;
 549 }
 550
 551 .path-mod-assign [data-region="review-panel"].collapsed [data-region="review-panel-toggle"] .collapse-icon {
 552     display: none;
 553 }
 554
 555 .path-mod-assign [data-region="review-panel"].collapsed + [data-region="grade-panel"] {
 556     position: absolute;
 557     left: 30px;
 558     right: 0;
 559     width: calc(100% - 30px);
 560     overflow: auto;
 561     -webkit-transition: width 0.5s, right 0.5s, left 0.5s;
 562     -moz-transition: width 0.5s, right 0.5s, left 0.5s;
 563     transition: width 0.5s, right 0.5s, left 0.5s;
 564 }
 565
 566 .path-mod-assign [data-region="review-panel"].collapsed + [data-region="grade-panel"] [data-region="grade"],
 567 .path-mod-assign [data-region="grade-panel"].fullwidth [data-region="grade"] {
 568     max-width: 800px;
 569     margin-left: auto;
 570     margin-right: auto;
 571 }
 572
 573 .path-mod-assign [data-region="grade-panel"] {
 574     position: absolute;
 575     top: 85px;
 576     bottom: 60px;
 577     right: 0;
 578     left: 70%;
 579     width: 30%;
 580     overflow: auto;
 581     box-sizing: border-box;
 582     background-color: #f5f5f5;
 583     padding: 15px;
 584     padding-top: 0;
 585     -webkit-transition: width 0.5s, right 0.5s, left 0.5s;
 586     -moz-transition: width 0.5s, right 0.5s, left 0.5s;
 587     transition: width 0.5s, right 0.5s, left 0.5s;
 588 }
 589
 590 .path-mod-assign [data-region="grade-panel"].collapsed {
 591     left: calc(100% - 30px);
 592     right: calc(30px - 100%);
 593     visibility: hidden;
 594     -webkit-transition: right 0.5s, left 0.5s, visibility 0 0.5s;
 595     -moz-transition: right 0.5s, left 0.5s, visibility 0 0.5s;
 596     transition: right 0.5s, left 0.5s, visibility 0 0.5s;
 597 }
 598
 599 .path-mod-assign [data-region="grade-panel"].fullwidth {
 600     left: 0;
 601     width: 100%;
 602     overflow: auto;
 603 }
 604
 605 .path-mod-assign [data-region="grade-panel"] h3 {
 606     font-size: 18px;
 607     font-weight: 500;
 608 }
 609
 610 /***** Start submission status *****/
 611
 612 .path-mod-assign [data-region="grade-panel"] div.submissionstatustable {
 613     margin-bottom: 2em;
 614 }
 615
 616 .path-mod-assign [data-region="grade-panel"] .submissionsummarytable {
 617     margin-left: 5px;
 618     margin-right: 5px;
 619 }
 620
 621 .path-mod-assign [data-region="grade-panel"] .submissionsummarytable table.generaltable td {
 622     padding: 8px 0;
 623     background-color: transparent;
 624 }
 625
 626 .path-mod-assign [data-region="grade-panel"] .submissionsummarytable .generaltable tbody > tr:nth-child(2n+1) > td,
 627 .path-mod-assign [data-region="grade-panel"] .submissionsummarytable .generaltable tbody tr:hover > td {
 628     background-color: transparent;
 629 }
 630
 631 .path-mod-assign [data-region="grade-panel"] div.submissionsummarytable table tbody tr td.c0 {
 632     width: auto;
 633 }
 634
 635 .path-mod-assign [data-region="grade-panel"] div.submissionsummarytable table tbody tr.lastrow td.c0,
 636 .path-mod-assign [data-region="grade-panel"] div.submissionsummarytable table tbody tr.lastrow td.c1 {
 637     border-bottom: 1px solid #ddd;
 638 }
 639
 640 .path-mod-assign [data-region="grade-panel"] td.submissionnotgraded,
 641 .path-mod-assign [data-region="grade-panel"] div.submissionnotgraded {
 642     color: red;
 643     background-color: transparent;
 644 }
 645
 646 /***** End submission status *****/
 647
 648 .path-mod-assign [data-region="grade-panel"] #id_gradeheader {
 649     display: table-cell;
 650     min-width: 0;
 651 }
 652
 653 .path-mod-assign [data-region="grade-panel"] #id_gradeheader > legend {
 654     visibility: hidden;
 655     height: 0;
 656     margin-bottom: 0;
 657 }
 658
 659 .path-mod-assign [data-region="grade-panel"] .comment-area textarea[cols] {
 660     width: 100%;
 661     box-sizing: border-box;
 662 }
 663
 664 .path-mod-assign [data-region="grade-panel"] .mform .fitem.fitem_ftext,
 665 .path-mod-assign [data-region="grade-panel"] .mform .fitem.fitem_f,
 666 .path-mod-assign [data-region="grade-panel"] .mform .fitem.fitem_feditor,
 667 .path-mod-assign [data-region="grade-panel"] .mform .fitem.fitem_fgrading,
 668 .path-mod-assign [data-region="grade-panel"] .mform .fitem.fitem_ffilemanager {
 669     background-color: #fff;
 670     border: 1px solid #ddd;
 671     margin-bottom: 20px;
 672 }
 673
 674 .path-mod-assign [data-region="grade-panel"] .mform .fitem.fitem_ftext .fitemtitle,
 675 .path-mod-assign [data-region="grade-panel"] .mform .fitem.fitem_f .fitemtitle,
 676 .path-mod-assign [data-region="grade-panel"] .mform .fitem.fitem_feditor .fitemtitle,
 677 .path-mod-assign [data-region="grade-panel"] .mform .fitem.fitem_fgrading .fitemtitle,
 678 .path-mod-assign [data-region="grade-panel"] .mform .fitem.fitem_ffilemanager .fitemtitle {
 679     padding-left: 5px;
 680     padding-right: 5px;
 681 }
 682
 683 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fcontainer .fitem.fitem_ftext .felement,
 684 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fcontainer .fitem.fitem_f .felement,
 685 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fcontainer .fitem.fitem_feditor .felement,
 686 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fcontainer .fitem.fitem_fgrading .felement,
 687 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fcontainer .fitem.fitem_ffilemanager .felement {
 688     padding: 6px 10px 10px;
 689     box-sizing: border-box;
 690 }
 691
 692 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fitem.fitem_ftext .fitemtitle,
 693 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fitem.fitem_f .fitemtitle,
 694 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fitem.fitem_feditor .fitemtitle,
 695 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fitem.fitem_fgrading .fitemtitle,
 696 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fitem.fitem_ffilemanager .fitemtitle {
 697     border-bottom: 1px solid #ddd;
 698     box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
 699     padding: 6px 10px 3px;
 700     box-sizing: border-box;
 701 }
 702
 703 .path-mod-assign #page-content [data-region="grade-panel"] [data-region="popout-button"] img {
 704     margin-left: 2px;
 705     margin-right: 2px;
 706     margin-top: -2px;
 707 }
 708
 709 .path-mod-assign #page-content [data-region="grade-panel"] .popout [data-region="popout-button"] img {
 710     margin-left: -6px;
 711     margin-right: -6px;
 712     margin-top: 4px;
 713 }
 714
 715 .path-mod-assign [data-region="grade-panel"] .fitem .fstaticlabel,
 716 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fitem .fitemtitle label {
 717     font-weight: 500;
 718 }
 719
 720 /***** Start grade *****/
 721
 722 .path-mod-assign [data-region="grade-panel"] .mform #fitem_id_grade.fitem {
 723     padding-top: 5px;
 724 }
 725
 726 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) #fitem_id_grade.fitem .fitemtitle {
 727     display: inline-block;
 728     width: auto;
 729     border-bottom: none;
 730     box-shadow: none;
 731 }
 732
 733 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) #fitem_id_grade.fitem .felement {
 734     width: auto;
 735     float: right;
 736 }
 737
 738 .path-mod-assign #page-content .mform:not(.unresponsive) #fitem_id_grade.fitem .felement input {
 739     width: 80px;
 740     margin-bottom: 0;
 741 }
 742
 743 /***** End grade *****/
 744
 745 /***** Start rubric *****/
 746
 747 .path-mod-assign [data-region="grade-panel"] .gradingform_rubric {
 748     padding-bottom: 0;
 749     max-width: none;
 750 }
 751
 752 .path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion .description {
 753     font-weight: 500;
 754     min-width: 150px;
 755 }
 756
 757 .path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion .levels {
 758     background-color: #fff;
 759 }
 760
 761 .path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion,
 762 .path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion.even {
 763     background-color: transparent;
 764 }
 765
 766 .path-mod-assign [data-region="grade-panel"] .gradingform_rubric.evaluate .criterion .levels .level:hover {
 767     background-color: #dff0d8;
 768 }
 769
 770 .path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion .levels .level.checked {
 771     background-color: #dff0d8;
 772     border: none;
 773     border-left: 1px solid #ddd;
 774 }
 775
 776 .path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion .levels .level .score {
 777     color: #468847;
 778     font-weight: 500;
 779     font-style: normal;
 780     margin-top: 20px;
 781 }
 782
 783 .path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion .remark textarea {
 784     margin-bottom: 0;
 785 }
 786
 787 /***** End rubric *****/
 788
 789 /***** Start marking guide *****/
 790
 791 .path-mod-assign [data-region="grade-panel"] .gradingform_guide {
 792     margin-bottom: 10px;
 793 }
 794
 795 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .descriptionreadonly,
 796 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .remark,
 797 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .score {
 798     display: block;
 799 }
 800
 801 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .descriptionreadonly {
 802     padding-top: 10px;
 803 }
 804
 805 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .criteriondescription {
 806     margin-top: 5px;
 807 }
 808
 809 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .criteriondescriptionmarkers {
 810     width: auto;
 811     margin-top: 5px;
 812 }
 813
 814 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .markingguideremark {
 815     margin-bottom: 10px;
 816 }
 817
 818 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .remark .commentchooser {
 819     float: right;
 820     margin-top: 2px;
 821     margin-left: 0;
 822 }
 823
 824 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .score {
 825     float: left;
 826     padding-bottom: 8px;
 827 }
 828
 829 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .score input,
 830 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .score div {
 831     display: inline-block;
 832 }
 833
 834 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .criterion,
 835 .path-mod-assign [data-region="grade-panel"] .gradingform_guide .criterion.even {
 836     background-color: transparent;
 837     border-width: 0 0 1px 0;
 838     padding: 8px 0;
 839 }
 840
 841 .path-mod-assign [data-region="grade-panel"] .showmarkerdesc,
 842 .path-mod-assign [data-region="grade-panel"] .showstudentdesc {
 843     background-color: #f5f5f5;
 844     padding: 10px;
 845 }
 846
 847 /***** End marking guide *****/
 848
 849 .path-mod-assign [data-region="grade-panel"] .fitem.fitem_ffilemanager {
 850     margin-bottom: 0;
 851 }
 852
 853 /***** Start popout dialogue *****/
 854
 855 .path-mod-assign [data-region="grade-panel"] .fitem.popout {
 856     position: fixed;
 857     left: 20%;
 858     right: 20%;
 859     top: 20%;
 860     bottom: 20%;
 861     z-index: 1000;
 862     border: 1px solid rgba(0, 0, 0, 0.3);
 863     border-radius: 6px;
 864     box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
 865 }
 866
 867 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fcontainer .fitem.popout .fitemtitle {
 868     text-align: center;
 869     padding-left: 15px;
 870     padding-right: 15px;
 871     height: 45px;
 872 }
 873
 874 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fcontainer .fitem.popout .fitemtitle label {
 875     font-size: 16px;
 876     line-height: 30px;
 877 }
 878
 879 .path-mod-assign #page-content [data-region="grade-panel"] [data-region="popout-button"] {
 880     float: right;
 881 }
 882
 883 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fitem.popout .fitemtitle [data-region="popout-button"] img {
 884     margin-top: -10px;
 885     margin-right: -7px;
 886 }
 887
 888 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fcontainer .fitem.popout .felement {
 889     padding: 10px 15px 15px;
 890     height: calc(100% - 54px);
 891     overflow: auto;
 892 }
 893
 894 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) .fcontainer .fitem.popout .felement .gradingform_rubric {
 895     overflow: visible;
 896 }
 897
 898 /***** End popout dialogue *****/
 899
 900 /***** Start attempt settings *****/
 901
 902 .path-mod-assign [data-region="grade-panel"] #id_attemptsettings > legend {
 903     font-size: 18px;
 904     font-weight: 500;
 905     line-height: 40px;
 906     border-bottom: 0;
 907     margin-bottom: 10px;
 908 }
 909
 910 .path-mod-assign [data-region="grade-panel"] #id_attemptsettings .fcontainer {
 911     display: table;
 912     width: 100%;
 913     padding-left: 5px;
 914     padding-right: 5px;
 915     margin-bottom: 10px;
 916     box-sizing: border-box;
 917 }
 918
 919 .path-mod-assign [data-region="grade-panel"] .mform #id_attemptsettings .fitem {
 920     display: table-row;
 921 }
 922
 923 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) #id_attemptsettings .fitem .fitemtitle,
 924 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) #id_attemptsettings .fitem .felement {
 925     display: table-cell;
 926     float: none;
 927     border-top: 1px solid #ddd;
 928     padding: 8px 0;
 929 }
 930
 931 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) #id_attemptsettings .fitem:last-of-type .fitemtitle,
 932 .path-mod-assign #page-content [data-region="grade-panel"] .mform:not(.unresponsive) #id_attemptsettings .fitem:last-of-type .felement {
 933     border-bottom: 1px solid #ddd;
 934 }
 935
 936 .path-mod-assign [data-region="grade-panel"] #id_attemptsettings .fitem .fstaticlabel,
 937 .path-mod-assign [data-region="grade-panel"] .mform:not(.unresponsive) #id_attemptsettings .fitem .fitemtitle label {
 938     font-weight: 400;
 939 }
 940
 941 .path-mod-assign [data-region="grade-panel"] .mform:not(.unresponsive) #id_attemptsettings .fitem .felement select {
 942     margin-bottom: 0;
 943 }
 944
 945 .path-mod-assign [data-region="grade-panel"] [data-region="attempt-chooser"] {
 946     margin-bottom: 10px;
 947     vertical-align: text-bottom;
 948 }
 949
 950 /***** End attempt settings *****/
 951
 952 .path-mod-assign [data-region="grade-actions-panel"] {
 953     border-top: 1px solid #ddd;
 954     position: absolute;
 955     bottom: 0;
 956     left: 0;
 957     width: 100%;
 958     height: 60px;
 959 }
 960
 961 /*rtl:ignore*/
 962 .path-mod-assign [data-region="grade-actions-panel"] [data-region="grade-actions"] .collapse-buttons {
 963     position: absolute;
 964     top: 0;
 965     left: auto;
 966     right: 15px;
 967     margin: 0;
 968     height: 100%;
 969     line-height: 60px;
 970 }
 971
 972 .path-mod-assign [data-region="grade-actions"] {
 973     padding: 1em;
 974     text-align: center;
 975 }
 976
 977 .path-mod-assign [data-region="submissions-list"] {
 978     text-align: inherit;
 979 }
 980
 981 .path-mod-assign [data-region="submissions-list"] label.radio input {
 982     margin-top: 4px;
 983     min-width: inherit;
 984 }
 985
 986 .path-mod-assign [data-region="overlay"] {
 987     display: none;
 988     z-index: 100;
 989     position: absolute;
 990     top: 0;
 991     left: 0;
 992     width: 100%;
 993     overflow: auto;
 994     bottom: 0;
 995     background-color: #ddd;
 996     opacity: 0.4;
 997     padding-top: 4em;
 998     text-align: center;
 999 }
1000
1001 @media (max-width: 767px) {
1002     .path-mod-assign.pagelayout-embedded {
1003         overflow: auto;
1004     }
1005
1006     .path-mod-assign [data-region="assignment-info"] {
1007         border-bottom: 1px solid #ddd;
1008         padding-bottom: 5px;
1009     }
1010
1011     .path-mod-assign .page-context-header .page-header-headings {
1012         margin-top: 13px;
1013     }
1014
1015     .path-mod-assign [data-region="grade-actions-panel"] [data-region="grade-actions"] .collapse-buttons {
1016         display: none;
1017     }
1018
1019     .path-mod-assign [data-region="grading-navigation-panel"],
1020     .path-mod-assign [data-region="review-panel"],
1021     .path-mod-assign [data-region="grade-panel"],
1022     .path-mod-assign [data-region="review-panel"].collapsed + [data-region="grade-panel"],
1023     .path-mod-assign [data-region="grade-actions-panel"] {
1024         position: inherit;
1025         width: 100%;
1026         top: 0;
1027         left: 0;
1028         right: auto;
1029         overflow: auto;
1030         height: auto;
1031         margin-bottom: 1em;
1032     }
1033
1034     .path-mod-assign [data-region="grade-panel"].collapsed {
1035         visibility: visible;
1036     }
1037
1038     .path-mod-assign [data-region="grading-navigation"] {
1039         padding: 0;
1040         text-align: center;
1041     }
1042
1043     .path-mod-assign [data-region="grade-panel"] {
1044         margin-bottom: 2em;
1045     }
1046
1047     .path-mod-assign [data-region="grade-panel"] [data-region="popout-button"] {
1048         display: none;
1049     }
1050
1051     .path-mod-assign [data-region="review-panel"] {
1052         position: relative;
1053         max-height: 2000px;
1054         -webkit-transition: max-height 0.25s linear;
1055         -moz-transition: max-height 0.25s linear;
1056         transition: max-height 0.25s linear;
1057     }
1058
1059     .path-mod-assign [data-region="review-panel"] .pageheader {
1060         border-right: none;
1061         padding-right: 20px;
1062         padding-left: 40px;
1063     }
1064
1065     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] {
1066         display: block;
1067         height: 20px;
1068         width: 20px;
1069         position: absolute;
1070         top: 0;
1071         left: 0;
1072         right: auto;
1073         box-sizing: border-box;
1074         border: 1px solid #ccc;
1075         border-radius: 0 0 4px 0;
1076         background-color: #fff;
1077         z-index: 99999;
1078     }
1079
1080     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .expand-icon,
1081     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .collapse-icon {
1082         width: 100%;
1083         height: 100%;
1084         text-align: center;
1085         line-height: 30px;
1086     }
1087
1088     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .ltr-icon,
1089     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .rtl-icon {
1090         height: 100%;
1091     }
1092
1093     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .ltr-icon {
1094         float: left;
1095     }
1096
1097     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .rtl-icon {
1098         float: right;
1099     }
1100
1101     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .expand-icon .toggle-text,
1102     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .collapse-icon .toggle-text {
1103         line-height: 20px;
1104         visibility: visible;
1105         opacity: 1;
1106         height: auto;
1107         -webkit-transition: visibility 0 0.25s, opacity 0 0.25s;
1108         -moz-transition: visibility 0 0.25s, opacity 0 0.25s;
1109         transition: visibility 0 0.25s, opacity 0 0.25s;
1110     }
1111
1112     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .expand-icon .rtl-icon {
1113         display: none;
1114     }
1115
1116     .path-mod-assign [data-region="review-panel"].collapsed {
1117         max-height: 20px;
1118         top: 0;
1119         left: 0;
1120         overflow: hidden;
1121         -webkit-transition: max-height 0.25s linear;
1122         -moz-transition: max-height 0.25s linear;
1123         transition: max-height 0.25s linear;
1124     }
1125
1126     .path-mod-assign [data-region="review-panel"].collapsed [data-region="review-panel-toggle"] {
1127         width: 100%;
1128         border-radius: 0 0 0 0;
1129         -webkit-transition: all 0 0.25s;
1130         -moz-transition: all 0 0.25s;
1131         transition: all 0 0.25s;
1132     }
1133
1134     .path-mod-assign [data-region="review-panel"].collapsed [data-region="review-panel-toggle"] img {
1135         height: 100%;
1136     }
1137
1138     .path-mod-assign [data-region="review-panel"] [data-region="review-panel-toggle"] .collapse-icon {
1139         display: block;
1140     }
1141
1142     .path-mod-assign [data-region="review-panel"].collapsed [data-region="review-panel-toggle"] .collapse-icon {
1143         display: none;
1144     }
1145
1146     .path-mod-assign.pagelayout-popup {
1147         overflow: inherit;
1148     }
1149
1150     .path-mod-assign [data-region="grading-navigation"] [data-region="user-info"] {
1151         text-align: left;
1152         width: auto;
1153         display: inline-block;
1154         margin: 0 auto;
1155     }
1156
1157     .path-mod-assign [data-region="user-selector"] .alignment {
1158         float: none;
1159         margin: 0 auto 10px;
1160     }
1161 }
1162
1163 /** Start of CSS to make forms vertical in the grading panel (taken from theme/bootstrapbase/less/moodle/forms.less). */
1164
1165 .path-mod-assign [data-region="grade-panel"] .mform .fitem .fitemtitle {
1166     display: block;
1167     margin-top: 4px;
1168     margin-bottom: 4px;
1169     text-align: left;
1170     width: 100%;
1171 }
1172
1173 .path-mod-assign [data-region="grade-panel"] .mform .fitem .felement {
1174     margin-left: 0;
1175     width: 100%;
1176     float: left;
1177     padding-left: 0;
1178     padding-right: 0;
1179 }
1180
1181 .path-mod-assign [data-region="grade-panel"] .mform .fitem .fstatic:empty {
1182     display: none;
1183 }
1184
1185 .path-mod-assign [data-region="grade-panel"] .mform .fitem .fcheckbox > span,
1186 .path-mod-assign [data-region="grade-panel"] .mform .fitem .fradio > span,
1187 .path-mod-assign [data-region="grade-panel"] .mform .fitem .fgroup > span {
1188     margin-top: 4px;
1189 }
1190
1191 .path-mod-assign [data-region="grade-panel"] .mform .femptylabel .fitemtitle {
1192     display: inline-block;
1193     width: auto;
1194     margin-right: 8px;
1195 }
1196
1197 .path-mod-assign [data-region="grade-panel"] .mform .femptylabel .felement {
1198     display: inline-block;
1199     margin-top: 4px;
1200     padding-top: 5px;
1201     width: auto;
1202 }
1203
1204 .path-mod-assign [data-region="grade-panel"] .mform .fitem_fcheckbox .fitemtitle,
1205 .path-mod-assign [data-region="grade-panel"] .mform .fitem_fcheckbox .felement {
1206     display: inline-block;
1207     width: auto;
1208 }
1209
1210 .path-mod-assign [data-region="grade-panel"] .mform .fitem_fcheckbox .felement {
1211     padding: 6px;
1212 }
1213
1214 /** End of CSS to make forms vertical in the grading panel (taken from theme/bootstrapbase/less/moodle/forms.less). */
1215
1216 /** Styles to fix base theme **/
1217 .path-mod-assign #page,
1218 .path-mod-assign #page-content {
1219     position: inherit;
1220 }
1221 /** End of base fixes **/