/*!
 *  OFMEM Overides CSS v0.2.00
 *
 *  Styles intended to override generated and default style sheets.
 *
 *  Use for hot fixes, quick testing, and any other time you want to add styles 
 *  without editing LESS files or needing to re-compile all our CSS files.
 *  This stylesheet should always be the last stylesheet loaded on a page.
 *
 *  From time to time, styles here may be refactored, converted into LESS,
 *  and moved into the main ofmem-custom.less file. When doing this 
 *  during development, the original CSS should be left here and commented
 *  out with a note to indicate where to find the corresponding LESS code.
 *
 *  CONTENTS:
 *    typography
 *    headings
 *    branding
 *    tables
 *    dataTables
 *    Kendo UI overrides
 *    new additions
 *
 */


/*#region typography*/
/*Default bootstrap font-size is 1.4em*/
/*Body tag  needed for css to take effect*/
/*Set default fonts and font size*/
body {
    /*TODO set default font, colours, and size elsewhere if necessary */
    /*
    color: #333333;
    font-family: Verdana, Arial, sans-serif;
    font-size: 1.25em;
*/
}
/*#endregion typography*/


/*#region headings*/
/*    Updated headings to retain the original look and feel when adding a semantic strucutre
*/
/*H2 for panels that need to reduce margin from the default*/
/* 2021-07-06 (PKIFF): Leaving this here for the moment. Maybe we should edit the base H2 (and H1) style? */
h2.panel-header {
    margin-top: 0;
    margin-bottom: 0;
}

/*#endregion headings*/


/*#region branding*/
/* 2021-07-06 (PKIFF): I'm leaving this for now, but we should discuss at some point. 
    I think this branding goes against the look and feel of the rest of the site. 
    I'm inclined to reduce its visual weight by removing the background. 
    Keep the logo and the header, but get rid of the heavy block of colour. */
.brand-pane {
    border-radius: 6px;
    padding: 10px 15px;
}

    .brand-pane img {
        width: 120px;
    }

    .brand-pane h1 {
        color: #ffde53;
        font-size: 3em;
        font-weight: normal;
        padding-left: .5em;
        padding-right: .5em;
    }

@media (min-width: 768px) {
    .brand-pane img {
        width: 160px;
    }

    .brand-pane h2 {
        font-size: 2.75em;
    }
}

.brand-emo {
    background-color: #020178;
}

.brand-ofm {
    background-color: #333333;
}

.brand-ofmem {
    background-color: #333333;
}

/*#endregion branding*/


/*#region tables*/
/* 2021-07-06 (PKIFF): What are these table captions? I can't find any. I'm not sure they should be blue unless they are a link? */
caption {
    color: #00357a;
    font-size: 1.6em;
    font-weight: bold;
    margin-bottom: 0;
    padding-bottom: 5px !important;
}

/*#endregion Tables*/


/*#region dataTables*/
/*
Note: More details on styling can be found https://datatables.net/manual/styling/
A Theme creator can be found at https://datatables.net/manual/styling/theme-creator
*/

table.dataTable {
    width: 100%;
    margin: 0 auto;
    clear: both;
    border-collapse: separate;
    border-spacing: 0;
    /*
   * Header and footer styles
   */
    /*
   * Body styles
   */
}


    table.dataTable thead th,
    table.dataTable tfoot th {
        font-weight: bold;
    }

    table.dataTable thead th,
    table.dataTable thead td {
        padding: 10px 18px;
        border-bottom: 1px solid #111111;
    }

        table.dataTable thead th:active,
        table.dataTable thead td:active {
            outline: none;
        }

    table.dataTable tfoot th,
    table.dataTable tfoot td {
        padding: 10px 18px 6px 18px;
        border-top: 1px solid #111111;
    }

    table.dataTable thead .sorting,
    table.dataTable thead .sorting_asc,
    table.dataTable thead .sorting_desc,
    table.dataTable thead .sorting_asc_disabled,
    table.dataTable thead .sorting_desc_disabled {
        cursor: pointer;
        *cursor: hand;
        background-repeat: no-repeat;
        background-position: center right;
    }

    table.dataTable thead .sorting {
        background-image: url("../plugins/dataTables/images/sort_both.png");
    }

    table.dataTable thead .sorting_asc {
        background-image: url("../plugins/dataTables/images/sort_asc.png") !important;
    }

    table.dataTable thead .sorting_desc {
        background-image: url("../plugins/dataTables/images/sort_desc.png") !important;
    }

    table.dataTable thead .sorting_asc_disabled {
        background-image: url("../plugins/dataTables/images/sort_asc_disabled.png");
    }

    table.dataTable thead .sorting_desc_disabled {
        background-image: url("../plugins/dataTables/images/sort_desc_disabled.png");
    }

    table.dataTable tbody tr {
        background-color: #ffffff;
    }

        table.dataTable tbody tr.selected {
            background-color: #b0bed9;
        }

    table.dataTable tbody th,
    table.dataTable tbody td {
        padding: 8px 10px;
    }

    table.dataTable.row-border tbody th, table.dataTable.row-border tbody td, table.dataTable.display tbody th, table.dataTable.display tbody td {
        border-top: 1px solid #dddddd;
    }

    table.dataTable.row-border tbody tr:first-child th,
    table.dataTable.row-border tbody tr:first-child td, table.dataTable.display tbody tr:first-child th,
    table.dataTable.display tbody tr:first-child td {
        border-top: none;
    }

    table.dataTable.cell-border tbody th, table.dataTable.cell-border tbody td {
        border-top: 1px solid #dddddd;
        border-right: 1px solid #dddddd;
    }

    table.dataTable.cell-border tbody tr th:first-child,
    table.dataTable.cell-border tbody tr td:first-child {
        border-left: 1px solid #dddddd;
    }

    table.dataTable.cell-border tbody tr:first-child th,
    table.dataTable.cell-border tbody tr:first-child td {
        border-top: none;
    }

    table.dataTable.stripe tbody tr.odd, table.dataTable.display tbody tr.odd {
        background-color: #f9f9f9;
    }

        table.dataTable.stripe tbody tr.odd.selected, table.dataTable.display tbody tr.odd.selected {
            background-color: #acbad4;
        }

    table.dataTable.hover tbody tr:hover, table.dataTable.display tbody tr:hover {
        background-color: #f6f6f6;
    }

        table.dataTable.hover tbody tr:hover.selected, table.dataTable.display tbody tr:hover.selected {
            background-color: #aab7d1;
        }

    table.dataTable.order-column tbody tr > .sorting_1,
    table.dataTable.order-column tbody tr > .sorting_2,
    table.dataTable.order-column tbody tr > .sorting_3, table.dataTable.display tbody tr > .sorting_1,
    table.dataTable.display tbody tr > .sorting_2,
    table.dataTable.display tbody tr > .sorting_3 {
        background-color: #fafafa;
    }

    table.dataTable.order-column tbody tr.selected > .sorting_1,
    table.dataTable.order-column tbody tr.selected > .sorting_2,
    table.dataTable.order-column tbody tr.selected > .sorting_3, table.dataTable.display tbody tr.selected > .sorting_1,
    table.dataTable.display tbody tr.selected > .sorting_2,
    table.dataTable.display tbody tr.selected > .sorting_3 {
        background-color: #acbad5;
    }

    table.dataTable.display tbody tr.odd > .sorting_1, table.dataTable.order-column.stripe tbody tr.odd > .sorting_1 {
        background-color: #f1f1f1;
    }

    table.dataTable.display tbody tr.odd > .sorting_2, table.dataTable.order-column.stripe tbody tr.odd > .sorting_2 {
        background-color: #f3f3f3;
    }

    table.dataTable.display tbody tr.odd > .sorting_3, table.dataTable.order-column.stripe tbody tr.odd > .sorting_3 {
        background-color: whitesmoke;
    }

    table.dataTable.display tbody tr.odd.selected > .sorting_1, table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_1 {
        background-color: #a6b4cd;
    }

    table.dataTable.display tbody tr.odd.selected > .sorting_2, table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_2 {
        background-color: #a8b5cf;
    }

    table.dataTable.display tbody tr.odd.selected > .sorting_3, table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_3 {
        background-color: #a9b7d1;
    }

    table.dataTable.display tbody tr.even > .sorting_1, table.dataTable.order-column.stripe tbody tr.even > .sorting_1 {
        background-color: #fafafa;
    }

    table.dataTable.display tbody tr.even > .sorting_2, table.dataTable.order-column.stripe tbody tr.even > .sorting_2 {
        background-color: #fcfcfc;
    }

    table.dataTable.display tbody tr.even > .sorting_3, table.dataTable.order-column.stripe tbody tr.even > .sorting_3 {
        background-color: #fefefe;
    }

    table.dataTable.display tbody tr.even.selected > .sorting_1, table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_1 {
        background-color: #acbad5;
    }

    table.dataTable.display tbody tr.even.selected > .sorting_2, table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_2 {
        background-color: #aebcd6;
    }

    table.dataTable.display tbody tr.even.selected > .sorting_3, table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_3 {
        background-color: #afbdd8;
    }

    table.dataTable.display tbody tr:hover > .sorting_1, table.dataTable.order-column.hover tbody tr:hover > .sorting_1 {
        background-color: #eaeaea;
    }

    table.dataTable.display tbody tr:hover > .sorting_2, table.dataTable.order-column.hover tbody tr:hover > .sorting_2 {
        background-color: #ececec;
    }

    table.dataTable.display tbody tr:hover > .sorting_3, table.dataTable.order-column.hover tbody tr:hover > .sorting_3 {
        background-color: #efefef;
    }

    table.dataTable.display tbody tr:hover.selected > .sorting_1, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_1 {
        background-color: #a2aec7;
    }

    table.dataTable.display tbody tr:hover.selected > .sorting_2, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_2 {
        background-color: #a3b0c9;
    }

    table.dataTable.display tbody tr:hover.selected > .sorting_3, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_3 {
        background-color: #a5b2cb;
    }

    table.dataTable.no-footer {
        border-bottom: 1px solid #111111;
    }

    table.dataTable.nowrap th, table.dataTable.nowrap td {
        white-space: nowrap;
    }

    table.dataTable.compact thead th,
    table.dataTable.compact thead td {
        padding: 4px 17px;
    }

    table.dataTable.compact tfoot th,
    table.dataTable.compact tfoot td {
        padding: 4px;
    }

    table.dataTable.compact tbody th,
    table.dataTable.compact tbody td {
        padding: 4px;
    }

    table.dataTable th.dt-left,
    table.dataTable td.dt-left {
        text-align: left;
    }

    table.dataTable th.dt-center,
    table.dataTable td.dt-center,
    table.dataTable td.dataTables_empty {
        text-align: center;
    }

    table.dataTable th.dt-right,
    table.dataTable td.dt-right {
        text-align: right;
    }

    table.dataTable th.dt-justify,
    table.dataTable td.dt-justify {
        text-align: justify;
    }

    table.dataTable th.dt-nowrap,
    table.dataTable td.dt-nowrap {
        white-space: nowrap;
    }

    table.dataTable thead th.dt-head-left,
    table.dataTable thead td.dt-head-left,
    table.dataTable tfoot th.dt-head-left,
    table.dataTable tfoot td.dt-head-left {
        text-align: left;
    }

    table.dataTable thead th.dt-head-center,
    table.dataTable thead td.dt-head-center,
    table.dataTable tfoot th.dt-head-center,
    table.dataTable tfoot td.dt-head-center {
        text-align: center;
    }

    table.dataTable thead th.dt-head-right,
    table.dataTable thead td.dt-head-right,
    table.dataTable tfoot th.dt-head-right,
    table.dataTable tfoot td.dt-head-right {
        text-align: right;
    }

    table.dataTable thead th.dt-head-justify,
    table.dataTable thead td.dt-head-justify,
    table.dataTable tfoot th.dt-head-justify,
    table.dataTable tfoot td.dt-head-justify {
        text-align: justify;
    }

    table.dataTable thead th.dt-head-nowrap,
    table.dataTable thead td.dt-head-nowrap,
    table.dataTable tfoot th.dt-head-nowrap,
    table.dataTable tfoot td.dt-head-nowrap {
        white-space: nowrap;
    }

    table.dataTable tbody th.dt-body-left,
    table.dataTable tbody td.dt-body-left {
        text-align: left;
    }

    table.dataTable tbody th.dt-body-center,
    table.dataTable tbody td.dt-body-center {
        text-align: center;
    }

    table.dataTable tbody th.dt-body-right,
    table.dataTable tbody td.dt-body-right {
        text-align: right;
    }

    table.dataTable tbody th.dt-body-justify,
    table.dataTable tbody td.dt-body-justify {
        text-align: justify;
    }

    table.dataTable tbody th.dt-body-nowrap,
    table.dataTable tbody td.dt-body-nowrap {
        white-space: nowrap;
    }

    table.dataTable,
    table.dataTable th,
    table.dataTable td {
        box-sizing: content-box;
    }

/*
 * Control feature layout
 */
.dataTables_wrapper {
    position: relative;
    clear: both;
    *zoom: 1;
    zoom: 1;
    margin: 10px;
}

    .dataTables_wrapper .dataTables_length {
        float: left;
    }

        .dataTables_wrapper .dataTables_length select {
            border: 1px solid #aaa;
            border-radius: 3px;
            /*padding: 5px;*/
            background-color: transparent;
            padding: 4px;
        }

    .dataTables_wrapper .dataTables_filter {
        float: right;
        text-align: right;
    }

        .dataTables_wrapper .dataTables_filter input {
            border: 1px solid #aaa;
            border-radius: 3px;
            padding: 5px;
            background-color: transparent;
            margin-left: 3px;
        }

    .dataTables_wrapper .dataTables_info {
        clear: both;
        float: left;
        padding-top: 0.755em;
    }

    /*PKIFF (2021-06-18): Remove Pagination Overrides? I don't understand what these do for us?*/
    /*
    .dataTables_wrapper .dataTables_paginate {
        float: right;
        text-align: right;
        padding-top: 0.25em;
    }

        .dataTables_wrapper .dataTables_paginate .paginate_button {
            box-sizing: border-box;
            display: inline-block;
            min-width: 1.5em;
            padding: 0.5em 1em;
            margin-left: 2px;
            text-align: center;
            text-decoration: none !important;
            cursor: pointer;
            *cursor: hand;
            color: #333333 !important;
            border: 1px solid transparent;
            border-radius: 2px;
        }

            .dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
                color: #333333 !important;
                border: 1px solid #979797;
                background-color: white;
                background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(100%, #dcdcdc));
                /* Chrome,Safari4+ !1!
                background: -webkit-linear-gradient(top, white 0%, #dcdcdc 100%);
                /* Chrome10+,Safari5.1+ !1!
                background: -moz-linear-gradient(top, white 0%, #dcdcdc 100%);
                /* FF3.6+ !1!
                background: -ms-linear-gradient(top, white 0%, #dcdcdc 100%);
                /* IE10+ !1!
                background: -o-linear-gradient(top, white 0%, #dcdcdc 100%);
                /* Opera 11.10+ !1!
                background: linear-gradient(to bottom, white 0%, #dcdcdc 100%);
                /* W3C !1!
            }

            .dataTables_wrapper .dataTables_paginate .paginate_button.disabled, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
                cursor: default;
                color: #666 !important;
                border: 1px solid transparent;
                background: transparent;
                box-shadow: none;
            }

            .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
                color: white !important;
                border: 1px solid #111111;
                background-color: #585858;
                background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #585858), color-stop(100%, #111111));
                /* Chrome,Safari4+ !1!
                background: -webkit-linear-gradient(top, #585858 0%, #111111 100%);
                /* Chrome10+,Safari5.1+ !1!
                background: -moz-linear-gradient(top, #585858 0%, #111111 100%);
                /* FF3.6+ !1!
                background: -ms-linear-gradient(top, #585858 0%, #111111 100%);
                /* IE10+ !1!
                background: -o-linear-gradient(top, #585858 0%, #111111 100%);
                /* Opera 11.10+ !1!
                background: linear-gradient(to bottom, #585858 0%, #111111 100%);
                /* W3C !1!
            }

            .dataTables_wrapper .dataTables_paginate .paginate_button:active {
                outline: none;
                background-color: #2b2b2b;
                background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2b2b2b), color-stop(100%, #0c0c0c));
                /* Chrome,Safari4+ !1!
                background: -webkit-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
                /* Chrome10+,Safari5.1+ !1!
                background: -moz-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
                /* FF3.6+ !1!
                background: -ms-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
                /* IE10+ !1!
                background: -o-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
                /* Opera 11.10+ !1!
                background: linear-gradient(to bottom, #2b2b2b 0%, #0c0c0c 100%);
                /* W3C !1!
                box-shadow: inset 0 0 3px #111;
            }

        .dataTables_wrapper .dataTables_paginate .ellipsis {
            padding: 0 1em;
        }
        */

    .dataTables_wrapper .dataTables_processing {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 100%;
        height: 40px;
        margin-left: -50%;
        margin-top: -25px;
        padding-top: 20px;
        text-align: center;
        font-size: 1.2em;
        background-color: white;
        background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(25%, rgba(255, 255, 255, 0.9)), color-stop(75%, rgba(255, 255, 255, 0.9)), color-stop(100%, rgba(255, 255, 255, 0)));
        background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
        background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
        background: -ms-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
        background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
        background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
    }

    .dataTables_wrapper .dataTables_length,
    .dataTables_wrapper .dataTables_filter,
    .dataTables_wrapper .dataTables_info,
    .dataTables_wrapper .dataTables_processing,
    .dataTables_wrapper .dataTables_paginate {
        color: #333333;
    }

    .dataTables_wrapper .dataTables_scroll {
        clear: both;
    }

        .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody {
            *margin-top: -1px;
            -webkit-overflow-scrolling: touch;
        }

            .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > th, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > td, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > th, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > td {
                vertical-align: middle;
            }

                .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > th > div.dataTables_sizing,
                .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > td > div.dataTables_sizing, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > th > div.dataTables_sizing,
                .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > td > div.dataTables_sizing {
                    height: 0;
                    overflow: hidden;
                    margin: 0 !important;
                    padding: 0 !important;
                }

    .dataTables_wrapper.no-footer .dataTables_scrollBody {
        border-bottom: 1px solid #111111;
    }

    .dataTables_wrapper.no-footer div.dataTables_scrollHead table.dataTable,
    .dataTables_wrapper.no-footer div.dataTables_scrollBody > table {
        border-bottom: none;
    }

    .dataTables_wrapper:after {
        visibility: hidden;
        display: block;
        content: "";
        clear: both;
        height: 0;
    }

@media screen and (max-width: 767px) {
    .dataTables_wrapper .dataTables_info,
    .dataTables_wrapper .dataTables_paginate {
        float: none;
        text-align: center;
    }

    .dataTables_wrapper .dataTables_paginate {
        margin-top: 0.5em;
    }
}

@media screen and (max-width: 640px) {
    .dataTables_wrapper .dataTables_length,
    .dataTables_wrapper .dataTables_filter {
        float: none;
        text-align: center;
    }

    .dataTables_wrapper .dataTables_filter {
        margin-top: 0.5em;
    }
}




table.dataTable thead .sorting_desc:after {
    content: none;
}

/*#endregion dataTables*/


/*#region Kendo UI overrides*/
/*    Todo determine if this is the best spot for this *** Incorporate the ODS into Kendo UA***
    */
/*.k-form-error, .k-form-hint { display:block; }
*/

/*Kendo overrides*/
/*Error message*/
.k-form-error {
    color: #CD0000;
    font-size: inherit;
}

/*#endregion*/


/*#region new additions */
/*Add anything new in this #region here, or simply add it to the end of the file. */

/* TODO QUESTION FOR IAN: We are changing this from white to off-white? */
/* Can you drop in a sample URL of where this appears? */
.input-group-addon {
    background-color: #f2f2f2 !important;
}

/* PKIFF (2021-09-14): Moved to ofmem-custom. */
/*pre {
    white-space: pre-wrap;
}*/

/* PKIFF (2021-09-14): Moved to ofmem-custom. */
/*.products-list .product-description {
    color: #1a1a1a;
}
.products-list > .item {
    padding-left: 5px;
    padding-right: 5px;
}
*/

/* TODO QUESTION FOR IAN: We darken this background for some reason?*/
/*Can you drop in a sample URL of where this appears?*/
/*Location used: Not certain will need to look for it*/
.products-list > .item {
    background-color: #EBE7DB;
}

/* PKIFF (2021-09-15): Moved to forms section of ofmem-custom, commented out in geotalent-custom */
/*override date class from geotalent-custom.css*/
/* TODO QUESTION FOR IAN: Should this be an EM instead of PX? It is for the width of a date field, we can try, what would the coversion be?*/
/* Can you drop in a URL where this code appears?
        todo @phil  /GTFLEX/GTOnline.dll/SearchCourses/
*/
.input-group[class*=col-].date {
    width: 175px;
}

/*Updated  to resolve contrast error. todo Location used: /GTFLEX/GTOnline.dll/Dashboard
There may be other areas where this is being used
    This the line in the progress bar  in the completion box
    todo @phil I chose ODS accent colour dark purple, feel free to change */

.info-box .progress .progress-bar {
    background-color: #92278F
}

/*Calendar styles - Overridend mostly from the geotalent-custom.css
    todo Location used: http://localhost/GTFLEX/GTOnline.dll/StudentCalendar and http://localhost/GTFLEX/GTOnline.dll/InstructorSchedule
    
    */
.CalendarCell {
    font-size: inherit;
}

.CalendarBar {
    font-size: inherit;
    background-color: #EBE7DB;
}

.CalendarCellInactive {
    font-size: inherit;
}
/*Allows sidebar menu to remain open*/
.sidebar-menu .treeview-menu {
    display: block;
}


/*todo @Phil - recent additions
    Sub heading that is used to replicate the previously used legend
    We should adust when when we look at updating the heading levels
    PKIFF (2021-11-05): switched to 24px to 1.5rem for accessibility. Haven't touched any things else yet.
*/
.sub-header {
    display: block;
    width: 100%;
    margin-bottom: 22px;
    font-size: 1.5rem; 
    line-height: inherit;
    color: #1A1A1A;
    border-bottom: 1px solid #e5e5e5;
}

/*Update modal*/
.modal-header {
    background-color: #000;
}

.modal-title {
    color: #ffffff;
    font-size: 32px;
}
/*todo @Phil added to class modal and course modal to keep in line with bootstrap intent but changed colour as the modal header is a different colour*/
.modal-title-small {
    color: #ffffff !important;
}

.modal-footer {
    background-color: #000;
}

.close {
    color: #ffffff;
    opacity: inherit;
}

    .close:hover, .close:focus {
        color: #ffffff;
        text-decoration: underline;
        cursor: pointer;
        filter: inherit;
        opacity: inherit;
    }

/*todo @Phil added to fix the size issue of the password toggle button
    todo Pages located: home.aspx, Studentpassword, PublicClass
    The PublicClass page for restricted courses, the size is still off
    PKIFF (2021-11-05): switched from 14px to 0.875rem for accessibility. Haven't dealt with other issues yet. 
*/
.pwdToggle {
    font-size: 0.875rem;
}


/*todo @Phil - Added so that the text would wrap when too long */
/*Sample page - Instructor Class */
.class-notes {
    word-break: break-all;
}

/*todo @Phil - Added to give some more padding*/
/*Sample page - Instructor class attendance*/
.bg-warning, .bg-info, .bg-danger, bg-primary, .bg-success {
    padding: 10px;
}

/*todo @Phil - updated to match sub-header class this will now be included fro all tables, THis shoiuld replace the caption in the ofmem.css*/
/*todo Sample page - ANy page with a grid*/
caption {
    font-size: 1.5em;
    font-weight: normal;
    margin-bottom: 0;
    padding-bottom: 5px;
    width: 100%;
    line-height: inherit;
    color: #1A1A1A;
    border-bottom: 1px solid #e5e5e5;
}

/*todo @Phil - Updated to go with the webaim implemenation.  The evaluation tool was flagging.*/
/*todo Sample page - ANy page with the search*/
.sr-only {
    position: absolute;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
    color: #FFFFFF;   /* BUG 153230 AODA S.J. replaced original value of  #1a1a1a; with #FFFFFF; */

}

/*todo @Phil - Fix for side nav menu that removes the links for the group category (Catalogue, Dashboards etc) and replaces with <span>  */
/*todo Sample page - ANy page with side nav menu*/

.sidebar-menu > li > span {
    padding: 12px 5px 12px 15px;
    display: block;
}
/*todo @Phil - newly added*/
/*todo Sample page - ANy page with side nav menu*/
.sidebar-menu-category {
    font-weight: 600;
}




/*todo @Phil - changed disabled color to meet accessiblity standards */
/*todo Sample page - ANy page with side nav menu*/
.pagination > .disabled > span, .pagination > .disabled > span:hover, .pagination > .disabled > span:focus, .pagination > .disabled > a, .pagination > .disabled > a:hover, .pagination > .disabled > a:focus {
    color: #1a1a1a;
    cursor: not-allowed;
    background-color: #fff;
    border-color: #ddd;
}

/*#endregion new additions*/

pre {
    font-size: 1em;
}

/*skip link*/
#skip-link a, #skip-link a:link, #skip-link a:visited {
    color: #0D5977;
}

#skip-link a:active, #skip-link a:focus, #skip-link a:hover {
        text-decoration: underline;
}


.element-invisible {
    position: absolute !important;
    clip: rect(1px, 1px, 1px, 1px);
    overflow: hidden;
    height: 1px;
}

.element-invisible.element-focusable:active,
.element-invisible.element-focusable:focus {
        position: static !important;
        clip: auto;
        overflow: visible;
        height: auto;
}