@charset "UTF-8";
/* CSS Document */

div#audio_upload_under::after {
    content: "Uploading a video file? We recommend using WPI's Media Server at video.wpi.edu instead of storing the file in Canvas. Videos stored on the Media Server do not count against your course's filesize quota and can be easily embedded or linked to in all of your Canvas course sites. Please contact us at atc-ttl@wpi.edu be set up with Media Server access and instructions.";
    color: blue;
    float: left;
}

input#attachment_uploaded_data + div::before {
    content: "Uploading a video file? We recommend using WPI's Media Server at video.wpi.edu instead of storing the file in Canvas. Videos stored on the Media Server do not count against your course's filesize quota and can be easily embedded or linked to in all of your Canvas course sites. Please contact us at atc-ttl@wpi.edu be set up with Media Server access and instructions.";
    color: blue;
    float: left;
}

.ic-DashboardCard__header_image .ic-DashboardCard__header_hero {
    background-color: transparent !important;
}

.discussion-topic.unread label.discussion-column::after {
    content: "";
    display: block;
    background: #bc1a2b;
    border-radius: 15px;
    width: 10px;
    height: 10px;
    padding: 0;
    margin-left: 1px;
    margin-top: 2px;
}

b.nav-badge {
    margin-left: 8px;
}

/* Global Nav - Custom Tray */
/* #main > span */
/* #main > span > span */
.global-nav-custom-tray {
    width: 448px !important;
    top: 0px;
    bottom: 0px;
    box-shadow:
        rgba(0, 0, 0, 0.1) 0px 6px 7px 0px,
        rgba(0, 0, 0, 0.25) 0px 10px 28px 0px;
    background-color: rgb(255, 255, 255);
    position: fixed;
    overflow-y: auto;
    overflow-x: hidden;
    box-sizing: border-box;
    z-index: 9999;
    max-width: 100vw;
    max-height: 100vh;
}
.gnct-easing {
    left: -200px;
    opacity: 0.8;
}

/* #main > span > span > span (Global navigation tray) */
.Global-navigation-tray {
    max-width: 480px;
}

/* #main > span > span > span > span */
.gcnt-tray-close-wrapper {
    right: 8px;
    position: absolute;
    left: auto;
    top: 8px;
    z-index: 1;
    display: inline-block;
}

/* #main > span > span > span > span > button */
.gcnt-tray-close-btn {
    font-size: 1rem;
    height: 28px;
    all: initial;
    animation: initial;
    background: initial;
    border-collapse: separate;
    border-color: initial;
    border-image: initial;
    border-spacing: initial;
    bottom: auto;
    box-shadow: none;
    box-sizing: border-box;
    caption-side: top;
    clear: none;
    clip: auto;
    color: rgb(0, 0, 0);
    column-count: auto;
    column-fill: balance;
    column-gap: normal;
    column-rule: initial;
    column-width: auto;
    content: normal;
    counter-increment: none;
    counter-reset: none;
    cursor: pointer;
    direction: inherit;
    display: inline-block;
    empty-cells: show;
    float: none;
    font-size: medium;
    font-stretch: normal;
    font-style: normal;
    font-variant: initial;
    font-weight: 400;
    height: auto;
    hyphens: none;
    left: auto;
    letter-spacing: normal;
    line-height: normal;
    list-style: initial;
    margin: 0px;
    max-height: none;
    max-width: 100%;
    min-height: 0px;
    min-width: 0px;
    opacity: 1;
    orphans: 2;
    overflow: visible;
    padding: initial;
    page-break-after: initial;
    page-break-before: initial;
    page-break-inside: initial;
    perspective-origin: 50% 50%;
    perspective: none;
    position: relative;
    right: auto;
    tab-size: 8;
    table-layout: auto;
    text-align-last: auto;
    text-align: center;
    text-decoration: none;
    text-indent: 0px;
    text-shadow: none;
    text-transform: none;
    top: auto;
    touch-action: manipulation;
    transform-origin: 50% 50% 0px;
    transform-style: flat;
    transform: none;
    transition:
        background 0.2s ease 0s,
        transform 0.2s ease 0s;
    unicode-bidi: normal;
    user-select: none;
    vertical-align: middle;
    visibility: visible;
    white-space: normal;
    widows: 2;
    width: auto;
    word-spacing: normal;
    z-index: auto;
    backface-visibility: visible;
}
.gcnt-tray-close-btn[type="button"] {
    -webkit-appearance: none;
}
.gcnt-tray-close-btn:focus,
.gcnt-tray-close-btn:hover,
.gcnt-tray-close-btn:active {
    color: rgb(0, 142, 226);
    outline: rgb(0, 142, 226);
}
.gcnt-tray-close-btn:focus,
.gcnt-tray-close-btn:hover,
.gcnt-tray-close-btn:active {
    text-decoration: none;
}

/* #main > span > span > span > span > button > span */
.gcnt-tray-close-btn .gcnt-tray-close-svg-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    display: block;
}

/* #main > span > span > span > span > button > span > span */
.gcnt-tray-close-txt {
    width: 1px;
    height: 1px;
    position: absolute;
    clip: rect(0px, 0px, 0px, 0px);
    margin: -1px;
    padding: 0px;
    overflow: hidden;
    border-width: 0px;
    border-style: initial;
    border-color: initial;
    border-image: initial;
}

/* #main > span > span > span > div */
.tray-with-space-for-global-nav {
    margin-left: 54px;
}

/* #help_tray */
.gnct-content-wrap {
    box-sizing: border-box;
    padding: 1.5rem;
}

/* #help_tray > h1 */
.gcnt-tray-h1 {
    color: inherit;
    font-size: 22px;
    font-weight: 400;
    line-height: 24.75px;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    margin: 0px;
}

/* #help_tray > ul */
.gcnt-list {
    list-style-type: none;
    -webkit-padding-start: 0px;
    padding-left: 0px;
    margin: 0.75rem 0;
    font-weight: 16px;
    font-family: 400;
    padding: 0px;
}

/* #help_tray > ul > li */
.gcnt-list-item {
    margin-top: 0px;
    margin-bottom: 0px;
    font-size: 16px;
    font-weight: 400;
    line-height: 22.4px;
    padding: 0px;
}

/* #help_tray > ul > li:nth-child(1) > span */
/*.gcnt-list-link-wrapper {}*/
/* #help_tray > ul > li:nth-child(1) > span > a */
.gcnt-list-link-wrapper a.gcnt-list-link:link,
.gcnt-list-link-wrapper a.gcnt-list-link:visited,
.gcnt-list-link-wrapper button.gcnt-list-link {
    cursor: pointer;
    -webkit-font-smoothing: antialiased;
    font-weight: 400;
    color: rgb(0, 142, 226);
    transition: color 0.2s;
}

/* #help_tray > ul > li:nth-child(1) > div (link desc) */
.gcnt-link-desc {
    letter-spacing: normal;
    font-size: 14px;
}
/* Disable the Default Email option */
.email_meta {
    display: none;
}

/* Text Titles indented by one in modules are less large */
li.context_module_sub_header.indent_1 span.title {
    font-size: 1rem;
}

/* Turn an image into a rounded image */
img.rounded {
    object-fit: cover;
    border-radius: 25px;
}
.rounded {
    border-radius: 25px;
}

/* Tables inside table cells clip outside due to a higher level margin rule on nopadding content */
table tr td table {
    margin: 0px !important;
}

/* Change default sub-list type to letters */
ol li ol {
    list-style-type: lower-alpha;
}

/* People adding on-paper quiz assignments keep using the +Quiz button */
a.new_quiz_lti.btn.icon-plus::after {
    content: " (Online)";
}
button.btn.btn-primary.new-quiz-link::after {
    content: "(Online)";
}
div#gradebook-grid-wrapper::before {
    content: 'Need to add a column for on-paper assignments or quizzes? Create an assignment in the Assignments area and set the type to "On Paper"';
}

/* Hide generate new account */
.ic-Login-header__links {
    color: #fff;
    flex: 1;
    display: none;
    text-align: right;
    font-size: 0.8125rem;
    line-height: 1.3;
    box-sizing: border-box;
    padding-left: 12px;
}

/* Make the tool bar in the tinyMEC flowable. It's less pretty, but works less like garbage */
div.mce-stack-layout {
    white-space: inherit;
}

div.mce-container * {
    white-space: normal;
}

.compose-button {
    width: fit-content !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 2px !important;
    padding: 0.5rem !important;
}

.StudentContextTray-Header__Name {
    display: flex !important;
    align-items: center !important;
    flex-direction: row;
    flex-wrap: wrap;
}

.StudentContextTray-Header__Name h2 {
    /* outline: red 1px solid!important; */
    padding-right: 0.35em !important;
}

.student_context_card_trigger * {
    pointer-events: none;
}

.spinner {
    animation: spin 2s linear infinite;
}

.loader-global-js {
    animation: spin 2s linear infinite;
    width: 6px;
    height: 6px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid var(--ic-brand-primary);
    border-radius: 50%;
    display: inline-block;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* 
    Checkbox 
*/

.globaljs-checkbox {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    position: relative;
}

.globaljs-checkbox input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    width: 1.25em;
    height: 1.25em;
    margin: 0;
    cursor: inherit;
}

.globaljs-checkbox-facade {
    color: rgb(255, 255, 255);
    background: rgb(255, 255, 255);
    position: relative;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    box-sizing: border-box;
    flex-shrink: 0;
    transition: 0.2s;
    border: 0.0625rem solid rgb(141, 149, 159);
    border-radius: 0.25rem;
    margin-inline: 0px 0.5rem;
    padding: 0.125rem;
    font-size: 0.75rem;
    width: 1.25rem;
    height: 1.25rem;
}

.globaljs-checkbox-icon {
    /* display: none;
    width: 100%;
    height: 100%;
    fill: #fff; */
    fill: currentcolor;
    display: block;
    overflow: visible;
    color: inherit;
    vertical-align: middle;
    line-height: 1;
    width: 1em;
    height: 1em;
}

.globaljs-checkbox.globaljs-checkbox-checked .globaljs-checkbox-facade {
    background: rgb(39, 53, 64);
    border-color: rgb(39, 53, 64);
    border: 0.0625rem solid rgb(39, 53, 64);
}

.globaljs-checkbox.globaljs-checkbox-checked .globaljs-checkbox-icon {
    display: block;
    width: 1em;
    height: 1em;
}

.globaljs-checkbox input:focus + .globaljs-checkbox-facade {
    outline: 2px solid var(--ic-brand-primary);
    outline-offset: 0.2em;
}

.globaljs-checkbox-label {
    flex: 1 1 auto;
    min-width: 0.0625rem;
    color: rgb(39, 53, 64);
    font-family: LatoWeb, "Lato Extended", Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 400;
    line-height: 1.25;
    font-size: 1rem;
}

.globaljs-grid-row:last-child {
    margin-top: 0.75rem;
}

.globaljs-checkbox.loading {
    pointer-events: none;
    /* Pulse Effect */
    position: relative;
    animation: pulse 1.5s infinite;
}

.globaljs-checkbox.loading::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 0.25rem;
    animation: pulse 1.5s infinite;
}

@keyframes pulse {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0.5;
    }
    100% {
        opacity: 1;
    }
}

#intra-group-select {
    display: none;
    margin-left: 12px;

    & select {
        margin-bottom: 0 !important;
    }
}

.globaljs-checkbox.globaljs-checkbox-checked ~ #intra-group-select {
    display: inline-block;
}

.globaljs-checkbox.loading ~ #intra-group-select {
    pointer-events: none;
    animation: pulse 1.5s infinite;
}

span.group-avatar {
    display: inline-block;
    background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 1920 1920" xmlns="http://www.w3.org/2000/svg"><path d="M1807.059 1270.091c-68.668 48.452-188.725 116.556-343.906 158.57-18.861-102.55-92.725-187.37-196.066-219.106-91.708-28.235-185.11-48.339-279.53-61.666 71.944-60.762 121.638-145.807 135.982-243.162 21.91-.791 44.837-1.243 71.04-1.243 166.023.904 331.143 26.316 490.955 75.445 72.621 22.362 121.525 87.755 121.525 162.861v128.301Zm-451.765 338.824c-114.183 80.753-330.24 198.099-621.176 198.099-129.43 0-379.144-26.203-621.177-198.1v-128.752c0-74.993 49.017-140.499 121.75-162.861 162.41-49.694 330.354-74.88 499.427-74.88h8.47c166.588.79 331.821 26.09 491.407 75.106 72.509 22.249 121.3 87.642 121.3 162.635v128.753Zm-903.53-761.901V734.072c0-155.632 126.608-282.352 282.354-282.352 155.746 0 282.353 126.72 282.353 282.352v112.942c0 155.746-126.607 282.353-282.353 282.353S451.765 1002.76 451.765 847.014Zm734.118-734.118c75.22 0 146.146 29.478 199.567 82.899 53.309 53.421 82.786 124.235 82.786 199.454V508.19c0 155.746-126.607 282.353-282.353 282.353-19.651 0-38.4-2.598-56.47-6.438v-50.033c0-156.423-92.047-290.71-224.188-354.748 8.357-148.066 130.447-266.428 280.658-266.428Zm532.857 758.061c-91.37-28.01-184.546-48.226-279.755-61.666 86.174-72.508 142.192-179.802 142.192-301.1V395.248c0-105.374-41.11-204.65-115.877-279.304-74.767-74.767-173.93-115.99-279.417-115.99-200.696 0-365.138 151.002-390.211 345.148-20.217-3.275-40.433-6.325-61.553-6.325-217.977 0-395.294 177.43-395.294 395.294v112.942c0 121.298 56.018 228.593 142.305 301.214-94.305 13.214-188.16 33.092-279.529 61.1C81.092 1246.375 0 1355.249 0 1480.163v185.675l22.588 16.941c275.238 206.344 563.803 237.177 711.53 237.177 344.244 0 593.618-148.63 711.53-237.177l22.587-16.94v-120.51c205.214-50.597 355.652-146.032 429.177-201.373l22.588-16.941V1141.79c0-125.026-80.979-233.901-201.261-270.833Z" fill-rule="evenodd"/></svg>');
    background-size: 65% 65% !important;
    background-repeat: no-repeat;
    background-position: center;
    transition:
        outline-color 0.2s,
        outline-offset 0.25s;
    outline-offset: -0.8rem;
    outline: rgba(108, 16, 18, 0) solid 0.125rem;
    box-sizing: border-box;
    border-style: solid;
    border-color: rgb(141, 149, 159);
    background-color: rgb(255, 255, 255);
    background-clip: content-box;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    overflow: hidden;
    line-height: 0;
    text-align: center;
    font-size: 1.5rem;
    border-width: 0.125rem;
    width: 2.08333em;
    height: 2.08333em;
    position: relative;
    border-radius: 100%;
}

.intra-group-banner {
    display: flex;
    align-items: center;

    padding: 2px;
    margin: 24px 12px 0px;

    border-radius: 0.25rem;

    &:not(.intra-group-error) {
        background: rgb(43, 122, 188);
    }

    &.intra-group-error {
        background: rgb(230, 36, 41);
    }

    & span.intra-group-info {
        display: block;
        width: 20px;
        height: 20px;

        margin: 0 1rem;

        filter: brightness(0) invert(1);
    }

    & div#intra-group-flex-div {
        background: rgb(255, 255, 255);
        border-top-right-radius: 0.25em;
        border-bottom-right-radius: 0.25em;
        flex: 1;

        padding: 0.75rem 1.5rem;

        display: flex;
        gap: 1rem;
    }

    & div#intra-group-text-div {
        font-weight: 400;
        line-height: 1.25;
    }

    & h6 {
        margin-top: 0;
    }

    & p {
        font-style: italic;
        margin-top: 0;
        margin-bottom: 0;
    }

    & button {
        all: unset;
        box-sizing: border-box;
        font-family: LatoWeb, "Lato Extended", Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
        max-width: 100%;
        overflow: visible;
        height: fit-content;
        margin-top: auto;
        margin-bottom: auto;
        display: inline-block;
        vertical-align: middle;
        color: var(--ic-brand-button--secondary-text);
        position: relative;
        overscroll-behavior: auto;
        border-radius: calc(0.4375rem);
        transition:
            outline-color 0.2s,
            outline-offset 0.25s;
        outline-offset: -0.8rem;
        outline: rgba(108, 16, 18, 0) solid 0.125rem;
        appearance: none;
        text-decoration: none;
        touch-action: manipulation;
        padding: 6px 18px;
        background-color: var(--ic-brand-button--secondary-bgd);
        cursor: pointer;

        transition: all 0.2s ease-in-out;

        &:hover {
            outline-offset: -0.8rem;
            outline: rgba(108, 16, 18, 0) solid 0.125rem;
            background-color: var(--ic-brand-button--secondary-bgd-darkened-5);
        }

        &:active {
            outline-offset: -0.8rem;
            outline: rgba(108, 16, 18, 0) solid 0.125rem;
            background-color: var(--ic-brand-button--secondary-bgd-darkened-15);
        }
    }
}
