/* ===============
Sandra Oveissi
Copyright 2014 Nexus6 Software
written for - www.sample.com

swatch colors
========
rgba(91, 183, 91, 0.8) - green transparent color
#FFFFFF - White Color
#333 - Dark Gray
#555 - lighter Gray
#989898, #F5F5F5 - light Gray
#F5F5F5 - Milky
#E8E8E8 - Dark Milky
rgb(0, 153, 51) - Green
#5cb85c - ligt green
================== */

/***************** Angular  CSS Classes *****************/
/* To speed up Angular 'hide un-scoped elements' directive */
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
    display: none !important;
}

/* Angular adds :requried to validation fields - looks terrible in IE. Remove outline */
input:invalid, input:required:invalid, input.ng-invalid {
    outline: none !important;
    outline-color:transparent !important;
}

/***************** HTML5 Overrides *****************/
/* turn off number input type spin button */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
   -webkit-appearance: none;
   margin: 0;
}
/* Firefox */
input[type=number] {
   -moz-appearance: textfield;
}

/* hide placeholder text on readonly elements */
textarea[readonly]::-webkit-input-placeholder,
input[readonly]::-webkit-input-placeholder { /* WebKit browsers */
    color:transparent;
}
textarea[readonly]:-moz-placeholder,
input[readonly]:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:transparent;
}
textarea[readonly]::-moz-placeholder,
input[readonly]::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:transparent;
}
textarea[readonly]:-ms-input-placeholder,
input[readonly]:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:transparent;
}


/***** Attempt to fix IE's horrible image scale rendering ****/
/*img { -ms-interpolation-mode: bicubic; }*/

/***************** Bootstrap CSS Classes *****************/

html {
  position: relative;
  min-height: 100%;
}
body {
  /* Margin bottom by footer height */
  margin-bottom: 40px;
}

footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 40px;
  padding: 0px !important;
  background-color: #f8f8f8;
  border-top: 1px solid #e7e7e7;
}

.panel {
    margin-bottom: 10px;
}
.panel.no-panel-border {
    border: none !important;
}
/* main_ui has always been missing a .row to remove 15px excess padding left and right
   of the panels. This is an initial attempt to remedy that, setting to 0 by default
   (i.e. no change for all sites), then manually turning on site by site */
.row.row-neg-pad {
    margin-left:0;
    margin-right:0;
}
/*
.panel-heading {
    max-height: 41px;
}*/
.disabled.allow-tooltip {
    pointer-events:auto;
    cursor: pointer;
}
.panel-body.no-pad, .modal-body.no-pad {
    padding:0;
}

.gen-panel-body{
    background-color: #f5f5f5;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}

hr, .item-withclear{
    clear: both;
}

a, a:link, a:visited, a:active {
    color: rgb(0, 153, 51);
    /*border-bottom: 0.08em solid transparent;*/
    font-weight: bold;
    cursor:pointer;
    text-decoration: none;
    outline: none;
}

/* Hack to add to bootstrap cols to vertically align */
/* (note: must add to all cols in row) */
.v-center {
    display: inline-block;
    vertical-align: middle;
    float: none;
}

/*********************************************/
/**** Site-panel background colours
/*********************************************/
.site-panel-header-bg-color {
    background-color: #bbb;
}

.site-panel-sub-header-bg-color {
    background-color: #f5f5f5;
}

.site-panel-addon-bg-color {
    background-color: #666;
}

.site-panel-footer-bg-color {
    background-color: #f5f5f5;
}

/* make the modal close button a bit more obvious */
.modal-header button.close {
    margin: 3px 8px 0;
    font-size: 32px;
    opacity: .4;
    position: relative;
}
.modal-header button.close:hover,
.modal-header button.close:focus {
    opacity: .6;
}

.link-color, .link-color:hover, .link-color:focus, .catalog-item:hover div.cat-item-arrow span {
    color: rgb(0, 153, 51);
}
a:focus{
    color: rgb(0, 153, 51);
    outline: none;
}
a:hover{
    color: rgb(0, 153, 51);
    border-bottom: 0.08em solid rgba(0, 153, 51,0.2);
    text-decoration: none;
}
a.no-underline:hover {
    border-bottom:none !important;
    text-decoration: none !important;
}
a.list-group-item:hover {
    border-bottom:solid 1px #ddd; /* to fix border underline set above */
}

a.popuphelp-js, a.popuphelp-js:hover{
    border-bottom: none;
}

.container-fluid a{
    font-weight: normal;
    color: #777;
}

.panel-heading a:hover, .container-fluid a:hover{
    text-decoration: none;
}

.btn:focus, .btn:active:focus, .btn.active:focus, div[uib-datepicker] {
    outline:none;
}

.btn-default{
    background-color: #f9f9f9;
}

.btn-success{
    background-color: #5cb85c;
}

.btn.btn-xs span.glyphicon, .btn.btn-sm.btn-success span.glyphicon,
.btn.btn-xs span.mdi, .btn.btn-sm.btn-success span.mdi,
.btn.btn-xs span[class*=" sr-icon-"], .btn.btn-sm.btn-success span[class*=" sr-icon-"],
.btn.btn-xs span[class^="sr-icon-"], .btn.btn-sm.btn-success span[class^="sr-icon-"],
.btn.btn-sm.btn-success {
    color: #fff;
    /* this is not ideal - it results in doubling-up margins in both an element, and its child */
    /*margin-right: 0px;
    margin-top: 3px;*/
    font-weight: normal;
}

@media (min-width:992px) {
    .uib-modal-resize .modal-lg {
        width: 900px
    }
}

@media (min-width:1200px) {
    .uib-modal-resize .modal-lg {
        width: 1100px
    }
}

.modal-xl {
    width: 1200px;
}

@media (min-width: 768px) {
    .modal-xl {
        width: 90%;
        max-width:1400px;
    }
}

/* Temporary solution until modal body height calculated on-the-fly */
.modal-lg .modal-body {
/*    height:650px;*/
    overflow:auto;
}

/* to remove the slight indentation on RHS of first tab when active */
.panel.first-active, .panel.first-active>.panel-heading {
    border-top-left-radius:0;
}

/* to stop bootstrap menus inheriting anchors thin bottom borders which cause a flickering on hover */
.dropdown-menu>li>a {
    border:none;
}

/* to stop panel-heading dropdown-menu list items inheriting the colour - for instances where panel-heading colour has set to other than grey */
.panel-heading .dropdown-menu li a,
.panel-heading .dropdown-menu li a:link {
    color: #333;
}

/* last items in menu which have a divider above look un-evenly padded */
.dropdown-menu>li:last-child>a {
    padding-bottom:5px;
}

/* this should really be part of bootstrap - no idea why it isn't
   - prevents hover state of first & last children overriding rounded corners */
.dropdown-menu li:last-child>a {
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}
.dropdown-menu li:first-child>a {
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}

.dropdown-menu {
    padding-top: 0px;
    padding-bottom: 0px;
}

.panel-heading>.dropdown .btn-default.dropdown-toggle {
    color:#333;
}

/* for experimenting with different fonts */
body {
    /*font-family:Arial;*/
    /*font-family:Tahoma;*/
    /*font-family:Verdana;*/
    /*font-family:'Trebuchet MS';*/
    /*font-family:'Lucida Sans Unicode';*/
}
/* for absolutely positioning things on right side of main p panel-heading */
.panel-heading.lms-main-heading {
    position:relative;
}

.panel-heading.lms-main-heading>h3>.mdi {
    font-size:20px;
    line-height:14px;
}
/* bootstrap panels with reduced padding */
.panel-padding-small .panel-heading {
    padding:4px 8px;
}
.panel-padding-small .panel-body {
    padding:8px;
}

/* bootstrap tooltip */
.tooltip-inner {
    max-width: 250px;
}
.tooltip {
    z-index:1090; /* to cater for tooltips in modals, which have z-index:1050 */
}

/* divider in dropdown menu has slightly too much margin top & bottom */
.dropdown-menu .divider {
    margin:5px 0;
}

/* For putting client logo AND brand text in the navbar header */
.navbar-brand {
    padding:5px 15px;
}

.navbar-brand-logo-print{
    display: none;
}

.navbar-brand-logo {
    margin-right:20px;
}

.navbar-brand-text {
    display:inline;
    vertical-align:middle;
}

.navbar-fixed-top {
        border-width: 0 0 0px;
    }

@media (min-width: 768px){
    .navbar>.container-fluid .navbar-brand {
    margin-left: -16px;
    margin-top: -1px;
    }
}

@media (max-width: 780px){
    .navbar-fixed-top {
        border-width: 0 0 1px;
    }
}
/* add a new, wider container width for screens > 1440px wide */
@media (min-width: 1440px){
    .container {
        width: 1400px;
    }
}
/************ custom less-space style classes ************/
.f-w-b {
    font-weight:bold;
}
.t-a-c {
    text-align:center;
}
.t-a-r {
    text-align:right;
}
.v-a-m {
    vertical-align: middle;
}
/************ Bootstrap 5 column layout ************/
.col-xs-5ths,
.col-sm-5ths,
.col-md-5ths,
.col-lg-5ths {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.col-xs-5ths {
    width: 20%;
    float: left;
}

@media (min-width: 768px) {
    .col-sm-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 992px) {
    .col-md-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 1200px) {
    .col-lg-5ths {
        width: 20%;
        float: left;
    }
}
/************ Bootstrap 7 column layout ************/
.col-xs-7ths,
.col-sm-7ths,
.col-md-7ths,
.col-lg-7ths {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.col-xs-7ths {
    width: 14.2%;
    float: left;
}

@media (min-width: 768px) {
    .col-sm-7ths {
        width: 14.2%;
        float: left;
    }
}

@media (min-width: 992px) {
    .col-md-7ths {
        width: 14.2%;
        float: left;
    }
}

@media (min-width: 1200px) {
    .col-lg-7ths {
        width: 14.2%;
        float: left;
    }
}
/************ Material Design Icon - Bootstrap shims ************/
.btn .mdi {
    position: relative;
    font-size: 24px;
    line-height: 12px;
    top: 5px;
}
.btn-xs .mdi {
    font-size: 18px;
    top: 3px;
}
.btn-sm .mdi {
    font-size: 18px;
    top: 2px;
}
.dropdown-menu .mdi {
    width: 18px;
    position: relative;
    top: 3px;
    left: -8px;
    width: 16px;
    font-size: 22px;
}
.nav .mdi {
    position: relative;
    top: 4px;
}
.navbar .navbar-toggle .mdi {
    position: relative;
    top: 4px;
}
.breadcrumb .mdi {
    position: relative;
    top: 4px;
}
.breadcrumb a:hover {
    text-decoration: none;
}
.breadcrumb a:hover span {
    text-decoration: underline;
}
.alert .mdi {
    position: relative;
    margin-right: 2px;
    font-size: 22px;
    line-height: 12px;
}
.input-group-addon .mdi {
    position: relative;
    top: 3px;
}
.navbar-brand .mdi {
    position: relative;
    top: 2px;
    margin-right: 2px;
}
.accord-head-inner .mdi,
.list-group-item .mdi {
    position: relative;
    top: 3px;
    left: -3px; /*this is currently mis-aligning to the left - investigate removing*/
}
.dd-objdoc-list .list-group-item .mdi {
    left:0; /* see above */
}
/* for when sr-icons grouped in dropdown menu items with MDI (defined above) */
.dropdown-menu span[class^="sr-icon-"] {
    position: relative;
    top: 3px;
    left: -9px;
    width: 16px;
    font-size: 20px;
}

.lms-narrow-menu {
    float:right;
    margin:8px 8px 0 0;
}
.lms-narrow-menu .btn {
    color:#888;
    padding:6px;
}
/* BS dropdown scrollable addition - to be used with <ul class="dropdown-menu"> */
ul.scroll-menu {
    max-height: 450px;
    overflow:hidden;
    overflow-y:auto;
}

/* Jasny Bootstrap file input classes */
.close.fileinput-exists {
    vertical-align:middle;
    margin-left:3px;
    color:#000;
    opacity:0.6;
}

.close.fileinput-exists:hover{
  border-bottom: none;
}

/* BS Form class modifications */
.checkbox.inside-form-group {
    padding:0; /* remove .checkbox padding since it's inherited by .form-group */
}

/******************************************************/
/* Bootstrap datetimepicker */
/******************************************************/
/* prevent anchor border bottom style at tope of file */
.bootstrap-datetimepicker-widget a:hover {
    border-bottom:0 !important;
}
/* clock & calendar buttons */
.bootstrap-datetimepicker-widget .picker-switch td span {
    line-height: 40px;
    height: 40px;
}
.bootstrap-datetimepicker-widget .picker-switch td span.mdi:before {
    font-size: 28px;
    top:6px;
}
/* handle moment JS 'Mon' instead of 'MON' format */
.bs-datetimepicker {
    text-transform:uppercase;
}
.bs-datepicker {
    text-transform:uppercase;
}
/* prevent keyboard on mobile device by making readonly - override BS readonly */
.bs-datetimepicker.form-control[readonly] {
    cursor: default;
    background-color: #fff;
    opacity: 1;
}
/* make disabled dates look a bit more disabled (lighter grey) */
.bootstrap-datetimepicker-widget table td.disabled,
.bootstrap-datetimepicker-widget table td.disabled:hover {
    color:#c3c3c3;
}
/******************************************************/
/* Action column icon buttons */
/******************************************************/
.btn-group.action-column-btn-group {
    display: inline-flex; /* modded to cater btn-groups being in 1% table columns */
}
.btn.btn-sm.btn-success {
    color: #fff;
    margin-right: 0px;
    margin-top: 3px;
    font-weight: normal;
}
.action-column-btn-group .btn.btn-sm.btn-success {
    margin-top:0;
}
.action-column-btn-group a.btn-icon-only {
    padding:2px 6px !important;
}
 a.btn-icon-only {
    padding:1px 5px;
}
a.btn-icon-only .glyphicon {
    color:#fff; /* to override .panel-body .glyphicon way below */
    font-size: 15px;
    margin: 6px 3px;
}
a.btn-icon-only .mdi {
    font-size: 17px;
}
/* These are 3-dot dropdown icons - need larger font and less padding to look good */
a.btn-sm.btn-icon-dropdown {
    /*padding: 1px 3px;*/
}
.action-column-items a.btn-icon-only span[class^="sr-icon-"]:before {
    display: inline-block;
    font-size: inherit;
    text-rendering: auto;
    line-height: inherit;
    -webkit-font-smoothing: antialiased;
}
.btn-sm span[class^="sr-icon-"],
.btn-sm span[class*=" sr-icon-"] {
    font-size:20px;
    line-height: 10px;
    position: relative;
    top: 3px;
}
.action-column-items a.btn-icon-only span[class^="sr-icon-"],
.action-column-items a.btn-icon-only .mdi {
    display: inline-block;
    margin: 6px 3px;
    font-size: 20px;
    min-height: 15px; /* modded to match height of remaining glyphicons in adjacent btns */
    line-height: 12px;
}
.action-column-items a.btn-icon-only span[class^="sr-icon-"] {
    line-height: 8px;
}
.action-column-btn-dropdown span[class^="sr-icon-"],
.action-column-btn-dropdown .glyphicon,
.action-column-btn-dropdown .mdi {
    font-size: 20px;
    position: relative;
    top: 3px;
    left: -8px;
}

/******************************************************/
/* A general Class for site scheme colour */
/******************************************************/
.site-scheme-color {
    background-color: rgb(91, 183, 91);
    border-color: #4cae4c;
}
/******************************************************/
/* LMS Data Audit Popover */
/******************************************************/
.popover.data-audit-popover {
    max-width:500px;
}
.data-audit-outer {
    display:none;
}
.data-audit-container {
    display:table;
}
.data-audit-row {
    display:table-row;
}
.data-audit-val,
.data-audit-label {
    display:table-cell;
    padding:2px;
}
.data-audit-label {
    white-space: nowrap;
    font-weight:bold;
    text-align:right;
    padding-right:4px;
}
button.data-audit-launcher {
    margin-bottom: 0;
}
button.data-audit-launcher span[class^="sr-icon-"] {
    font-size: 22px;
    line-height: 6px;
    top: 4px;
    position: relative;
}
/******************************************************/
/* Sweet Alert 2 overrides */
/******************************************************/
.swal2-modal .swal2-spacer {
    background-color: transparent;
}
.swal2-modal .swal2-content {
    text-align:left;
}
.btn.btn-sr-alert-confirm {
    min-width: 100px;
    font-size: 18px;
    margin:0 10px;
}
.swal-err-list li {
    padding:2px 0;
}
@media screen and (max-width:500px) {
    .swal2-icon {
        width:50px;
        height:50px;
        margin: 0 auto 10px;
    }
    .swal2-icon.swal2-warning,
    .swal2-icon.swal2-info,
    .swal2-icon.swal2-question {
        font-size: 38px;
        line-height: 54px;
    }
    .swal2-icon.swal2-error [class^='swal2-x-mark-line'] {
        top: 23px;
        width: 30px;
    }
    .swal2-icon.swal2-error [class^='swal2-x-mark-line'][class$='left'] {
        left: 10px;
    }
    .swal2-icon.swal2-error [class^='swal2-x-mark-line'][class$='right'] {
        left: 10px;
    }
    .swal2-modal .swal2-title {
        font-size: 24px;
    }
    .swal2-modal .swal2-content {
        font-size: 14px;
    }
}
/******************************************************/
/* Banner search elements */
/******************************************************/
.navbar-search {
    width:400px;
    border-color:transparent !important;
}
@media (max-width: 992px){
    .navbar-search {
        padding:0;
        margin:0;
    }
}
@media (max-width: 550px){
    .navbar-search {
        width:310px;
    }
}
@media (max-width: 350px){
    .navbar-search {
        width:210px;
    }
}

.navbar-form.navbar-right.navbar-search {
    margin-right:0;
}
.navbar-search .glyphicon {
    margin-right:0;
}
.search-input-group {
    z-index:1070;
}
.search-inactive .search-input-group .btn-default,
.search-inactive .search-input-group .form-control {
    border-color:#eee;
    color:#eee;
}
.search-inactive .search-input-group .mdi,
.search-inactive .search-input-group .glyphicon {
    color:#999;
}
.search-active .search-input-group .btn-default,
.search-active .search-input-group .form-control {
    border-color:#ccc;
}
.search-active .search-input-group .mdi,
.search-active .search-input-group .glyphicon {
    color:#333;
}
.search-input-group .mdi {
    font-size:22px;
    line-height:12px;
}
.search-active .search-input-group .form-control,
.search-inactive .search-input-group .form-control {
    box-shadow:none;
}

body.modal-open,
body.modal-open nav.navbar {
    padding-right:17px; /* scrollbar width - may need to piff this off into browser specific classes */
}

.dropdown-menu a.with-icon-right {
  position: relative;
  padding-right: 40px;
}
.dropdown-menu a.with-icon-right .glyphicon {
    position:absolute;
    top: 8px;
    right: 10px;
    font-size: 12px;
    color:#555;
}
.glyphicon-remove-orig:before {
    content:"\e014";
}
.lms-narrow-menu #search_control {
    display:inline-block;
    float:left;
}
.lms-narrow-menu .form-control {
    height:35px;
}
.lms-narrow-menu .btn {
    height:35px;
}
.lms-narrow-menu .prevsearch-btn {
    border-top-right-radius:0px;
    border-bottom-right-radius:0px;
    border-right:none;
}
.lms-narrow-menu .search-inactive .search-input-group .btn-default,
.lms-narrow-menu .search-inactive .search-input-group .form-control,
.lms-narrow-menu .search-active .search-input-group .btn-default,
.lms-narrow-menu .search-active .search-input-group .form-control {
    border-color: #ccc;
    color: #888;
}

/******************************************************/
/* timezone display (configured by advsite) */
/******************************************************/
#timezone {
    position: absolute;
    color: #999;
    padding: 4px 17px;
}
/******************************************************/
/* Multi-role Context and Foxus selectors */
/******************************************************/
.panel-heading form[name='focusFilter'],
.focus-selector {
    display:inline;
}

.focus-pre,
.focus-user,
.focus-org {
    display:inline-block;
}
.focus-pre {
    margin-right: 4px;
}
.context-selector {
    margin:0 0 8px;
    font-size:20px;
}

.lms-bs-dropdown {
    display: inline-block;
}
.context-selector .lms-bs-dropdown .btn {
    padding:0 0 3px 6px;
    font-size: 20px;
    vertical-align: initial;
}
.focus-selector .lms-bs-dropdown .btn {
    padding:0 2px 2px;
    white-space:normal;
    text-align:left;
}

.focus-selector .glyphicon,
.context-selector .glyphicon {
    margin-left:6px;
}

.bs_dropdown.glyphicon{
    color: #777;
    top: 4px;
}

/******************************************************/
/* for GEM::HTML::PrintButton() disabled option tooltip; */
/******************************************************/
.disabled-btn-outer {
    display:inline-block;
}

.disabled-btn-outer input.btn.btn-default {
    /*margin-top: 3px;
    this margin existed to cater for a global .btnContainer>input style with
    same margin, which was removed (can't find when), so this is no longer
    needed, but it created heaps of isses originally so leaving this comment
    to direct anyone to the possible reason of button misalignment */
}

/******************************************************/
/* Glyphicon overrides/settings */
/******************************************************/
a.icon-with-tt, a.icon-with-tt:hover {
    border-bottom: none;
    cursor: pointer;
    opacity: 0.8;
    display: inline-block;
}
a.icon-with-tt .glyphicon {
    color: #777;
    font-size: 20px;
}
.action-icons a.icon-with-tt {
    line-height: initial;
}

.panel-heading a, .panel-heading span.glyphicon, .panel-heading h4 div {
    color: #777;
}

a.assesquestion-viewimg,
span.glyphicon.glyphicon-picture.view-assessquestion-tooltip:hover,
a.assesquestion-view-refrence:hover,
span.glyphicon.glyphicon-resize-small.view-assessquestion-tooltip:hover,
a.asses-question-showhideimg:hover,
span.glyphicon.glyphicon-resize-full.view-assessquestion-tooltip:hover {
    border-bottom: none;
    cursor: pointer;
}

span.glyphicon.glyphicon-picture.view-assessquestion-tooltip,
span.glyphicon.glyphicon-link.view-assessquestion-tooltip,
span.glyphicon.glyphicon-arrow-left.view-assessquestion-tooltip,
span.glyphicon.glyphicon-eye-open.view-assessquestion-tooltip,
span.glyphicon.glyphicon-file.view-assessquestion-tooltip {
    color: #777;
    font-size: 20px;
    top:8px;
    margin-right:0;
}

span.glyphicon.glyphicon-resize-small.view-assessquestion-tooltip,
span.glyphicon.glyphicon-resize-full.view-assessquestion-tooltip {
    color: #777;
    font-size: 20px;
    top:8px;
    margin-right:0;
}

img.assess-question-img, img.assess-qn-group-img, .assess-qn-printable-img {
    max-width: 50%;
    width: 100%;
    height: auto;
}

img.assess-question-img{
    margin: 10px 0 10px 100px;
    display: block;
}

.assess-footer-btn-left{
    margin: 2px 2px;
}

.assess-footer-btn-right{
    margin: 2px 1px 0px 3px;
}

.assess-qn-printable {
    padding: 15px;
}
.assess-qn-printable-pretext {
    margin-bottom:8px;
}
.assess-qn-printable-textans {
    margin-top: 15px;
}
.assess-qn-printable-img{
    padding: 8px;
}

.assess-footer-nav {
    border-top: 1px solid #e7e7e7;
}

/* Custom iconography */
.glyphicon-remove, .glyphicon-group, .glyphicon-journal-entry, .glyphicon-documents, .glyphicon-docupload, .glyphicon-brochure,
.glyphicon-tasks, .glyphicon-user, .glyphicon-list, .glyphicon-faq, .glyphicon-feedback, .glyphicon-tuthelp,
.glyphicon-facetime-video, .glyphicon-docs, .glyphicon-download, .glyphicon-currency, .glyphicon-addoutcome,
.glyphicon-skillassess-performplan, .glyphicon-devplan, .glyphicon-info, .glyphicon-PM, .glyphicon-expired-items, .glyphicon-attachment, .glyphicon-view-individual-devplan {
    background-repeat:no-repeat;
    width:25px;
    height:25px;
    background-position:50% 50%;
    border:2px solid #333;
    padding:15px;
    border-radius:25px;
}

.glyphicon-remove:hover, .glyphicon-journal-entry:hover, .glyphicon-documents:hover, .glyphicon-docupload:hover, .glyphicon-brochure:hover, 
.glyphicon-tasks:hover, .glyphicon-user:hover, .glyphicon-list:hover,.glyphicon-feedback:hover, .glyphicon-tuthelp:hover,
.glyphicon-facetime-video:hover, .glyphicon-docs:hover, .glyphicon-download:hover, .glyphicon-currency:hover, .glyphicon-addoutcome:hover,
.glyphicon-skillassess-performplan:hover, .glyphicon-devplan:hover, .glyphicon-info:hover, .glyphicon-PM:hover, .glyphicon-attachment:hover, .glyphicon-view-individual-devplan:hover {
    border:solid 2px #999;
    background-color:#eee;
}

/* To turn off the traditional glyphicon halflings font based iconography */
.glyphicon-remove:before, .glyphicon-journal-entry:before, .glyphicon-documents:before, .glyphicon-docupload:before, .glyphicon-brochure:before, 
.glyphicon-tasks:before, .glyphicon-user:before, .glyphicon-list:before, .glyphicon-feedback:before, .glyphicon-tuthelp:before,
.glyphicon-facetime-video:before, .glyphicon-docs:before, .glyphicon-download:before, .glyphicon-currency:before, .glyphicon-addoutcome:before,
.glyphicon-skillassess-performplan:before, .glyphicon-devplan:before, .glyphicon-info:before, .glyphicon-PM:before, .glyphicon-attachment:before, .glyphicon-view-individual-devplan:before {
    content:none;
}

.glyphicon-remove {
    background-image:url(../images/icons/ico_cancel_sm.png);
}
.glyphicon-group {
    background-image:url(../images/icons/ico_alumni_sm.png);
}
.glyphicon-feedback {
    background-image:url(../images/icons/ico_feedback_sm.png);
    background-position:50% 45%; /* needs to be popped up a little */
}
.glyphicon-download {
    background-image:url(../images/icons/ico_doc_download_sm.png);
}
.glyphicon-journal-entry {
    background-image:url(../images/icons/ico_journal_entry_sm.png);
}
.glyphicon-brochure {
    background-image:url(../images/icons/ico_brochure_sm.png);
}
.glyphicon-tasks {
    background-image:url(../images/icons/ico_personal_task_sm.png);
}
.glyphicon-tuthelp {
    background-image:url(../images/icons/ico_tut_help_sm.png);
}
.glyphicon-user {
    background-image:url(../images/icons/ico_profile_sm.png);
}
.glyphicon-list {
    background-image:url(../images/icons/ico_shortlist_sm.png);
}
.glyphicon-faq {
    background-image:url(../images/icons/ico_faq_sm.png);
}
.glyphicon-facetime-video {
    background-image:url(../images/icons/ico_video_sm.png);
}
.glyphicon-currency {
    background-image:url(../images/icons/ico_currency_sm.png);
}
.glyphicon-addoutcome {
    background-image:url(../images/icons/ico_addoutcome_sm.png);
}
.glyphicon-skillassess-performplan {
    background-image:url(../images/icons/ico_skillassess_performplan_sm.png);
}
.glyphicon-devplan {
    background-image:url(../images/icons/ico_devplan_sm.png);
}
.glyphicon-info {
    background-image:url(../images/icons/ico_info_sm.png);
}
.glyphicon-attachment {
    background-image:url(../images/icons/ico_attach_sm.png);
}
.glyphicon-view-individual-devplan {
    background-image:url(../images/icons/ico_profile_sm.png);
}
.glyphicon-docupload {
    background-image: url(../images/icons/ico_doc_upload_sm.png);
}

.glyphicon-expired-items {
    border-color:#828282;
    width:19px;
    height:19px;
    padding:13px;
    background-position: 3px 3px;
    background-image:url(../images/icons/ico_expired_sm.png);
}
.glyphicon-expired-items:hover,
.glyphicon-expired-items.active {
    border-color:#000;
    background-image:url(../images/icons/ico_expired_active_sm.png);
}

/* glyphicons determined by task type. NOTE: no height set here*/
.glyphicon-AC {
    background-image:url(../images/icons/ico_adhoc_sm.png);
}
.glyphicon-ON {
    background-image:url(../images/icons/ico_online_sm.png);
}
.glyphicon-AR {
    background-image:url(../images/icons/ico_article_sm.png);
}
.glyphicon-BL {
    background-image:url(../images/icons/ico_blended_sm.png);
}
.glyphicon-CU {
    background-image:url(../images/icons/ico_curr_sm.png);
}
.glyphicon-PM {
    background-image:url(../images/icons/ico_pm_sm.png);
}
.glyphicon-CL, .glyphicon-IR {
    background-image:url(../images/icons/ico_inst_led_class_sm.png);
}
.glyphicon-EA {
    background-image:url(../images/icons/ico_eduassist_sm.png);
}
.glyphicon-WP {
    background-image:url(../images/icons/ico_wkplace_assess_sm.png);
}
.glyphicon-PT {
    background-image:url(../images/icons/ico_personal_task_sm.png);
}
.glyphicon-QNTU {
    background-image:url(../images/icons/ico_tut_help_sm.png);
}
.glyphicon-QNLR {
    background-image:url(../images/icons/ico_tut_help_ans_sm.png);
}
.glyphicon-DALR {
    background-image:url(../images/icons/ico_daily_assess_sm.png);
}
/* cheating a bit here - these should use _sm postfix icons, but none have been
   created. Since we're moving to vectors soon, we'll just use the large ones
   scaled down as 'placeholders' until the vector icons are put in place */
.glyphicon-RD {
    background-image:url(../images/icons/ico_resdoc.png);
}
.glyphicon-ACTM {
    background-image:url(../images/icons/ico_lr_adhoc.png);
}

/* helper: add to glyphicon to position it to the right of a title in a TH tag ... may
   need tweaking if used more, especially if we change TH to use <thead> since bootstrap
   vertically aligns TH text in <thead> to bottom, not top */
.sricon-right-of-th span {
    margin-left: 7px;
    vertical-align: middle;
}

.glyphicon.vert-mid {
    vertical-align:middle
}

/* TODO: need to combine these classes once we change PDP icons in the old interface*/
.glyphicon-docs, .glyphicon-documents {
    background-image:url(../images/icons/ico_docs_sm.png);
}

span.plus-sign {
    font-size: 15px;
    display: inline-block;
    vertical-align: top;
    margin-top: -10px;
}

.glyphicon-userprofile:before {
    content: "\e008";
}
/* from bootstrap 3.3.5 - switching to this CSS file has repurcussions, so adding this here */
.glyphicon-menu-hamburger:before {
    content: "\e236";
}
.glyphicon-option-vertical:before {
    content: "\e235";
}

.glyphicon-copy:before {
    content:"\e205";
}
.glyphicon-blackboard:before {
    content:"\e218";
}
.glyphicon-hourglass:before {
    content:"\231b";
}
.glyphicon-duplicate:before {
    content: "\e224";
}
.glyphicon-signal:before {
    content: "\e018";
}
.glyphicon-modal-window:before {
  content: "\e237";
}
/* Small override for above - this can possibly be removed once all the above background image
   glyphicon overrides are replaced with sr-icon font vectors, but in the meantime, to get a regular
   bootstrap remove icon into a form-control input field */
.glyphicon-text-remove:before {
    content: "\e014";
}
.glyphicon.form-control-field-action {
    font-size:12px;
    cursor:pointer;
}
.form-control ~.form-control-field-action { /* slight hack from bootstrap 3.3.5 .form-control-feedback */
    top: 1px;
}
.form-control.has-action {
    padding-right:30px;
}
.form-control.has-action::-ms-clear {
    display: none;
    width : 0;
    height: 0;
}
.form-control.has-action::-ms-reveal {
    display: none;
    width : 0;
    height: 0;
}

.form-control-field-action { /* from bootstrap 3.3.5 .form-control-feedback */
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    display: block;
    width: 34px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    /* missing: pointer-events: none; since we want it clickable */
}

.inline-display-div {
    vertical-align: middle;
    display: inline-block;
    margin-right: 10px;
}

/******************************************************/
/* Bootstrap button group that contains our disabled
   outer for holding tootlips */
/******************************************************/
.btn-group>.disabled-btn-outer:not(:first-child):not(:last-child)>.btn:not(.dropdown-toggle) {
    border-radius: 0;
}
.btn-group>.disabled-btn-outer:first-child:not(:last-child)>.btn:not(.dropdown-toggle) {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
}
.btn-group>.disabled-btn-outer:last-child:not(:first-child)>.btn:not(.dropdown-toggle) {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
}
.btn-group .disabled-btn-outer+.btn,
.btn-group .btn+.disabled-btn-outer {
    margin-left: -1px;
}
.btn-group>.btn, .btn-group-vertical>.btn {
    position: relative;
    float: left;
}
/******************************************************/
/* Object Document List Group */
/******************************************************/
.objdoc-list {
    display:inline-block;
}
.objdoc-list .btn-group {
    position: absolute;
    right: 5px;
    top: 3px;
}
.objdoc-list li.list-group-item {
    padding-right: 105px;
}
.objdoc-list li.list-group-item span.mdi:before{
    left:0;
}
#list_group_item_clone {
    display:none;
}

/******************************************************/
/* Objcomm entry */
/******************************************************/
.modal-body.objcom-entry {
    height:300px; /* modal body */
}

/************************************************************************ */
/* Drag & Drop File Upload */
/************************************************************************ */
.dd-box * {
    /*font-size:13px;*/
}
.dd-box .mdi {
    font-size: 22px;
    line-height: 14px;
    position: relative;
    top: 3px;
    margin-right: 5px;
}
.box-invalid-files,
.box-blank-instr,
.box__dragndrop,
.box__uploading,
.box__success,
.box__button,
.box__error {
    display: none;
}
.box__file {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}
.has-advanced-upload .box__input{
    outline: 1px dashed #999;
    padding: 10px;
}
.has-advanced-upload .box__dragndrop {
    display: inline;
}
.dd-choose-file {
    font-weight:bold;
    cursor:pointer;
}
.dd-choose-file:hover {
    text-decoration:underline;
}
.is-dragover {
    cursor:pointer;
}
.spinner-container.dd-upload-spinner {
    display: inline-block;
    margin: 0;
    width: 20px;
    height: 20px;
    margin-right: 10px;
    vertical-align: bottom;
}
.box-invalid-files {
    padding: 8px;
    border-radius: 4px;
    margin-top: 8px;
    color: #a94442;
    background-color: #f2dede;
    border: solid 1px #d5aeb4;
}
.dd-invalid-list {
    margin-right:40px;
}
.dd-invalid-list:not(:last-child) {
    margin-bottom:5px;
}
.dd-invalid-list-close {
    float:right;
    cursor:pointer;
    position: relative;
    top: -4px;
}
/* diff from Admin UI */
.dd-box label {
    font-weight:normal;
    margin:0;
}

/******************************************************/
/* 'Groups' */
/******************************************************/
.group {
    border:solid 1px #ddd;
    border-radius:4px;
    clear:both;
    margin-bottom:10px;
}
.group-title {
    background-color:#ddd;
    color:#444;
    font-weight:bold;
    font-size:14px;
    padding:3px 6px;
    border-top-left-radius:3px;
    border-top-right-radius:3px;
}
.group-body {
    padding:8px;
}
.group.info-box-replace {
    width: 560px;
    margin: 30px auto;
}
.group-title img,
.group-title video {
    max-width: 100%;
    height: auto;
}

/******************************************************/
/* 'Near-click' popup functionality */
/******************************************************/
.div-near-click {
    padding:1px;
    height:22px;
}
.near-click-popup {
    display:none;
    position:absolute;
    border:solid 1px #ccc;
    background-color:#eee;
    padding:8px;
    z-index: 10;
}

.div-near-click .glyphicon {
    margin:0 1px 0 0 !important;
    font-size: 15px;
}

/******************************************************/
/* VET styles */
/******************************************************/
.vet-read-controls.near-click-popup {
    background-color: #fafafa;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
}
.vet-read-controls label {
    display:block;
    cursor:pointer;
    margin-bottom: 6px;
}
.vet-read-controls input[type='checkbox'] {
    margin: 2px 4px 0 0;
    vertical-align: top;
}
.div-near-click {
    border: 1px solid transparent;
    border-radius: 4px;
    background-color: #fff;
    border-color: #ccc;
    height: 34px;
    vertical-align: middle;
    outline: none;
}
button.div-near-click .glyphicon.glyphicon-menu-hamburger {
    padding: 7px;
}

/******************************************************/
/* To hide elements in new interface */
/******************************************************/
.elem-legacy-only {
    display:none;
}

/******************************************************/
/* GEM Nice Error markup */
/******************************************************/
.nice-err-container {
    width: auto;
    clear: both;
    display: table;
    margin: 0px auto;
    max-width: 90%;
    padding: 0px;
}
.nice-err-btn-container {
    text-align:center;
}

.info_box_footer{
    padding: 15px;
    border-top: solid 1px #eee;
}

.nice-err-container .info_box {
    background-color: #ffffff;
    border: 1px solid #999;
    border: 1px solid rgba(0, 0, 0, 0.3);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
    box-shadow: 0 1px 1px rgba(0,0,0,.05);
    border-color: #ddd;
}
.nice-err-container .info_box_inner {
    padding:0 10px;
    display: inline-table;
    width: 100%;
}
.nice-err-container .info_box_inner.top-pad-10 {
    padding-top:10px;
}
.nice-err-container .info_box>h2 {
    padding: 8px 10px 9px;
    margin: 0;
    -webkit-border-radius:5px 5px 0 0;
    -moz-border-radius:5px 5px 0 0;
    border-radius:5px 5px 0 0;
    -webkit-box-shadow: inset 0 1px 0 #ffffff;
    -moz-box-shadow: inset 0 1px 0 #ffffff;
    box-shadow: inset 0 1px 0 #ffffff;
    border-bottom: 1px solid #999;
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    font-size:14px;
    color: #909090;
    background-color: #f5f5f5;
    border-color: #ddd;
}

/******************************************************/
/* MY Profile Section Classes */
/******************************************************/
.dev-activityguide-link {
    float: right;
}

.dev-activityguide-link a:hover{
    border-bottom: 0em;
}

.captionText{
    color: #909090;
}

.label-title{
    font-weight: bold;
    float: right;
    text-align: right;
}

@media (max-width: 768px) {
    input.data.my-profile-checkbox {
        float: left !important;
        margin-left: -4px;
    }

    .label-title{
        float: left;
        text-align: left;
    }

    span.form-view-value {
        margin-top: -10px;
    }
}

input.data.my-profile-checkbox {
    float: right;
}

.my-profile-checkbox{
    float: left;
}

/* not cool - if this is just for the profile page checkbox, it should be more specifically targeted */
input[type=checkbox] {
    margin-right: 5px;
    width: 20px;
    /*margin-left: 10px;*/
}

.form-horizontal .checkbox.chb-file-remove {
    min-height:initial;
    padding-top:3px;
}
.col-sm-10.td-right-detail input[type="checkbox"]{
    margin-left:  -2px;
}
/* GEM::Generator RADIOLIST uses radio-inline. When used in a form it ends up
   with 2 layers of top padding. Remove the inner padding here. */
.col-sm-10.td-right-detail .radio-inline {
    padding-top: 0;
}
/* checkboxes drawn in our form-group setup need top margin */
input.fg-checkbox {
    margin-top:10px;
}

.profile-pic-modify-container {
    display: flex;
}
.profile-pic{
    max-width: 250px;
    /*max-height: 100%;*/ /* We are forcing square profile pic & thumbnails now */
    margin-top: 7px;
    margin-bottom: 7px;
    border-radius: 6px;
    /*height: 150px;*/
}
.lr-barcode-img {
    max-width: 250px; /* should match max width of profile pic above */
}
.profile-pic-title, .bold-text {
    font-weight: bold;
}
img.profile-icon-small.profile-pic-thumbnail-view, .thumbnail-pic-title {
    font-weight: bold;
}
.profile-pic-thumbnail-view{
    margin-top: 9px;
}
.profile-pic-classlist-view{
    width: 70px;
    /*height: 76px;*/ /* We are forcing square profile pic & thumbnails now */
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: 6px;
}
.profile-pic-classlist-view .profile-pic {
    margin: 0px;
    width:100%; /* 100% of width set in .profile-pic-classlist-view */
}
.thumbnail-profilepic-lrname, .classlist-profilepic-lrname{
    color: #777;
    display: inline;
    font-size: 14px;
    margin-left: 5px;
    position: absolute;
}
.thumbnail-profilepic-lrname{
    margin-top: 15px;
}
.classlist-profilepic-lrname{
    margin-top: 37px;
}
.classlist-pic-title{
    font-weight: bold;
    margin-top: 40px;
    margin-bottom: 10px;
}
.profile-pic-classroll-container{
    width: 70px;
    height: 100%;
}
.profile-pic-classroll-container .profile-pic{
    max-width: inherit;
    width: 70px;
    height: 76px;
}

.profile-list-group .list-group-item {
    padding:8px 10px;
}
span.profile-list-group-icon { /* used in conjunction with icon-XX classes for SR iconography */
    font-size:43px;
    margin-right: 10px;
    vertical-align: middle;
}
div.profile-list-group-icon {
    align-items: top;
}
div.profile-list-group-icon span {
    font-size:43px;
    margin-right: 8px;
}
.profile-curr-sch-list div.profile-list-group-icon span {
    font-size:34px;
    margin: 0 4px;
}
.profile-list-group-detail {
    flex: 1;
}
.profile-list-group-name {
    display: inline-block;
}
.profile-list-group-date {
    display: inline-block;
    float: right;
}
.profile-curr-sch-list,
.profile-ap-da-list {
    border:solid 1px #ddd;
    border-radius:4px;

}
.profile-curr-detail {
    padding-bottom: 8px;
}
.profile-sch-name,
.profile-curr-name {
    font-weight: bold;
}
.profile-curr-sch-list-header,
.profile-ap-da-list-header {
    background-color:#ddd;
    font-weight: bold;
    padding:2px 6px;
}
.profile-ap-dates {
    font-weight: bold;
    padding: 2px 0 4px;
}
.panel-body.profile-list-body,
.panel-body.profile-table-body {
    padding: 0;
}
.profile-list-table>tbody>tr>th {
    border-top: 0;
}
.profile-curr-sch-list-body .profile-sch-list-item {
    
}
.profile-list-body-item {
    padding: 4px 8px 8px;
}
.panel-body.profile-list-body .profile-list-body-item:not(:last-child),
.profile-curr-sch-list-body .profile-sch-list-item:not(:last-child) {
    border-bottom: solid 1px #ddd;
}
.profile-curr-sch-list-body .profile-sch-list-item .profile-sch-list-item-details {
    padding: 2px 4px 0;
}
@media (max-width: 992px) {
    .profile-list-group-name {
        width: 100%;
    }
    .profile-list-group-date {
        float: left;
    }
    .classlist-pic-title{
        margin-top: 10px;
    }
}

@media (min-width: 680px) {
    .profile-pic-modify-container{
        height: 245px;
        width: 370px;
    }

    .profile-pic-classroll-container .profile-pic {
        min-height: inherit;
    }
}
.badges {
    margin-top:8px;
}
.badges img {
    width:60px;
    margin-right:10px;
    cursor:pointer;
}

.certificates .col-sm-4 {
    text-align: center;
}

.image-container img {
    max-width: 100%; /* This rule is very important, please do not ignore this! */
}

.profile-modal .image-container {
    width:auto;
    margin:0 auto;
}
#img_upload {
    font-size:0;
}

.d-flex{
    display: flex;
    align-items: center;
}

.flex-stretch {
    align-items: stretch;
}
@media (min-width: 768px) {
    .profile-modal .image-container {
        width:480px;
    }
}
@media (min-width: 992px) {
    .profile-modal .image-container {
        width:700px;
    }
}

/******************************************************/
/* Alert/Note/Etc */
/******************************************************/
select[size]{
    border-radius: 4px;
    border: 1px solid #ddd;
    width: auto;
}

.ppagroup-select-gap {
    margin-top: -13px;
}

.alert {
    width: auto;
    clear: both;
    display: table;
    margin: 10px auto;
    max-width: 90%;
    padding: 0px;
}

.alert-icon {
    display: table-cell;
    vertical-align: middle;
    border-right: 1px solid;
    font-size: 19px;
    padding: 8px 7px 5px 10px;
}
.alert-icon .mdi:before {
    top:0; /* eventually 'undo' the bootstrap mdi shims up top of file */
}
.alert-message {
    padding: 10px;
    display: table-cell;
    vertical-align: middle;
    position: relative;
}
.allow-close .alert-message {
    padding-right:30px;
}

.alert .alert-message p {
    margin:0 0 10px;
}
.alert .alert-message p:last-child {
    margin-bottom:0; /* assumes no other elements after last <p> */
}

.note-close {
    position:absolute;
    top:7px;
    right:0;
    cursor:pointer;
}
table td .alert{
    display: inline-block;
    max-width: 100%;
    margin: 10px 0px;
}

/* -------------------------------------------------------------------- */
/* Flash Message construct (used by validation.js:ShowFlashMsg) */
/* -------------------------------------------------------------------- */
/* LMS-7399 change BG to be absolute to allow clickthrough */
.flashmsg-bg {
    position: fixed;
    top: 5px;
    max-width: 600px;
    left: 50%;
    text-align: center;
    z-index: 10090;
}
.lms-note, .flashmsg-autosave, .flashmsg-info {
    background-color: #dff0d8;
    border-color: #d6e9c6;
    color: #3c763d;
}
.flashmsg-autosave, .flashmsg-info { /* designed to be contained inside .flashmsg-bg */
    border-radius: 4px;
    text-align: center;
    padding: 10px;
    border-style: solid;
    border-width: 0 1px 1px 1px;
}
.modal-header .flashmsg-autosave,
.modal-header .flashmsg-info {
    padding: 4px 6px;
}
.flashmsg-bg.sticky .flashmsg-autosave,
.flashmsg-bg.sticky .flashmsg-info {
    padding-right: 45px;
}
.flashmsg-info.flashmsg-modal,
.flashmsg-autosave.flashmsg-modal {
    width:auto;
    font-size:12px;
    border-width:1px;
    margin:0;
}
.flashmsg-modal-container {
    float: right;
    margin: 4px 10px;
}
.modal-header .flashmsg-modal-container {
    margin: 6px 10px 0;
}
.flashmsg-bg.sticky .flash-close-btn {
    position: absolute;
    right: 0;
    padding: 3px 8px 2px;
    border-bottom-left-radius: 4px;
    border-top-right-radius: 4px;
    cursor: pointer;
}
.flashmsg-bg.sticky span.mdi {
    font-size: 24px;
    line-height: 35px;
}

@media (max-width: 580px) {
    .flashmsg-bg {
        width: 100% !important;
        left: auto !important;
        margin-left: auto !important;
    }
}

/* ---------------------------------------------- */
/* New Flash Message styles (for using Notify JS) */
/* ---------------------------------------------- */
.notifyjs-sr-base,
.notifyjs-sr-sticky-base {
    background-color: #cecece;
    border-color: #b0b0b0;
    color: #333;
    line-height: 20px;
    border-radius: 4px;
    text-align: center;
    padding: 10px;
    border-style: solid;
    border-width: 1px;
}
.sr-notify-text {
    font-size:14px;
}
.notifyjs-sr-sticky-base {
    padding-right: 45px;
}
.notifyjs-sr-sticky-base .sr-notify-close-btn {
    position: absolute;
    right: 0;
    top: 0;
    padding: 3px 8px 2px;
    border-bottom-left-radius: 4px;
    border-top-right-radius: 4px;
    cursor: pointer;
}
.notifyjs-sr-sticky-base .sr-notify-close-btn span.mdi {
    font-size: 24px;
    line-height: 35px;
}

/* Notify JS top center bug */
.notifyjs-corner {
    left: 50% !important;
    transform: translateX(-50%);
}
/* Notify JS positioning in modal header bug */
.modal-header .notifyjs-container {
    top: -1px !important;
}

/* -------------------------------------------------------------------- */
/* LMS Notes */
/* -------------------------------------------------------------------- */
.lms-note span.glyphicon{
    color: #3c763d;
}
.lms-note .alert-icon {
    border-color: #d6e9c6;
}
.lms-note.no-data-msg.hidden {
    display: none;
}

.alert-warning .alert-icon {
    border-color: #faebcc;

}
.alert-warning .alert-icon .glyphicon, .alert-warning .alert-message a {
    color: #8a6d3b;
}
.alert-warning .alert-message a:hover {
    color: #785f33;
    border-bottom-color: #785f33;
}

.alert-danger .alert-icon {
    border-color: #ebccd1;
}
.alert-danger .alert-icon .glyphicon, .alert-danger .alert-message a {
    color: #a94442;
}
.alert-danger .alert-message a:hover{
    color: #973d3b;
    border-bottom-color: #973d3b;
}

.btn-group-rfloat{
    float: right;
}
.btn-group-lfloat{
    float: left;
}

.attach-label-setting{
    float: left;
    font-weight: bold;
    margin-top: 14px;
    margin-bottom: 17px;
}

.attach-btn-setting{
    margin-top: 10px;
}

@media (max-width: 560px) {
    .linejustify-tdright{
       white-space: normal;
       padding-right: 12px;
    }
}

.profiledetail-btncontainer{
    float: right;
    margin-bottom: 0px;
}

/******************************************************/
/* Public Profile Section Classes */
/******************************************************/
/* profile photo section layout */
.profile-top-container {
    display: flex;
}
.profile-top-pic-col {
    flex: 0 0 200px;
}
.profile-top-data-col {
    flex: 1;
}
@media screen and (max-width: 768px){
    .profile-top-container,
    .profile-top-pic-col,
    .profile-top-data-col {
        display: block;
    }
}
#login_confirm_container div.info_box.login_box .info_box_header, #login_container div.info_box.login_box .info_box_header{
    display: inherit !important;
}

.lr_profile_photo{
    float: left;
    display: inline;
}

div#lr_profile_photo {
    min-width: 100px;
    margin-bottom: 20px;
    max-width: 270px;
}

.profile-basic-info>h4, .lr-profile.lr-titles>h4{
    font-size: 13px;
}

@media (min-width: 680px) {
    .profile-basic-info{
        margin-top: -120px;
        margin-left: 290px;
    }

    .lr-profile.lr-titles{
        margin-top: 60px !important;
    }

    .lr-profile, .lr-titles{
        max-width: 540px;
    }
}

.lr-profile.lr-titles, .lr-profile{
    margin-top: 45px;
    margin-left: 290px;
}

.lr-profile{
    margin-top: 10px;
}

@media (max-width: 780px) {
    .lr-profile.lr-titles, .lr-profile{
        margin-left: 0px;
        margin-top: 0px;
    }
}

.lr-titles{
    margin-bottom: 20px;
}

.lr-profile .tab-pane .panel-body{
    max-height: 300px;
}

/******************************************************/
/* Table Settings */
/******************************************************/
.tableListSubHeader{
    color: #909090;
    font-size: 14px;
    font-family: inherit;
    font-weight: 500;
    line-height: 1.1;
    margin: 8px 0;
}

.formHeader{
    color: #909090;
    font-size: 14px;
    font-family: inherit;
    font-weight: 500;
    line-height: 1.1;
    margin-bottom: 15px;
    font-weight: bold
}

th.dataLabel{
    /*color: rgb(0, 153, 51);*/
    color: #909090;
}

table.table.table-bordered.lr-performreview-table{
    margin-bottom: 5px;
}

table.lr-performreview-table tr td:first-child{
    width: 25%;
}

table.basicTable.lr-performreviewsa-table {
    /*margin-top: 10px;*/
    margin-bottom: 10px;
}

table.basicTable.lr-performreviewsa-table tr td:first-child, table.basicTable.lr-performreviewsa-table tr td:last-child{
    padding: 6px;
}

.panel-body span.glyphicon.customreview-addrow-glyphicon, .panel-body span.glyphicon.customreview-deleterows-glyphicon {
    font-size: 17px;
    color: #777;
}

a.customreview-addrow:hover, a.customreview-deleterows:hover {
    border-bottom: none;
}

.custom-review-heading {
    font-weight:bold;
    font-style:italic;
    font-size:17px;
    color:#909090;
    margin:10px 0;
}

table.basicTable.table.kra-table>tbody>tr>td{
    width: auto;
}

td.data.currcode-link-withwidth{
    min-width: 220px;
}

.table>tbody>tr.no-hover:hover>td{
    background-color:initial;
}

.table>tbody>tr.no-hover>td{
    border-right-color: #fff;
    border-left-color: #fff;
}

/* Outcome List tables */
/* global search develop merge conflicts */
/*.outcome-list {
    border-collapse:collapse;
    width:100%;
}
.outcome-list tr td {
    padding: 4px 0;
}
.outcome-list tr td:last-child {
    border-left:0;
}
.outcome-list tr td:nth-last-child(2) {
    border-right:0;
}
.outcome-list tr.hover td {
    background-color:#eee;
}
td.outcome-list-action {
    vertical-align:middle !important;
    text-align:right;
    width:1%;
}
td.outcome-list-action a:hover {
    border:0;
}
.outcome-list-action .glyphicon {
    font-size:16px;
}*/

#out_comment_tip_container {
    font-style:italic;
    color:#666;
}
tr.disabled-row td {
    color:#aaa;
}
.btn-change-outcome {
    float: right;
    position: relative;
    top: -15px;
}
/******************************************************/
/* Table Hover Action Buttons */
/******************************************************/
.table{
    margin-bottom: 0px;
}

/******************************************************/
/* Horizontal table scrolling and fade */
/******************************************************/
.table-container-outer {
    position: relative;
    clear: both;
}

.table-container {
    width: 100%;
    overflow-y: auto;
    _overflow: auto;
    margin: 0 0 1em;
}

.table-container::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 14px;
    height: 14px;
}

.table-container::-webkit-scrollbar-thumb {
    border-radius: 8px;
    border: 3px solid #fff;
    background-color: rgba(0, 0, 0, .3);
}

.table-container-fade {
    display:none;
    position: absolute;
    right: 0;
    margin-right: -1px;
    width: 50px;
    height: 100%;
    background: -moz-linear-gradient(left, rgba(245,245,245,0) 0%, rgba(245,245,245,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(245,245,245,0) 0%,rgba(245,245,245,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(245,245,245,0) 0%,rgba(245,245,245,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#f5f5f5',GradientType=1 ); /* IE6-9 */
    pointer-events: none;
}


/******************************************************/
/* Log Items */
/******************************************************/
.lms-log-item a.btn-default {
    color:#333;
}

.lms-log-item a.btn-default .mdi {
    top:2px; /* shims above have top:4px on .btn-sm .mdi - can't see how that works given I need to override it here */
}

/******************************************************/
/* Filter Section CSS */
/******************************************************/
.filter-btn-container {
    display: table;
    width: 100%;
    margin-top: 8px;
}
.filter-btn-left-space {
    display: table-cell;
    width: 25%;
    border: 1px solid transparent;
}
.filter-btns-left {
    display: table-cell;
    padding-left: 8px;
}
.filter-btns-right {
    display: table-cell;
    text-align: right;
}
.continue-to-sess-btn {
    float: left;
}

.well {
    padding: 9px;
    margin-bottom: 6px;
}

.well>table{
    margin-bottom: 3px;
}

.well .table>tbody>tr>td{
    vertical-align: middle;
    border-top: 0px;
    padding-bottom: 0px;
    padding-top: 0px;
}

.well .table>tbody>tr>td.form-inline{
    padding-top: 2px;
    padding-bottom: 2px;
}

.well .DataLabel{
    font-weight: bold;
}
/* To work with new form button placement (aligned with left-edge of fields), form-based
   filter rows need to use same widths as table-based filter rows */
.well.filter-well label.col-sm-2 {
    width: 25%;
}
.well.filter-well div.col-sm-10 {
    width: 75%;
    padding-left: 8px; /* to match padding on table cell based fields */
}

/* Form CSS */
/* this is a bad override - the not-last-child in an input group
   should not have rounded right corners */
/*.input-group .form-control:not(:first-child):not(:last-child) {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}*/

.form-control.form-select-with-width, .form-control.form-input-with-width{
    width: 55%;
    margin-right: 4px;
}

/* Form Field Size (xxsmall to xlarge) */
.form-field-xxsmall {
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
}
.form-field-xxsmall:disabled {
    cursor: not-allowed;
    background-color: #eee;
    opacity: 1;
}
.form-field-xxsmall:focus {
    border-color: #66afe9;
}

.form-control.form-field-xsmall {
    width: 20%;
    display: inline-block;
}
.form-control.form-field-small {
    width: 35%;
    display: inline-block;
}
.form-control.form-field-medium {
    width: 55%;
    display: inline-block;
}
.form-control.form-field-large {
    width: 68%;
    display: inline-block;
}
.form-control.form-field-xlarge {
    width: 100%;
    display: inline-block;
}
.form-control.form-field-auto {
    width: auto;
    max-width: 100%;
    display: inline-block;
}

.output-template{
    min-width: 170px;
}

.well .table .form-control.select-activities, .form-control.select-activities{
    min-width: 222px;
}

.lr-profilepic-width, #LR_ABOUTME, .lr-journalattach-width{
    min-width: 220px;
}

@media (min-width: 768px){
    /* BS input group tp launch activity needs to be limited in max width in wide screens */
    .activity-select-container {
        max-width:350px;
    }
    .activity-select-margin{
       margin-top: -8px;
    }
    .form-control-static .form-control {
        display: inline-block;
        vertical-align: middle;
    }
}

.form-control.advanced-search-fields{
    width: 98%;
    margin-bottom: 10px;
}

.advancedsearch-title {
    margin-right: 15px;
}

.well .form-group.catalog-filterdates {
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 0px;
}

.search-advanced-panel .container-fluid{
    /*padding-left: 0px;*/
}

.inputfield-info{
    font-style: italic;
    margin-left: 8px;
}

@media (max-width: 768px){
    .form-control.form-select-with-width, .form-control.form-input-with-width{
        width: 82%;
        margin-bottom: 4px;
    }
    .form-horizontal .col-sm-10, td.data.col-sm-10, .form-control.form-field-medium, .form-control.form-field-small, .form-horizontal label.col-sm-2.control-label.dataLabel{
        width: 100% !important;
    }

    .inputfield-info{
        margin-left: 0px;
    }

    .btnwith-margin{
        margin-top: 3px;
    }
}

@media (min-width: 768px) and (max-width: 796px){
    .launchButton.btnwith-margin {
        margin-top: 3px;
    }
    .form-control.form-field-medium.launcher-textfield {
        width: 100%;
    }
}

.doc-upload-height{
    height: auto !important;
}

.textarea-with-minwidth{
    min-width: 195px;
}

.select-with-minwidth, .date-with-minwidth, .field-with-min-width{
    min-width: 130px;
}
.select-with-autowidth {
    width: auto;
}

.datetime-with-minwidth {
    min-width: 180px;
}

.inherit-width {
    width: inherit;
}

.smallfield-with-min-width{
    min-width: 70px;
}

.chosen-container{
    width: 82% !important;
    margin-bottom: 5px;
}

@media (max-width: 768px) {
    .form-horizontal .chosen-container {
        width:100% !important; /* overrides chosen JS pixel width set */
    }
    .form-horizontal .select2-container {
        width:100% !important; /* overrides chosen JS pixel width set */
    }
    .typeahead-container .form-horizontal .select2-container {
        margin-bottom:5px; /* to distance it from our clear/select all buttons */
    }
}
@media (min-width:769px) {
    .form-horizontal .select2-container {
        width:55% !important; /* overrides chosen JS pixel width set */
    }
    .form-horizontal .form-field-xlarge + .select2-container {
        width:90% !important;
    }
}

@media (max-width:992px) {
    .form-horizontal .filter-well .form-field-xlarge + .select2-container {
        width:70% !important;
    }
}

@media (min-width:992px) {
    .form-horizontal .filter-well .form-field-xlarge + .select2-container {
        width:78% !important;
    }
}

/* typeahead controls for breakpoints in pages with submenu sizing */
@media (min-width: 992px) and (max-width: 1099px) {
    .dash-container.dash-with-subnav .form-horizontal .filter-well .form-field-xlarge + .select2-container,
    .notdash-container .form-horizontal .filter-well .form-field-xlarge + .select2-container {
        width:70% !important;
    }
}

@media (min-width: 1100px) and (max-width: 1320px) {
    .dash-container.dash-with-subnav .form-horizontal .filter-well .form-field-xlarge + .select2-container,
    .notdash-container .form-horizontal .filter-well .form-field-xlarge + .select2-container {
        width:74% !important;
    }
}

@media (min-width: 1321px) {
    .dash-container.dash-with-subnav .form-horizontal .filter-well .form-field-xlarge + .select2-container,
    .notdash-container .form-horizontal .filter-well .form-field-xlarge + .select2-container {
        width:78% !important;
    }
}


@media (min-width: 693px) {
    .typeahead-btn-controls{
        display: inline;
        white-space:nowrap;
    }

    .chosen-container{
        width: 57% !important;
        min-width: 174px;
    }
}

.form-control.force-100 + .select2-container {
    width:100% !important;
}


.chosen-container-active{
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
}

.chosen-container-active ul.chosen-choices{
    border-color: #66afe9 !important;
    outline: 0;
}

.chosen-choices{
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    border-color: #ccc !important;
    border-radius: 4px;
    min-height: 34px !important;
    padding: 4px 5px !important;
    max-height: 100px;
    overflow-y: scroll !important;
}

ul.chosen-choices{
    padding-left: 0px;
}

ul.chosen-choices li.search-field {
    list-style: none;
}

.chosen-container-multi .chosen-choices li.search-choice{
    border: 1px solid transparent !important;
    border-radius: 4px !important;
    border-bottom-color: rgb(204, 204, 204) !important;
    padding-top: 7px !important;
    padding-bottom: 7px !important;
}

.chosen-container-multi .chosen-choices li.search-choice .search-choice-close{
    top: 6px !important;
    background: url('images/chosen-sprite.png') -42px 4px no-repeat !important;
}
.chosen-container-single {
    height:34px;
}
.chosen-container-single .chosen-single {
    height: 34px;
    line-height: 32px;
}
.chosen-container-single .chosen-single div {
    top:4px;
}
a.chosen-single {
    font-weight:normal;
}

.form-control-error {
    margin-bottom: -12px;
    color: #a94442;
    font-weight: bold;
    margin-top: 3px;
}

.has-error .form-control + .select2-container .select2-selection,
.has-sr-error .form-control.err + .select2-container .select2-selection {
    border-color: #a94442;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
}

.select2-dropdown,
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default .select2-selection--multiple,
.select2-container--default .select2-selection--single {
    border: 1px solid #ccc;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
    height:32px;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height:34px;
}
.select2-container .select2-selection--single {
    height:34px
}
.select2-container .select2-selection--multiple {
    min-height:34px;
}
.select2-container .select2-search--inline .select2-search__field {
    margin-top:6px;
}
.select2-selection__clear {
    font-size:20px;
}
/* make readonly select elements 'look' readonly */
select[readonly].select2-hidden-accessible + .select2-container {
  pointer-events: none;
  touch-action: none;
}

select[readonly].select2-hidden-accessible + .select2-container .select2-selection {
  background: #eee;
  cursor: not-allowed;
  box-shadow: none;
}
select[readonly].select2-hidden-accessible + .select2-container--default .select2-selection--single .select2-selection__rendered {
    color:#555;
}

select[readonly].select2-hidden-accessible + .select2-container .select2-selection__arrow,
select[readonly].select2-hidden-accessible + .select2-container .select2-selection__clear {
  display: none;
}

.select2-container--default .select2-selection--multiple
.select2-selection__choice {
    line-height:24px; /* to make up for our unusually small global font sizes */
}
.select2-container--default .select2-results__option[aria-selected=true] {
    color: #666; /* to make already selected items appear slighly more disabled, even though clicking them will remove them from the list */
}
.container.certificate-ui-container {
    padding: 30px;
}

.report-ui-container{
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
}
.container.report-view {
    width:100%;
}
@media (max-width: 1199px) {
    label.col-lg-2.control-label.dataLabel, .col-lg-6.td-right-detail.form-control-static {
        padding-left: 0px;
        padding-right: 0px;
    }
}

.form-group.section-title-block {
    margin-bottom: 0;
}
span.form-section-collapse-link {
    float: right;
    font-size: 24px;
    width: 28px;
    text-align: center;
    position: relative;
    line-height: 26px;
    background-color: rgba(255, 255, 255, 0.8);
    border-radius: 50%;
    top: -2px;
}
.form-section-collapsible p.sectionTitle {
    margin-bottom: 0;
}
.form-container-subtitle {
    margin: 8px;
}
.form-section-collapse-link a:hover {
    text-decoration: none;
    border: 0;
}

/* Style of ReportGenerator.cgi using resport-ui.tmpl */
/* gloabl search merge conflicts */
/*.report-ui-container .col-md-12 #content div.panel-heading{
    background-color: #f5f5f5;
    border: 1px solid #ddd;
    border-bottom: none;
}

.report-ui-container .col-md-12 #content div.panel-body{
    border: 1px solid #ddd;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    margin-bottom: 8px;
}*/

/* Style of cgi pages with tab-body-container using resport-ui.tmpl */
/* gloabl search merge conflicts */
/*.report-ui-container .col-md-12 #content div.tab-body-container.tab-content div.panel-heading{
    border: 0px;
    border-bottom: 1px solid #ddd;
}

.report-ui-container .col-md-12 #content div.tab-body-container.tab-content div.panel-body{
    border: 0px;
}*/


.report-header-closebtn{
    float: right;
    margin-top: 14px;
}

.report-date-offset{
    padding-left: 4px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

.csv-dl-link {
    margin-left:10px;
}
/******************************************************/
/* Inline Data Form */
/******************************************************/
.inline-form-data {
    display: table;
}
.inline-left-data, .inline-right-data {
    display: table-cell;
    vertical-align: middle;
}

/******************************************************/
/* Icons in the Table */
/******************************************************/
.action-icons{
    display: block;
    float: right;
    margin-bottom: 10px;
    margin-top: 10px;
}

.brochure-milestone-hline{
    margin-top: 10px;
    margin-bottom: 7px;
    border: 0;
    border-top: 1px solid #e0e2e7;
    clear: both;
}

.help-oldicon, .brochure-oldicon, .test-icon {
    display: none;
}

.brochure-newicon {
    display: inline;
}

.progress-addtotask{
    float: left;
}

.pm-addtotask {
  float: right;
}

span.glyphicon.glyphicon-remove.schedule-remove-icon {
    float: left;
}

.input-group span.glyphicon-asterisk{
    font-size: 9px;
    top: -1px;
    right: -1px;
}

.journal-link, .lr-preformview-link {
    display: inline;
}

.lrperformplan-documents, .lr-addoutcome, .lr-performance-icon, .individual-devplan {
    float: right;
}

.lr-performance-icon{
    margin-left: 3px;
}

.sro-demo-links{
    float: right;
}

.old-warning-icon{
    display: none;
}

span.glyphicon.glyphicon-alert, span.alertHighlight, .expired-date{
    color: #a94442;
}

.help_link:hover{
    border-bottom: none;
}

.pmp-info-container {
    min-height: 38px;
    height: auto;
    text-align: justify;
}

.pmp-icons-container, .currency-icon-container, .attachment-icon-container {
    height: 38px;
    float: right;
    padding-left: 10px;
}
.attachment-icon-container {
    padding-top: 9px;
}

.pmp-icons-container .btn-group .dropdown-menu {
    margin: 4px 0 0;
}

.currency-icon-container {
    margin-bottom: 5px;
}

@media (max-width: 650px) {
    .pmp-info-container {
        clear: both;
    }

    .pmp-icons-container {
        clear: both;
        height: 48px;
    }
}

@media (min-width: 992px) {
    .cat-item-section-container.cat-item-info-panels .cat-item-col:not(:first-child) {
        padding-left: 0px;
    }
    .cat-item-section-container.cat-item-info-panels .cat-item-col:not(:last-child) {
        padding-right: 5px;
    }
    .usr-sess-brochure.cat-item-info-panels .cat-item-col:not(:first-child) {
        padding-left: 5px;
    }
}

.col-md-5 .panel-body{
    height:239px;
    overflow-y: auto;
    overflow-x: hidden;
}

.col-md-7 .panel-activity-list {
    height:731px;
    overflow-y: auto;
    overflow-x: hidden;
}

/* in single-column smartphone mode, the tasklist doesn't need to be longer than the number of tasks,
   and it should probably not be much longer than the average smartphone screen height */
@media (max-width: 768px) {
    .col-md-7 .panel-activity-list {
        height:auto;
        max-height:640px;
    }

    .print-container .form-horizontal label.col-sm-2.control-label.dataLabel, 
    .print-container label.col-sm-2.control-label.dataLabel {
        width: 35.666667% !important;
    }
    .print-container span.form-view-value {
        margin-top: 0px;
    }
}

.col-md-5 .list-group a{
    margin-bottom: 5px;
    border-radius: 4px;
}

.col-md-5 .list-group a:hover{
   border-color: #D6D6D6;
}

.col-md-5 .alert{
    margin-bottom: 5px;
}

.navmenu-col {
    float: right;
    margin-top: 20px;
    padding-left: 0px;
    padding-right: 0px;
}

/* upgrade a form section container's section title header to look like a boostrap panel */
.upgrade-form-sections .form-section-container .sectionTitle {
    font-weight:normal;
    padding:10px 15px;
}
.panel-default>.panel-heading{
    color: #555;
}

#content_container_blank{
    padding: 35px 25px 25px 25px;
}
.in-modal-body #content_container_blank{
    padding: 10px;
}

#content_container_blank.print-container .action-icons {
    display: none;
}

/* for any PRINT_FRIENDLY options not captured in panel settings for blank TMPL file above */
#content_container_blank.print-container .panel-heading span.glyphicon, 
#content_container_blank.print-container .panel-heading h3 {
    color: #909090;
}

/* New Enrolment Details */
.new-enrolment-details {
    padding: 10px;
}

@media (min-width: 768px) {
    .new-enrol-detail[class*="col-sm-"], .new-crs-detail[class*="col-sm-"] {
        padding-right: 4px;
        padding-left: 4px;
    }
}
@media (max-width: 768px) {
    .new-enrolment-details .label-title {
        margin-right: 8px;
    }
}

/* Enrolment check accordion */
#enrol_check_results .accord-item .panel-title a>div {
    padding:5px 10px;
}

/******************************************************/
/* Form-control Labels and input Settings */
/******************************************************/
/*.input-group .form-control{
    margin-top: -0.4px;
}*/

label.control-label {
    padding-right:0;
   /* margin-top: 2px;*/
}

.block-level-label {
    font-weight: bold;
    display: block;
    padding: 2px 0;
}

span.label-help {
    display: inline-block;
    font-weight: normal;
    font-style: italic;
    padding-top: 4px;
}
/******************************************************/
/* Display of the fields */
/******************************************************/
.form-group, .selfreview-table, h5#view_comp_ack{
    clear: both;
}

.emp-selfrate-title{
    float:right;
    clear:both;
    display: flex;
}

select.form-control.form-field-rating{
    width: auto !important;
    min-width: 169px;
}

.form-section-container, .inner-panel {
    border: solid 1px #eee;
    border-radius: 6px;
    margin-bottom:10px;
    margin-top: 10px;
    clear: both;
    /*overflow: auto;*/ /* turning off this overflow: either it shouldn't be needed, or an alternative soltion is required */
}

.form-horizontal{
    clear: both;
}

/* Really not sure if this was a good idea to remove the negative 15px padding bootstrap applies to .form-group
inside a .form-horizontal. If used inside a container with 15px padding (which we often do), you have twice the
padding expected. This is most noticeable when looking at the form in portrait mode on a small device. So I'm
going to re-instate the negative padding for devices smaller than 768px */
.form-horizontal .form-group{
    margin-right: 0px;
    margin-left: 0px;
   /* margin-bottom: 4px;*/
}

.form-view-value-paragraph {
    padding: 0 10px 0;
}

.form-grp-outcome-change-btn {
    margin-bottom: 0;
}

@media (max-width: 768px) {
    input[type="checkbox"].tf-checkbox {
        width:22px;
        height:22px;
        margin-top:0;
    }
}
/*.form-container .form-group:first-child label.control-label {
    padding-top:0;
}*/
/*.well .form-group{
    margin-bottom: 4px;
}*/

span.form-view-value hr{
    border-color: #fff;
}

.form-data-label{
    color: #909090;
    margin-top: 15px;
}

.form-section-container .form-data-label,
.inner-panel .inner-panel-heading {
    color: #333;
    margin-top: 15px;
    background-color: #f5f5f5;
    margin-top: 0px;
    min-height: 40px;
    font-size: 15px;
    border-bottom: 1px solid #eee;
    padding: 8px 10px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.control-label>table td{
    text-align: left;
}

.col-sm-2 .control-label{
    text-align: left;
}

.adhocelement-label {
    text-align: right;
}

.td-adhoc-description {
    padding: 6px;
    padding-bottom: 3px;
}
.td-adhoc-details{
    padding: 5px; 
}

.hline {
    margin-top: 10px;
    margin-bottom: 10px;
    border: 0;
    border-top: 1px solid #eee;
}

a.activity-header-show{
    margin-bottom: 22px;
    float: right;
    border-bottom: 0.08em solid #fff;
    padding-left: 5px;
}

a.activity-header-show:hover{
    border-bottom: 0.08em solid rgba(0, 153, 51,0.2);
}

a.activity-header-hide{
    right: 0;
    position: absolute;
    top: 15px;
    margin-right: 15px;
}

/* Form display */
.notification-sectionform span.form-view-value a {
    word-break: break-all;
    display: inline-table;
}

span.form-view-value {
    /*display: inline-block;*/
    display: inline;
    list-style: none;
    text-align: justify;
}
@media (max-width: 768px) {
    span.form-view-value { /* controversial - undoing a 3yr old setting above */
        display:block;
        text-align:initial;
    }
}

span.form-view-value img {
    max-width:100%;
}

.form-group .crs-header-label{
    text-align: left;
}

/******************************************************/
/* Adhoc Activities
/******************************************************/
#adhoc_header .profile-pic {
    max-width:200px;
    margin-top: 0;
}
.adhoc-activity-header {
    background-color:#f9fdf8;
    margin: -10px -15px 10px -15px;
    border-bottom: solid 1px #ddd;
}
.adhoc-activity-header .group-body {
    background-color: #fff;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}
.adhoc-toggle-header {
    font-size: inherit; /* ususally wrapped in h3 */
}
.adhoc-toggle-header.hide {
    display: none;
}
.adhoc-toggle-header.show {
    display: block;
}
.adhoc-summary-showhide-tab {
    background-color:#ddedda;
    padding: 5px 15px;
    margin: -15px -15px 10px -15px;
    color: #295b11;
    cursor: pointer
}
.adhoc-summary-showhide-tab:hover {
    background-color:#eaf8e2;
    color:#246b0f;
}
.adhoc-summary-showhide-tab .summary-title {
    float:left;
}
.adhoc-summary-showhide-tab .summary-chevron {
    float:right;
    position: relative;
    top: 3px;
}
.adhoc-summary-showhide-tab .summary-chevron .mdi {
    font-size: 24px;
    line-height: 12px;
}
.adhoc-summary-container {
    margin-top: 10px;
}
.btn-adhoc-info-launcher {
    cursor: pointer;
}
.adhoc-title-info .btn-adhoc-info-launcher {
    position: relative;
    top: 2px;
}
.btn-adhoc-info-launcher span.mdi {
    font-size: 24px;
    line-height: 10px;
}
.adhoc-popover-content {
    display:none;
}
.adhoc-lv-1 {
    font-size: 16px;
    font-weight: bold;
    color: #666;
}
.adhoc-lv-2 {
    font-size: 14px;
    font-weight: bold;
    color: #666;
}
.adhoc-lv-3 {
    font-size: 12px;
}
.adhoc-popover-open-content div {
    font-size: 12px;
}
.adhoc-popover-open-content div:not(:last-child) {
    margin-bottom: 5px;
}
.adhoc-title-info-extra {
    margin-top: 8px;
}
.adhoc-profile-pic img {
    max-width: 200px;
}
.adhoc-date {
    display: inline-block;
    margin-right: 15px;
}
.adhoc-lr-details {
    margin-top: 10px;
}
.adhoc-group-body {
    display:flex;
}
.adhoc-profile-details {
    flex:1;
    padding-left: 15px;
}
.adhoc-title-icon-container {
    display: flex;
}
.adhoc-title-section {
    flex: 1;
}
.adhoc-icon-section {
    float: right;
    padding-bottom: 10px;
}
.adhoc-title-icon-container .adhoc-icon-section {
    padding-bottom: 0;
}
/******************************************************/
/* text containers */
/******************************************************/
.page-tip{
    color: #333;
    line-height: 1.5;
    font-size: 13px;
    font-style: italic;
    font-weight: normal;
}

/******************************************************/
/* jcarousel CSS Classes */
/******************************************************/
.jcarousel-wrapper {
    margin:30px auto 10px;
}

.jcarousel-control-prev, .jcarousel-control-next {
    opacity: 0.45;
    font-size: 33px;
    line-height: 25px;
    display: none;
}

.jcarousel-arrow-left{
    margin-left: -3px;
}

.jcarousel-arrow-right{
    margin-left: 1px;
}

.jcarousel-control-next:hover, .jcarousel-control-prev:hover{
    color: #5bc0c0;
    text-decoration: none;
    opacity: 0.7;
    border-bottom: none;
}

.jcarousel-wrapper .panel-body {
    padding:10px 10px 5px;
}

.jcarousel-wrapper {
    border: 0px;
    box-shadow: 0 0 2px #fff;
}

/******************************************************/
/* Pop-Over Menu */
/******************************************************/
.trigger, .trigger:hover{
    color: #333;
    text-decoration: none;
    border-bottom: none;
    font-weight:normal;
}

.nav-tabs {
    border-bottom: 0px;
}

@media (max-width: 780px) {
    .nav-tabs > li {
        border:1px solid #666;
    }

    .nav-tabs>li>a{
        border-radius: 0px;
        margin-right: 0px;
    }
}

#tab_header li>a{
    font-weight: normal;
    color: rgb(0, 153, 51);
}

li#current_tab a{
    font-weight: normal;
    color: #555;
}

/*.popover{
    width: 300px;
    height: 250px;
}

.popover-content{
    font-style: normal;
    font-size: 12px;
}

.popover-title{
    color: #333;
    text-decoration: none;
}

*//******************************************************/
/* (non-bootstrap) full screen modal overlay */
/******************************************************/
#modal_bg {
    display:none;
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:#333;
    filter:alpha(opacity=60);
    -moz-opacity: 0.6;
    opacity: 0.6;
    -khtml-opacity: 0.6;
    z-index:2000;
}

#info_panel {
    display:none;
    position:fixed;
    z-index:2001;
    top: 25%;
    left: 5%;
    width:90%;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    box-shadow: 0 5px 10px rgba(0,0,0,.2);
    border: solid 1px #b4b4b4;
    background-color: #fff;
}

@media (min-width: 768px){
    #info_panel {
        top:50%;
        left:50%;
        margin:-250px 0 0 -250px;
        width:500px;
    }

    .btnwith-margin{
        margin-left: 3px;
    }
}


#info_panel_content {
    padding: 15px;
}
#info_panel_header {
    margin-right:30px;
}
#info_panel_close {
    position: absolute;
    right: 6px;
    top: 3px;
}

/******************************************************/
/* Certificates
/******************************************************/
.cert-list-thumb {
    border:solid 1px #ddd;
}
.xs-mt-50 {
  margin-top: 50px;
}

/******************************************************/
/* Course disclaimer modal */
/******************************************************/
#disclaimer_modal .modal-body {
    height:400px;
}

/******************************************************/
/* Old overlib styles turned into newer look */
/******************************************************/
#overDiv {
    padding:1px;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    border-radius:4px;
    box-shadow: 0 5px 10px rgba(0,0,0,.2);
    /* site-specific colours etc */
    border:solid 1px #b4b4b4;
    background-color:#fff;
}
.overdiv_fg {
    background-color:#fff;
}

.overdiv_hdr {
    background-color:#f7f7f7;
    border-bottom:solid 1px #ebebeb;
}

.overdiv_hd_txt {
    padding: 10px 14px;
    color:#333;
    background-color: #f7f7f7;
    border-bottom: solid 1px #ebebeb;
}

td.overdiv_hd_txt{
    padding-top: 6px;
    padding-bottom: 6px;
}

.overdiv_txt {
    padding:5px;
    font-size:12px;
}
.overdiv_close {
    padding: 4px 3px;
    right: 7px;
    position: absolute;
}
.overdiv_close a {
    font-size:16px;
    font-weight:bold;
    color:#666;
    text-decoration:none;
}
.overdiv_close a:hover {
    color:#888;
    border-bottom: none;
}

/*.form-control{
    border-radius: 4px;
    margin-bottom: 5px;
}*/

/******************************************************/
/* Education Assistance Section Classes */
/******************************************************/
.dollar-input-group{
    position: absolute;
    padding: 6px 12px;
    font-size: 14px;
    color: #555;
    text-align: center;
    background-color: #eee;
    border: 1px solid #ccc;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.currency-converter-table{
    margin-top: -25px;
}

#LRQ_COST{
    width: 31% !important;
    margin-left: 31px;
}

#EI_COST, #EI_COST_NOTOTAL{
    margin-left: 30px;
    width: 31%;
}

/******************************************************/
/* KRA Plan Section Classes */
/******************************************************/
.percentage-input-group{
    position: absolute;
    padding: 6px 12px;
    font-size: 14px;
    color: #555;
    text-align: center;
    background-color: #eee;
    border: 1px solid #ccc;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    display: inline;
    margin-left: -3px;
}

.input-group-kra>input{
    padding-left: 5px;
    padding-right: 5px;
}

.kra-sub-category{
    max-width:  245px;
    text-align: justify;
    margin-top: 2px;
    padding-right: 10%;
}

@media (max-width: 1200px) {
    .percentage-input-group{
        padding: 6px 5px;
    }
    .input-group-kra>input{
        padding-left: 5px;
        min-width: 35px;
    }
}

@media (max-width: 768px) {
    .col-sm-6.input-group.input-group-kra{
        padding-right: 20px;
    }
}

/******************************************************/
/* Journal Table */
/******************************************************/
.journalbutton{
    width: 100%;
    height: 38px;
    background-color: #F5F5F5;
    display:inline-block;
    float: right;
    display:none;
    margin-left: 10px;
}

.add-journal, .read-journal, .download-journal, .view-detail-course, .view-doc-course, .upload-doc-course{
    width: 43px;
    height: 33px;
    float: right;
    margin-top: -7px;
}

.add-journal{
    background-image: url('img/add-icon.png');
}

.read-journal{
    background-image: url('img/read-icon.png');
}

.download-journal{
    background-image: url('img/download-icon.png');
}

.add-journal:hover{
    background-image: url('img/add-icon-hover.png');
}

.read-journal:hover{
    background-image: url('img/read-icon-hover.png');
}

.download-journal:hover{
    background-image: url('img/download-icon-hover.png');
}

.add-label, .read-label, .download-label,.view-detail-label, .view-doc-label, .upload-doc-label{
    color: #333;
    font-size: 10px;
    float: right;
    position: static;
    display:none;
    margin-top: 4px;
    width: 47px;
}

@media (min-width: 992px) {
    .add-label, .read-label, .download-label,.view-detail-label, .view-doc-label, .upload-doc-label{
        font-size: 9px;
        margin-left: 0px;
    }
}

@media (min-width: 1200px) {
    .add-label, .read-label, .download-label,.view-detail-label, .view-doc-label, .upload-doc-label{
        font-size: 10px;
    }
}


.view-detail-label, .view-doc-label, .upload-doc-label{
    margin-left: 0px;
    margin-right: 30px;

}

.journal-details-link span {
    font-size: 22px;
    margin-right: 5px;
    vertical-align: middle;
}

/******************************************************/
/* Activity Center Table */
/******************************************************/
.activitybutton{
    width: 100%;
    height: 38px;
    background-color: #F5F5F5;
    display:inline-block;
    float: right;
    display:none;
    margin-left: 54px;
}

.view-detail-course{
    background-image: url('img/viewdetail-icon.png');
}
.view-doc-course{
    background-image: url('img/viewdoc-icon.png');
}
.upload-doc-course{
    background-image: url('img/upload-icon.png');
}
.view-detail-course:hover{
    background-image: url('img/viewdetail-icon-hover.png');
}
.view-doc-course:hover{
    background-image: url('img/viewdoc-icon-hover.png');
}
.upload-doc-course:hover{
    background-image: url('img/upload-icon-hover.png');
}


/******************************************************/
/* Announcement  Slider Caption */
/******************************************************/
.buttonBack{
    border-radius: 2px;
    box-shadow: 0px 0px 4px #333;
    position: relative;
    overflow: hidden;
}

.boxCaption{
    background: rgba(91, 183, 91, 0.9);
    width: 100%;
    height: 100%;
    bottom: -150px;
    text-align: justify;
    position: absolute;
    overflow: hidden;
}

.boxCaption h4, .boxCaption p{
    color: #fff;
    margin-left: 15px;
    margin-right: 15px;
    margin-top: 15px;
}

.carousel.slide .boxCaption>img{
    width: 25px;
    height: 25px;
    float: right;
    margin-right: 17px;
    margin-top: 14px;
}

.announce-tmpl-container {
    cursor:pointer;
}

.bottom-xshort-gap{
    margin-bottom: 4px;
}

.bottom-short-gap{
    margin-bottom: 10px;
}

.bottom-medium-gap{
    margin-bottom: 20px;
}

.bottom-large-gap{
    margin-bottom: 40px;
}

/*.bottom-xlarge-gap{
    margin-bottom: 50px;
}*/

.top-short-gap{
    margin-bottom: 6px;
}

.top-medium-gap{
    margin-bottom: -20px;
}

.bottom-short-gap.dash-container{
    margin-top: -18px;
}

.top-long-gap{
    margin-top: 80px;
}

.top-gap-personaltask{
    margin-top: 18px;
}

.top-gap-small{
    margin-top: 10px;
}

.sro-addtask-padding, .whkgroupp-addtask-padding{
    margin-right: 40px;
}

.addto-personaltask-glyphicon{
    margin-right: -3px !important;
}

.summary-personaltask-link{
    margin-top: 19px;
}

/*************** Announcement Modal ***************/
.modal-announcement-image{
    float: left;
    display: inline-block;
}

.modal-announcement-icon{
    width: 80px;
    height: 80px;
}

.modal-announcement-header, .modal-announcement-info{
    margin-left: 110px;

}

.announcement-view-section{
    padding: 15px;
    border: 1px solid #e3e3e3;
    border-radius: 4px;
}

.opened-announcement-body{
    overflow-x: auto;
    margin-right: 15px;
}

/******************************************************/
/* Notification Icons */
/******************************************************/
ul.dropdown-menu li>a:hover {
    border-bottom: none;
}

.todo-icon-arrow{
    -ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
    transform: rotate(45deg);
    display: block;
    content: '';
    width: 10px;
    height: 10px;
    background-color: rgb(182, 182, 182);
    position: absolute;
    border-left: 0;
    border-bottom: 0;
    top: 50%;
    right: -5px;
    margin-top: -3px;
}

.todo-icon-arrow.selected{
    background-color:rgb(91,183,92);
}

.notification-item {
    padding:0;
}

.notification-item-image{
    line-height: 1;
    font-size: 16px;
    left: 10px;
    margin-top: -8px;
    position: absolute;
    top: 50%;
}

.notification-icon-section{
    text-align: center;
    width: 34px;
    height: 103%;
    position: absolute;
    top: -1px;
    left: -1px;
    padding-top: 15px;
    background-color: rgb(182, 182, 182);
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}
.notification-icon-section.selected {
    background-color:rgb(91,183,92);
}

.notification-title-section {
    display: flex;
    align-items: center;
    font-weight:normal;
}

.notification-description {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 11px;
    padding-left: 45px;
    padding-right: 30px;
}

.calevent-title {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-right: 10px;
}

.notification-data-head {
    overflow: hidden;
    padding-bottom: 8px;
}
.notification-date {
    float:left;
    font-weight:bold;
}
.notification-attach-link {
    float:right;
}
.unread-item {
    font-weight:bold;
}

.notification-unread-item, a.notification-unread-item, a:link.notification-unread-item, a:visited.notification-unread-item, a:active.notification-unread-item {
    font-weight:bold;
}

notification-read-item, a.notification-read-item, a:link.notification-read-item, a:visited.notification-read-item, a:active.notification-read-item {
    font-weight:normal;
}

.notification-close-btn {
    height: 100%;
    position: absolute;
    top: 0px;
    right: 7px;
}

#notifications_Dropdown{
    margin-top: -5px;
    margin-right: -4px;
}

.notification-icon-attach, .btn-with-icon-badge {
    height: 16px;
    width: 16px;
    float: right;
    position: absolute;
    border-radius: 3px;
    border: none;
}

.notification-icon-attach {
    top: -4px;
    right: -7px;
}
.btn-with-icon-badge {
    background-color: #e4a611;
    right: 15px;
    margin-top: -5px;
}
.panel-body .notification-icon-attach .glyphicon, .btn-with-icon-badge span.glyphicon {
    color: #fff;
    position: absolute;
    top: 2px;
}
.panel-body .notification-icon-attach .glyphicon {
    font-size: 12px;
    left: 2px;
}
.btn-with-icon-badge span.glyphicon {
    font-size: 11px;
    left: 3px;
}

/******************************************************/
/* Dashboard */
/******************************************************/
.panel-heading-dashboard {
    min-height:40px; /* for when dashboard loading */
}
.no-list-records {
    text-align:center;
}
.no-list-tasklist{
    padding: 15px 8px;
}
.ots-tasklist-empty {
    font-weight: bold;
}
/******************************************************/
/* Offline Assessment Sync Lists */
/******************************************************/
.oa-list-item {
    cursor:pointer;
    border-bottom:solid 1px #eeeeee;
    clear: both;
    outline: none;
    width: 100%;
    min-height: 50px;
    display: table;
}
.oa-list-item:hover {
    -webkit-box-shadow: inset 0 0 20px #cbcbcb;
    -moz-box-shadow: inset 0 0 20px #cbcbcb;
    box-shadow: inset 0 0 20px #cbcbcb;
}
.oa-list-info-group {
    display: table;
    width: 100%;
    padding-top: 7px;
    padding-bottom: 4px;
}
.oa-list-action {
    display: table-cell;
    vertical-align: middle;
    width: 1%;
}
.oa-list-action .btn-group {
    display: flex;
    margin-right: 5px;
}
.oa-list-info-container {
    width: 100%;
    display: table;
}
.oa-list-item-info {
    padding-bottom: 2px;
    padding-top: 2px;
    outline: none;
    padding-left: 5px;
}
.oa-list-info-status, .oa-list-info-create-date, .oa-list-info-submission-date {
    display: inline-block;
}
.oa-list-info-status {
    margin-right: 10px;
}
/******************************************************/
/* Task List Summary */
/******************************************************/
.task-list-summary {
    border-bottom:solid 1px #ddd;
    background-color: #f5f5f5;
}
.task-list-summary .task-list-summary-header {
    height: 26px;
    color: #fff;
    opacity: 0.9;
    padding-left: 10px;
    padding-top: 5px;
}
.task-list-summary .task-list-summary-details {
    padding: 5px 10px 5px 10px;
}

.activity-list-item {
    cursor:pointer;
    border-bottom:solid 1px #eeeeee;
    clear: both;
    outline: none;
    width: 100%;
    min-height: 50px;
    display: table;
}

.activity-list-item .panel-group {
    margin-bottom: 0px;
}
.search-result-panel {
    border:none;
}
.search-result-panel .panel-heading {
    background-color: #f5f5f5;
}
#search_results_list uib-accordion:last-child .activity-list-item:last-child {
    border-bottom: solid 1px transparent;
}
.activity-no-action {
    background-color:#f6f6f6;
    color:#666;
    cursor: not-allowed;
}
.activity-no-action:hover {
    background-color:#f6f6f6;
}
.activity-no-action .activity-icon {
    opacity:0.7;
}

.activity-panel-icon-container, .activity-panel-arrow-container {
    display: table-cell;
    vertical-align: middle;
}

.activity-panel-icon-container {
    position: relative;
    width: 47px;
}

.activity-panel-arrow-container {
    width: 20px;
}

.activity-icon {
    font-size:43px;
}

.activity-icon.user-sess-brochure{
    display: inline-block;
    margin-right: 10px;
    padding-top: 0px;
    margin-bottom: -10px;
}

.user-sess-brochure{
    height: 30px;
    width: 30px;
}
.upgrade-form-sections .form-section-container {
    border-color:#ddd; /* to match bootstrap panel */
}
.upgrade-form-sections .form-section-container .sectionTitle {
    border-top-left-radius:3px; /* to match bootstrap panel */
    border-top-right-radius:3px; /* to match bootstrap panel */
}
.upgrade-form-sections .form-section-container p.sectionTitle {
    margin-bottom:0;
}
/* Remove these at some point - it was a bad idea */
.upgrade-form-sections .form-section-container .sectionTitle,
.panel .panel-body{
    font-size: 13px;
}

.panel-body.panel-activity-list {
    padding:0;
    width: 100%;
}

.activity-panel-dropdown{
    margin-top: -5px;
    width: auto;
}

.activity-panel-item-container {
    width: 100%;
    display: table;
}

.activity-panel-item-info{
    padding-bottom: 2px;
    padding-top: 2px;
    /* need to leave outline in place for accessibility standards */
    /*outline: none;*/
}

.sr-only.sr-only-taskitem,
.sr-only.sr-only-cpd{
    position: absolute;
    display: block;
    width: 100%;
    color: #111 !important;
    font-weight: bold;
    overflow: inherit;
    clip: inherit;
}

.activity-panel-item-progressbar{
    width: 70%;
    margin: 3px;
    margin-left: 47px;
}

.activity-panel-item-icon{
    margin-right: 5px;
    margin-left: 9px;
    height: 47px;
}
.activity-panel-item-icon.activity-panel-item-noflag {
    margin-left: 8px;
    margin-right: 9px;
}

.progress-bar-striped{
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%,
                                      transparent 25%, transparent 50%,
                                      rgba(255, 255, 255, 0.15) 50%,
                                      rgba(255, 255, 255, 0.15) 75%,
                                      transparent 75%, transparent);
    background-size: 40px 40px;
    -webkit-background-size: 40px 40px;
}

.progress-cpd{
    height: 25px;
}

.progress.visible-measure {
    position: relative;
}
.progress.visible-measure span {
    position: absolute;
    display: block;
    width: 100%;
    color: black;
    text-shadow: -1px -1px 4px #fff, 1px 1px 4px #fff;
}
.progress.training-tab-progress {
    height:30px;
}
.progress.training-tab-progress .progress-bar {
    font-size: 14px;
    line-height: 26px;
}

/******************************************************/
/* Generic boostrap panel additions */
/******************************************************/

.panel-body.panel-body-list-group {
    padding:0;
}

/* RunProgress Simple Launch */
.run-prog-responsive-list {
    border:solid 1px #eee;
}
.run-prog-responsive-list .activity-list-item {
    cursor:default;
}
.run-prog-responsive-list .activity-list-item:hover {
    box-shadow:none;
}
.run-prog-responsive-list .activity-list-item:last-child {
    border-bottom:none;
}
.run-prog-responsive-list .item-title {
    font-size:14px;
    text-align:left;
}
.activity-panel-arrow-container.action-button {
    width:95px;
    padding-right: 8px;
}
.list-item-subtext-label {
    white-space:nowrap;
    font-weight:bold;
    margin-right:4px;
}
.list-item-subtext-label:after {
    content:':';
}
.list-item-subtext-val div {
    display:inline;
}
.icon-with-tt.simple-launch-only {
    display:none !important;
}
body.simple-launch #RUNPR_BUTTONS,
body.simple-launch .crsHeader,
body.simple-launch .sch-refresh {
    display:none;
}
@media screen and (max-width: 768px){
    body.simple-launch #tab_header {
        display:none;
    }
    .icon-with-tt.simple-launch-only {
        display:inline !important;
    }
    body.simple-launch .panel.first-active,
    body.simple-launch .panel.first-active>.panel-heading {
        border-top-left-radius:3px;
    }
}
@media screen and (max-width: 520px){
    .activity-panel-arrow-container.action-button {
        display:block;
        margin-left: 60px;
        margin-bottom: 8px;
    }
}

/* sr-only */
.sr-only-cpd{
    position: relative;
    top: 2px;
}
.sr-only.sr-only-taskitem{
    top: -2px;
    font-size: 11px;
}

.iframe-in-modal,
.task-modal-iframe {
    border: none;
    width: 100%;
    /*min-height: 650px;*/ /*causing issues when getting resized smaller*/
    height: 100%;
    display: block;
}

/* These modal bootstrap style overrides need to be revisted, and possibly moved up top
   with the other overrides if we decide we still need them. Ideally, we shouldn't */
.modal-header {
    padding: 5px;
}
/* to make up for padding reduction above */
.modal-header .close {
    margin:8px 8px 0;
}

.modal-agr-content {
    padding:15px;
}
h5.modal-body-agreement-sub-header {
    font-weight: bold;
    font-size: 15px;
    margin: 10px 15px 0;
    border-bottom: solid 0.5px #ddd;
    line-height: 1.5;
}

.modal-title {
    line-height: 2.0;
    font-size: 19px;
    margin-left: 15px;
}

.modal-body {
    overflow-x: auto;
    padding-left: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.modal-body.no-footer {
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}
.modal-body.modal-agreement {
    max-height:500px;
}
.modal-body.modal-agreement.auto-height {
    height:auto;
    max-height:auto;
}
.modal-footer {
    margin-top: 7px;
    padding: 7px 10px 7px;
}
.iframe-modal-body {
    padding:0;
    overflow:hidden !important; /* modal should take care of scrolling */
}
.iframe-modal-body.no-footer {
    /*padding-bottom:5px;*/ /* no longer needed for radius - browsers seem to draw scrollbar with radius now */
}
.agr-label {
    font-weight:bold;
    display:inline-block;
    margin-right:6px;
}
.agr-add {
    font-size:15px;
    line-height:16px;
    margin-top:15px;
}
.modal-body-spinner-bg {
    display:none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    z-index: 2;
    background-color: rgba(100,100,100,.6);
}
.spinner-outer {
    display:none;
    position: absolute;
    left: 0;
    z-index: 3;
    right: 0;
}

.date-highlight a.ui-state-default {
    background-image:none;
    background-color:#ccccff;
}

@media (min-width: 768px) {
    .navbar {
        border-radius: 0px;
    }
}

.navbar-default .navbar-link {
    border-bottom: none;
}

.navbar-default .navbar-brand {
    position: fixed;
}

.navbar-setting-btn{
    margin-top: 12px;
    margin-right: 10px;
}

.btn-group.navbar-setting-btn, .btn-section-right{
    float: right;
}
.btn-group.table-action-btngroup {
    display: inline-flex;
}
.btn-group.btn-group-with-text .btn-sm span[class^="sr-icon"] {
    line-height:0.5;
}
.btn-group.btn-group-with-text .btn-sm span[class^="sr-icon"]:before {
    top:3px;
}
.navbar-setting-menu, .navbar-profile-menu{
    left: auto;
    right: 0;
}

@media (min-width: 992px){
    .navbar-text {
        margin-right: 0px;
    }
}

.top-gap.no-announce {
    height:30px;
}

.animate-show.ng-hide-add.ng-hide-add-active,
.animate-show.ng-hide-remove.ng-hide-remove-active {
  -webkit-transition:all linear 0.5s;
  transition:all linear 0.5s;
}

.animate-hide {
  -webkit-transition:all linear 0.5s;
  transition:all linear 0.5s;
}

/******************************************************/
/* Activity Panel Items */
/******************************************************/
.activitypanel-progress-bar, .courses-progress-bar {
    max-height: 15px;
}

.activitypanel-info, .activity-panel-dropdown-info, .searchresult-info {
    color: #696969;
}

.activity-panel-dropdown-item-info {
    padding-top: 2px;
    padding-bottom: 2px;
}

.item-title, .activity-panel-dropdown-first {
    font-weight: bold;
    text-align: justify;
}

.activitypanel-status, .activitypanel-create-date, .activitypanel-submission-date,
.activity-panel-dropdown-status, .activity-panel-dropdown-date1, .activity-panel-dropdown-date2,
.test-result-info, .activitypanel-cust1-val {
    display: inline-block;
}
.activitypanel-status, .activity-panel-dropdown-status, .activitypanel-submission-date,
.activity-panel-dropdown-date2 {
    margin-right: 10px;
}
.activity-panel-info-group {
    display: table;
    width: 100%;
    padding-top: 7px;
    padding-bottom: 4px;
}

.activity-panel-group{
    padding: 2px 16px 10px 55px;
}

.activity-panel-group .panel-title{
    font-size: 13px;
}

.activity-panel-group .panel-heading{
    padding:0;
}
.activity-sub-item-panel-header {
    padding:6px 8px;
}
.activity-sub-item-panel-header-text {
    float:left;
}
.activity-sub-item-panel-loader {
    float:left;
}
.search-sub-item-panel-header {
    padding:8px 10px;
}

.activity-panel-group .panel-body{
    padding: 0px;
}

.activity-panel-item-dropdownicon{
    right: 10px;
    top: 8px;
}

.activity-panel-item-arrow{
    padding: 0px 5px;
}

.activity-panel-item-info.with-children{
    margin-bottom: 0px;
}

.courses-panel-item-icon{
    float: left;
    margin-right: 10px;
    margin-left: 8px;
}

.courses-panel-accord {
    margin-bottom: 8px;
}

.courses-panel-subitem {
    padding:8px 10px;
    border-bottom: solid 1px #eeeeee;
    clear: both;
}
.courses-panel-subitem:last-child {
    border-bottom:none;
}
.courses-panel-subitem:hover {
    background-color:#efefef;
}
.courses-panel-item-arrow{
    float: right;
    margin-top:2px;
    margin-right:0;
}
.courses-panel-item-desc {
    padding-right:25px;
}

.test-result-header{
    font-weight: bold;
    padding-top: 4px;
}
.activity-result-header {
    padding-top: 4px;
}
.activity-result-header-text {
    font-weight: bold;
}
.test-result-info{
    margin-top: 4px;
    margin-bottom: 4px;
    margin-right: 10px;
    /*margin-left: 58px;  58px = 40px icon + 8px margin left + 10px margin right */
}
.action-header-dropdown {
    position:relative;
}
.action-header-dropdown .dropdown-menu li>a.active {
    background-color: #eee;
}
.action-header-dropdown .dropdown-menu li>a {
    padding-right:25px;
}
.action-header-dropdown .dropdown-menu li>a>.dd-tick {
    margin-right:-17px;
}
.action-header-dropdown .dropdown-menu li>a.active .dd-tick:before {
    content:'\2713';
}
.action-header-dropdown .dropdown-menu li>a.active:hover .dd-tick.removable:before {
    content:'\2717';
}

.action-header-dropdown .dropdown-text-input {
    padding:3px 5px 3px 15px;
    position:relative;
}

.panel-default .panel-heading .action-header-dropdown .dropdown-text-input .glyphicon-text-remove {
    color:#666;
}

.panel-heading-buttons-container .dropdown-menu .dropdown-header,
.panel-heading-dashboard .dropdown-menu .dropdown-header,
.table-group-actions .dropdown-menu .dropdown-header,
.action-column-btn-dropdown .dropdown-header {
    font-weight: bold;
    color: #000;
    font-size: 13px;
    padding-left: 10px;
}

.action-column-items>.dropdown-menu,
.table-group-actions>.dropdown-menu {
    right: 0;
    left: auto;
    text-align: left;
    font-size: 13px;
    margin-bottom: 20px;
}

#task_list_dd {
    font-size: 18px;
    cursor: pointer;
    margin-right: -5px;
    top: 0px;
}

.tasklist-header-title-sub {
    font-size:11px;
    color:#999;
}

.tasklist-header-title-sub .uarr,
.tasklist-header-title-sub .darr {
    vertical-align: top;
    font-size: 15px;
    margin-top: -2px;
    display: inline-block;
}
.tasklist-header-title-sub .uarr:before {
    content:'\2191';
}
.tasklist-header-title-sub .darr:before {
    content:'\2193';
}

@media (max-width: 625px) {
    .activitypanel-status, .activity-panel-dropdown-status, .test-result-info {
        display: table;
        margin-right: 0px;
    }
}

@media (min-width: 992px) and  (max-width: 1200px) {
    .activitypanel-status, .activity-panel-dropdown-status, .test-result-info {
        display: table;
        margin-right: 0px;
    }
}

/************************************************************************ */
/* CSS loading spinner for activity item subtasks */
/************************************************************************ */
.activity-subtask-load-spinner,
.activity-subtask-load-spinner:after {
    border-radius: 50%;
    width: 10em;
    height: 10em;
}
.activity-subtask-load-spinner {
    margin:0;
    margin-left: 8px;
    font-size: 1.3px;
    position: relative;
    text-indent: -9999em;
    border-top: 1.8em solid rgba(119, 119, 119, 0.4);
    border-right: 1.8em solid rgba(119, 119, 119, 0.4);
    border-bottom: 1.8em solid rgba(119, 119, 119, 0.4);
    border-left: 1.8em solid #ffffff;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation: load8 1.1s infinite linear;
    animation: load8 1.1s infinite linear;
}
@-webkit-keyframes load8 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@keyframes load8 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

/******************************************************/
/* TODO - Panel-header links */
/******************************************************/
.panel-heading-links-container {
    float: none;
    margin: 0;
    position: absolute;
    right: 1px;
    top: 2px;
}

.panel-link-item-div{
    float: left;
    margin-right: 4px;
    display: inline-block;
}

.panel-link-item{
    opacity: 0.7;
    padding: 12px;
    padding-top: 3px;
    padding-bottom: 3px;
    /*background-image: url(../images/icons/ico_doc_upload_sm.png);*/
    border-radius: 20px;
    border: 2px solid #333;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,.05);
    position: relative;

}
.panel-heading-buttons-container {
    float: right;
    margin-right: -8px;
    margin-top: -24px;
    display: inline;
}

.panel-ctrl-btn [class^="sr-icon-"],
.page-heading-btn [class^="sr-icon-"],
.page-heading-btn [class^="flaticon-"],
.page-heading-btn .mdi {
    position: relative;
    top: 0;
    font-size: 26px;
    width: 28px;
    height: 28px;
    padding: 2px;
    border-radius: 50%;
    text-align: center;
    display: inline-block;
    line-height:normal;
    box-sizing: content-box;
    font-weight: normal;
}
a.panel-ctrl-btn.disabled,
a.page-heading-btn.disabled {
    opacity:0.3;
    cursor:default;
}
a.panel-ctrl-btn,
a.page-heading-btn {
    display:inline-block;
    position:relative;
}
a.panel-ctrl-btn:hover,
a.page-heading-btn:hover {
    text-decoration:none;
    border:0;
}
a.page-heading-btn:not(.disabled):hover span[class^="sr-icon-"],
a.page-heading-btn:not(.disabled):hover span[class^="flaticon-"],
a.page-heading-btn:not(.disabled):hover span.mdi {
    background-color:rgba(255,255,255,0.3);
}
a.panel-ctrl-btn:not(.disabled):hover span[class^="sr-icon-"] {
    background-color:rgba(0,0,0,0.2);
}

.panel-heading-buttons-container .dropdown {
    display:inline-block;
}

.panel-title-info:after {
    display: table;
    content: " ";
    clear:both;
}
.panel-title-left {
    float:left;
}
.panel-title-right {
    float:right;
}
.panel-title-left,
.panel-title-right {
    font-size:14px;
}
.panel-title-left .panel-title-item,
.panel-title-right .panel-title-item {
    display:inline-block;
}
.panel-title-info a {
    text-decoration:none;
}
.panel-title-info a:hover {
    text-decoration:underline;
}

/******************************************************/
/* Blocked Progress Bar */
/******************************************************/
.progress-bar-success {
    background-color: rgba(154, 205, 50, 0.89);
}

.blocked-progress-bar {
    overflow: hidden;
    height: 12px;
    background-color: #eeeeee; /*setting to plain grey since this isn't changed in every colour CSS file */
    box-shadow: inset 0px 0px 5px rgba(154, 205, 50, 0.4);
    margin-top: 2px;
    margin-bottom: 1px;
}
.blocked-progress-bar-small {
   min-width: 6%;
}
.blocked-progress-bar-medium {
   min-width: 2.8%;
}
.blocked-progress-bar-large {
   min-width: 1.7%;
}
.blocked-progress-bar-xlarge{
    width: 3px;
}

.blocked-progress-bar-small-sub {
   min-width: 4.6%;
}
.blocked-progress-bar-medium-sub {
   min-width: 1.9%;
}
.blocked-progress-bar-large-sub {
   min-width: 1.1%;
}
.blocked-progress-bar-xlarge-sub {
   min-width: 2px;
}

.progress.progress-bar-striped.blocked-progress-bar{
    display: inline-block;
}
.activitypanel-progress-bar .activitypanel-progress,
.courses-progress-bar .activitypanel-progress {
    max-height: inherit;
    height: 14px;
    margin-bottom: 1px;
    position:relative;
}

.progress-bar-gap{
    margin-right: 2px;
}

.progress-popout {
    position:absolute;
    width:300px;
}
/******************************************************/
/* Activity Panel Search */
/******************************************************/
.btn-searchresult-back{
    margin-top: -5px;
}

.btn-panel-heading{
    position: relative;
    margin-top: -23px;
    margin-right: -11px;
}

.search-result-panel .panel-title{
    cursor: pointer;
    font-size: 13px;
}

.search-result-panel .panel-heading{
    padding:0;
}

/* overriding panel type display of accordian for search results */
.search-results-body, .search-results-body .panel-body {
    padding: 0px;
}
#search_results_list {
    /* This height is set so it mimics the height of the task list.  */
    /* Ideally, these panels will just be the remaining height of the page */
    /*height:694px;*/
    overflow-x:hidden;
    overflow-y:auto;
}
.search-results-body .panel-group {
    margin-bottom:0;
}
.search-results-body .panel-heading, .search-results-body .panel {
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
}
.courses-panel-accord .panel {
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
}
.search-advanced-panel {
   /* padding:10px;*/
    min-width: 308px;
    width:100%;
}

.caret.caret-reversed {
    border-top-width: 0;
    border-bottom: 4px solid #000000;
}

.btn.advanced-search-btn {
    float: right;
    margin-top: 8px;
    margin-right: 15px;
    color: #fff;
    background-color: #5cb85c;
    border-color: #4cae4c;
}

.search-result-bcrumb {
    padding: 8px 8px 10px 10px;
    border-bottom:solid 1px #ddd;
    margin:0;
}

.search-result-bcrumb span.search-result-jumpto:not(:last-child):after {
    content:',';
}

.search-terms-date {
    font-weight: bold;
    white-space: nowrap;
}


/* for making the advanced search appear 'below' the input group' */
.z100 {
    z-index:100;
}



/******************************************************/
/* Generic Panel Items */
/******************************************************/
.lms-group {
    max-width: 500px;
    margin: 0 auto;
}
.lms-group table td .form-control.form-field-large {
    width: 100%;
}

.panel-short-int {
    width:60px;
    margin-left: 14px;
    margin-bottom: 2px;
    display: inline-block;
}

.panel-2-col {
    width:48%;
    float:left;
    margin-right:10px;
    min-height: 210px;
}

@media (max-width: 590px) {
    .panel-2-col {
        width: 100%;
    }
}
/******************************************************/
/* Journal Panel Items */
/******************************************************/
.journal-panel{
    cursor: pointer;
    border-bottom: solid 1px #eeeeee;
    clear: both;
    padding-top: 6px;
    padding-bottom: 6px;
}

.journal-panel:hover{
    background-color: #F5F5F5;
}

.glyphicon.journalpanel-item-arrow{
    margin-top: 4px;
    float: right;
    right: 7px;
}

/******************************************************/
/* Custom Panel Items */
/******************************************************/
.custom-panel .panel-body {
    padding:0;
}

/* This is for auto-hiding the scroll bar of dashboard panels in IE */
.dash-md5-col .panel-body {
    -ms-overflow-style: -ms-autohiding-scrollbar;
}

.custom-panel-item-container {
    display: flex;
    align-items: center;
}
.custom-panel .custom-panel-item-container.heading {
    padding-top:4px;
    font-weight:bold;
}
.custom-panel-arrow {
    margin-left: 15px;
}

.custom-panel .placeholder-item.no-action {
    cursor: default;
}
.custom-panel .placeholder-item.no-action .placeholder-title,
.custom-panel .placeholder-item.no-action .custom-panel-arrow {
    opacity:0.4;
}
/******************************************************/
/* Achievement Summary */
/******************************************************/
.achievement-items-container {
    overflow:hidden;
}
.achieve-outer {
    margin:0 auto 20px;
}
.achieve-item {
    text-align:center;
}
.acheive-container {
    width:200px;
    margin:0 auto;
}
.acheive-container:hover {
    cursor:pointer;
    background-color:#efefef;
    border-radius:5px;
    color:#000;
}
.achieve-title {
    text-align:center;
    font-size:18px;
    /*font-weight:bold;*/
    padding-top:8px;
}
.achieve-dash-img {
    text-align:center;
    position:relative;
}
.achieve-dash-val {
    font-size:50px;
    text-align:center;
    font-weight:bold;
    position:absolute;
/*    color:#000;*/
}

.achievementsummary-arrow{
    margin-left: 25px;
    margin-top: -9px;
    display: inline-block;
    position: relative;
    vertical-align: middle;
}

@media (max-width: 992px) {
    .col-md-4.achieve-item {
        width: 32%;
        display: inline-block;
    }

    .col-md-6.achieve-item {
        width: 49%;
        display: inline-block;
    }
}

@media (max-width: 780px) {
    .col-md-4.achieve-item {
        width: 49%;
        display: inline-block;
    }
}

@media (max-width: 518px) {
    .col-md-4.achieve-item, .col-md-6.achieve-item {
        width: 100%;
        display: inline-block;
    }
}

/******************************************************/
/* Responsive Calendar Settings */ 
/******************************************************/
/* to draw a minimum height box for calendar while page loads,
   prevents page shifting around */
#dash_calendar {
    min-height:201px; /* 4 rows of dates - e.g. Feb 2016 */
}

.ui-datepicker{ /* this may have negative side-effects */
    z-index: 2 !important;
}

.form-control.form-field-small.datepicker-input-field{
    width: 144px;
}

td.date-highlight.ui-datepicker-today a.ui-state-default.ui-state-highlight{
    background: rgba(162,162,162,0.1);
    background-image: -webkit-linear-gradient(bottom, rgba(0,0,0,.1) 0%, rgba(255,255,255,.1) 100%);
    -moz-box-shadow: inset 0 0 5px 5px rgba(147,147,147,0.0001);
    -webkit-box-shadow: inset 0 0 5px 5px rgba(147,147,147,0.0001);
    box-shadow: inset 0 0 3px 3px rgba(147,147,147,0.0001);
}

td.ui-datepicker-today {
    background: rgba(162,162,162,0.35);
    background-image: -webkit-linear-gradient(bottom, rgba(0,0,0,.35) 0%, rgba(255,255,255,.2) 100%) !important;
    -moz-box-shadow: inset 0 0 10px 10px rgba(147,147,147,0.35) !important;
    -webkit-box-shadow: inset 0 0 10px 10px rgba(147,147,147,0.35) !important;
    box-shadow: inset 0 0 8px 9px rgba(147,147,147,0.45) !important;
}

@media (min-width: 608px) and  (max-width: 991px) {
    .custom-panel{
        clear: both;
    }
    .col-md-5 .notification-panel .panel-body{
        height: 190px;
    }
}

.ll-skin-latoja {
    margin-bottom: 10px;
}

.ui-widget-content{
    border: 1px solid #ddd;
}

.ll-skin-latoja .ui-datepicker-header{
    -moz-border-radius: 3px 3px 0 0;
    -webkit-border-radius: 3px 3px 0 0;
    border-radius: 3px 3px 0 0; /* border radius */
    background-color: #f5f5f5;
    background-image: none;
    border-color: #ddd;
    padding: 8px 10px;
    font-size: 90%;
}

.ui-corner-all{
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
}

.ll-skin-latoja .ui-datepicker table{
    border-top: 1px solid #ddd;
}

.ll-skin-latoja .ui-widget{
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    width: auto;
}

.ll-skin-latoja .ui-datepicker-title{
    color: #555;
    font-weight: normal;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 14px;
}

.ll-skin-latoja .ui-datepicker-calendar .ui-state-hover {
    background-image: none;
    -webkit-box-shadow: inset 0 0 20px #cbcbcb;
    -moz-box-shadow: inset 0 0 20px #cbcbcb;
    box-shadow: inset 0 0 20px #cbcbcb;
}

.ll-skin-latoja .ui-datepicker-calendar td.date-highlight .ui-state-hover {
    background-image: none;
    -webkit-box-shadow: inset 0 0 20px #a4a4a4;
    -moz-box-shadow: inset 0 0 20px #a4a4a4;
    box-shadow: inset 0 0 20px #a4a4a4;
}

td.date-highlight, .date-highlight a.ui-state-default{
    background-color: rgb(154, 205, 50);
}
td.ann-highlight a.ui-state-default,
.ll-skin-latoja .ui-datepicker-calendar td.ann-highlight a.ui-state-hover {
    background-image:url(../images/circle_c1c1c1.png);
    background-position:center center;
    background-repeat:no-repeat;
}
td.ann-highlight.date-highlight a.ui-state-default,
.ll-skin-latoja .ui-datepicker-calendar td.ann-highlight.date-highlight a.ui-state-hover {
    background-image:url(../images/circle_9f9f9f.png);
    background-position:center center;
    background-repeat:no-repeat;
}
td.ann-highlight.ui-datepicker-today a.ui-state-default.ui-state-highlight,
.ll-skin-latoja .ui-datepicker-calendar td.ann-highlight.ui-datepicker-today a.ui-state-hover {
    background-image:url(../images/circle_6d6d6d.png);
    background-position:center center;
    background-repeat:no-repeat;
}

.ll-skin-latoja .ui-datepicker-header .ui-state-hover {
    background: rgba(220,220,220, 0.8);
}

.ll-skin-latoja td.date-highlight a {
    color: #fff;
}

.ll-skin-latoja .ui-datepicker .ui-datepicker-prev, .ll-skin-latoja .ui-datepicker .ui-datepicker-next{
    height: 38px;
    line-height: 38px;
}
.ll-skin-latoja .ui-datepicker .ui-datepicker-prev:hover, .ll-skin-latoja .ui-datepicker .ui-datepicker-next:hover{
    height: 38px;
}

.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {
    font-size: 12px;
}

.ui-datepicker select.ui-datepicker-month {
    margin-right: 1px;
}

.ui-datepicker select.ui-datepicker-year {
    margin-left: 1px;
}

a.ui-datepicker-next.ui-corner-all, a.ui-datepicker-prev.ui-corner-all {
    border: none;
}

a.ui-datepicker-next.ui-corner-all.ui-state-hover.ui-datepicker-next-hover, a.ui-datepicker-prev.ui-corner-all.ui-state-hover.ui-datepicker-prev-hover {
    min-height: 31px;
}

/******************************************************/
/* for showing jQuery UI datepickers in modals
   (this class is added or removed beforeShow) */
/******************************************************/
.datepicker-in-modal {
    z-index:10000 !important;
}

/******************************************************/
/* Event Calendar Scheduler */
/******************************************************/
.event-schaduler .panel-body{
    padding: 0px;
}

.selected-event-date{
    text-align: center;
    padding: 10px 5px;
}

.event-scheduler-footer{
    cursor:pointer;
    color: #333;
    background-color: #f5f5f5;
    border-color: #ddd;
    text-align: center;
    height: 41px;
    padding: 10px 15px;
    border-top: 1px solid #d3d3d3;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}

.event-scheduler-footer:hover{
    background-image: -moz-linear-gradient(bottom, rgba(0,0,0,.12) 0%, rgba(255,255,255,.06) 100%);
    background-image: -o-linear-gradient(bottom, rgba(0,0,0,.12) 0%, rgba(255,255,255,.06) 100%);
    background-image: -webkit-linear-gradient(bottom, rgba(0,0,0,.12) 0%, rgba(255,255,255,.06) 100%);
    background-image: -webkit-linear-gradient(bottom, rgba(0,0,0,.12) 0%, rgba(255,255,255,.06) 100%);
}

.event-scheduler-item{
    cursor: pointer;
    border-bottom: solid 1px #eeeeee;
    display: flex;
    align-items: center;
    padding: 5px 0px;
}

.event-scheduler-item:hover{
    background-color: #F5F5F5;
}

.event-scheduler-noevent{
    padding-left: 10px;
}

/* for SR glyphicons used in calendar day task list */
.event-scheduler-item .event-scheduler-type {
    font-size:26px;
}

.calevent-arrow {
    width: 20px;
}

.calevent-glyphicons {
    padding-left: 5px;
    width: 40px;
}

.calevent-glyphicons span.glyphicon.glyphicon-PM {
    border: none;
    padding: 0px;
    border-radius: 0;
}

.calevent-glyphicons span.glyphicon.glyphicon-PM:hover {
    border: none;
    background-color: #F5F5F5;
}

.event-scheduler-item-back, .event-scheduler-item-next{
    cursor: pointer;
    width: 16px;
    height: 16px;
}

.event-scheduler-item-back{
    float: left;
    background-image: url(images/ui-icons_454545_256x240.png);
    background-position: -96px -16px;
}
.event-scheduler-item-next{
    float: right;
    background-image: url(images/ui-icons_454545_256x240.png);
    background-position: -32px -16px;
    margin-top: 3px;
}

.return-to-calendarbtn{
    margin-left: 6px;
    font-size: 15px;
    padding: 1px 1px;
}

a:hover#datepicker_prev_day, a:hover#datepicker_next_day{
    background-color: rgba(220,220,220, 0.8);
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom: none;
}

/******************************************************/
/* Catalogue Calendar Page Settings */
/******************************************************/
tr.calendarDetail>td{
    font-size: 85%;
    padding: 12px;
}

table.expanded-calendar-details{
    margin-top: 5px;
    border: 1px solid #e3e3e3;
    border-collapse: separate;
    border-radius: 6px;
    background-color: #f5f5f5;
    margin-bottom: 10px;
}

.cat-cal-item-icon {
    display:inline;
}

.catcal-result-itemtitle{
  margin-left: 5px;
  font-size: 12px;
}

.catcal-tt-icons, .catcal-enrolbtn {
    min-width: 90px;
}

.catcal-startendtime {
    min-width: 160px;
}

.catcal-itemtitle {
    min-width: 150px;
}

table.catalogcalendar-result.table>tbody>tr>td{
    border-top: 1px solid #fff;
}

table.catalogcalendar-result.table>tbody>tr.dataLabel>td{
    border-top: 1px solid #eee;
}

/* would ideally love for this to go away */
input[type=radio]{
    margin: 4px 5px 0px 0px;
}

.radio-inline input[type="radio"],
.checkbox-inline input[type="checkbox"] {
    margin-top: 0.19em; /* For use with text font-size 13px. For sites with 14px override this to BS normal. */
    width: 1em;
    height: 1em;
}

td.Data input[type=radio]{
/*    margin: 10px;*/
    margin-right: 3px;
    margin-left: 4px;
}

.cat-result-sort{
    margin-top:3px;
}

/******************************************************/
/* Placeholder Settings */
/******************************************************/
.placeholder-item {
    padding: 8px;
    border-bottom:solid 1px #ddd;
    cursor:pointer;
}
.placeholder-item.full-img-shortcut {
    padding:0;
}
.placeholder-item.no-pointer {
    cursor:default;
}
.placeholder-item:not(.no-action):hover{
    background-color: #F5F5F5;
}

.placeholder-icons{
    margin-right: 10px;
    font-size: 20px;
}

.placeholder-title {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.placeholder-date{
    margin-left: 15px;
    min-width: 90px;
    font-weight: bold;
}

/******************************************************/
/* jcarousel Annoucement item */
/******************************************************/
.jcarousel li {
    width: 338px;
    max-height: 134px;
}

/* Announcement carousel to be hidden at <992 px */
@media (max-width: 992px){
    #announce_container {
        display: none;
    }
    .top-gap.no-announce {
        display:block !important;
        height:15px;
    }
}

@media (max-width: 419px){
    .jcarousel li {
        width: 310px;
    }
}

.jcarousel-item{
    height: 130px;
    position: relative;
}

.jcarousel ul>li>div.panel{
    margin-bottom: 0px;
}

.panel-body.jcarousel-item:hover{
    background-color: #F5F5F5;
    border-radius: 3px;
}

.panel-body.jcarousel-item:hover img{
    -webkit-filter: opacity(65%);
    opacity: 0.4;
}

.panel-body.jcarousel-item:hover span.announce-ellipsis{
/*    background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(#f5f5f5), color-stop(49%, #f5f5f5));
    background: -moz-linear-gradient(to right, rgba(255, 255, 255, 0), #f5f5f5 49%, #f5f5f5);
    background: -o-linear-gradient(to right, rgba(255, 255, 255, 0), #f5f5f5 49%, #f5f5f5);
    background: -ms-linear-gradient(to right, rgba(255, 255, 255, 0), #f5f5f5 49%, #f5f5f5);*/
    background: -webkit-gradient(linear, left top, right top,
    from(rgba(255, 255, 255, 0)), to(#f5f5f5), color-stop(50%, #f5f5f5));
    background: -moz-linear-gradient(to right, rgba(255, 255, 255, 0), #f5f5f5 50%, #f5f5f5);
    background: -o-linear-gradient(to right, rgba(255, 255, 255, 0), #f5f5f5 50%, #f5f5f5);
    background: -ms-linear-gradient(to right, rgba(255, 255, 255, 0), #f5f5f5 50%, #f5f5f5);
    background: linear-gradient(to right, rgba(255, 255, 255, 0), #f5f5f5 50%, #f5f5f5);
}


.jcarousel-item-thumbnail{
    float: left;
    margin-left: -8px;
}

.jcarousel-item-thumbnail.thumbnail-large{
    width: 100px;
    height: 100px;
    margin-top: 5px;
    margin-left: -5px;
}

.jcarousel-item-thumbnail.thumbnail-small{
    width: 50px;
    height: 50px;
}

.jcarousel-item-verticalline{
    float: left;
    border-left: 1px dotted #ccc;
    height: 100%;
    padding-right: 6px;
    margin-left: 6px;
}

.jcarousel-item-info-large{
    padding-left: 100px;
}

.jcarousel-item-info-small{
    padding-left: 50px;
}

.jcarousel-item-header{
    font-weight: bold;
    font-size: 14px;
    color: rgb(0, 153, 51);
    margin-bottom: 5px;
}

.jcarousel-item-text{
    font-size: 12px;
    height: 78px;
    overflow: hidden;
}

.jcarousel-item-horizontalline{
    border-top: 1px dotted #ccc;
    width: 100%;
    margin-bottom: 5px;
    margin-top: 5px;
}

.jcarousel-item-readmore{
    position: absolute;
    right: 5px;
    bottom: 4px;
}


/******************************************************/
/* small (25 x 25) icons */
/******************************************************/
.icon-with-tt span[class^="sr-icon-"],
.icon-with-tt span[class*=" sr-icon-"] {
    font-size: 25px;
    border: 2px solid #333;
    padding: 3px;
    border-radius: 25px;
}

/* even as I do this, I'm not sure if it should be the anchor instead that has margin, rather
   than the icon. But ... until we change all custon glyphicons to sr-icons, this is a better
   target since adding margin to anchor will double up from margin added to glyphicons ~:4704 */
a.icon-with-tt span[class^="sr-icon-"],
.icon-with-tt span[class*=" sr-icon-"] {
    margin-right: 3px;
    color:#444;
}
.icon-with-tt.icon-disabled span[class^="sr-icon-"],
.icon-with-tt.icon-disabled span[class*=" sr-icon-"] {
    border-color:#ccc;
    color:#ccc;
}


/* task flag icons, used to indicate special item statuses */
.task-flag-icon {
    position: absolute;
    margin-top: -5px;
    margin-left: 1px;
    width: 18px;
}
.task-flag-icon span {
    margin-left: 1px;
    float: left;
    margin-top: 2px;
}
.sr-icon-IM, .sr-icon-SP {
    font-size: 14px;
}
.sr-icon-EX {
    color: #c00;
}
.sr-icon-SP {
    color: #900;
}
.sr-icon-IM {
    color: #0073e9;
}
.sr-icon-AFMD {
    color: #d0a400;
}
.sr-icon-R {
    color: #18bc55;
}
.sr-icon-waitlist {
    color: #ff6600;
}
.sr-icon-A {
    color: #0073e9;
}
span.row-cell-count-icon {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    cursor: default;
}
span.row-cell-count-val {
    line-height: 16px;
    font-size: 11px;
    vertical-align: top;
    text-align: center;
    display: inline-block;
    width: 100%;
}
.count-icon-rtu-F {
    background-color:#43a33e;
    color:#fff;
}
.count-icon-rtu-C {
    background-color:#e38405;
    color:#fff;
}
.count-icon-rtu-N {
    background-color:#cd1010;
    color:#fff;
}
.count-icon-rtu-I {
    background-color:#50c7e5;
    color:#fff;
}
/******************************************************/
/* Loading animation */
/******************************************************/
.spinner-container {
    margin:40px auto 10px;
    width:80px;
    height:80px;
    background-image:url(../images/spinner.gif);
    background-size:100%;
}

.spinner-option .spinner-container {
    width:25px;
    height:25px;
    margin:3px auto;
}
.modal-search-load-bg,
.accord-item-body-load-bg,
.panel-body-search-bg,
.panel-body-load-bg,
.oa-panel-load-bg {
    position: absolute;
    background-color: rgba(255,255,255,0.75);
    width: 100%;
    top: 0;
    height: 100%;
    left: 0;
    z-index: 2;
}
.oa-panel-load-bg {
    z-index:20;
}
.modal-search-load-bg {
    min-height: 100px;
}

.loading-msg {
    margin: 0 auto;
    width: 320px;
    text-align: center;
    font-size: 20px;
}
/* for dynamic ajax elem loading */
.elem-loading-spinner {
    display: inline-block;
    margin-left: 8px;
    vertical-align: middle;
}
.elem-loading-spinner .spinner-container {
    display: inline-block;
    width: 18px;
    height: 18px;
    margin: 0;
}


/* animated ellipsis */
.lds-ellipsis {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
}
.lds-ellipsis div {
    position: absolute;
    top: 33px;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: #fff;
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.lds-ellipsis div:nth-child(1) {
    left: 8px;
    animation: lds-ellipsis1 0.6s infinite;
}
.lds-ellipsis div:nth-child(2) {
    left: 8px;
    animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(3) {
    left: 32px;
    animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(4) {
    left: 56px;
    animation: lds-ellipsis3 0.6s infinite;
}
@keyframes lds-ellipsis1 {
    0% {
        transform: scale(0);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes lds-ellipsis3 {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(0);
    }
}
@keyframes lds-ellipsis2 {
    0% {
        transform: translate(0, 0);
    }
    100% {
        transform: translate(24px, 0);
    }
}

.change-org-spinner .spinner-container {
    margin-top: 20px;
}
.change-org-spinner {
    margin-bottom: 20px;
}
/************************Style for NavBars ******************************/
.logo-link, .logo-link:hover {
    text-decoration:none !important;
    border:none !important;
}
/******************************************************/
/* -- main tabs -- */
/******************************************************/
.nav-tabs>li.active>a, .nav-tabs>li.active>a:hover, .nav-tabs>li.active>a:focus {
    background-color: #F5F5F5;
}

h3{
    color: #777;
    font-size: 17px;
}

.panel-heading h3{
    font-size: 14px;
    font-weight: normal;
}

.nav-tabs>li>a, h5{
    color: #909090;
}

.dl-horizontal dd{
    width: 30%;
}

/* These were added in 2014 & 2015 respectively. Not sure why, but they can be problematic 
   - in particular when elements near bottom of page dynamically appear and need to grow
   outside panel bounding box */
.tab-pane .panel-body {
   /* overflow-y: auto;
    overflow-x: hidden;*/
}

.dl-horizontal dt {
    text-align: left;
}

/* Sandra - need to re-initialise this so it's less far-raching. */
.glyphicon{
    margin-right: 5px;
}

/* Sandra - need to re-initialise this so it's less far-raching. */
/* have started this as part of replacing glyphicons with sr-icons */
.panel-body .glyphicon, .panel-body .panel-action-icons{
    margin-right: 3px;
    color: #333;
}

.panel-title .glyphicon, .panel-body .panel-action-icons, .btn-float-right{
    float: right;
}

/* Removing font-size:inherit since h3's inside panel headings should use 
   .panel-title class per bootstrap standard */
.panel-heading h3 {
    margin:0;
    padding:0;
    /*font-size:inherit;*/
}

.form-horizontal .control-label {
    text-align: left;
}

.form-horizontal .col-sm-10, td.data.col-sm-10{
    width: 64.333333%;
}

.form-horizontal .col-sm-2, td.DataLabel.col-sm-2{
    width: 35.666667%;
}

/********* Learner Header Details & Induction Curriculum Request **********/
label.col-sm-2.control-label.lr-header-label, .form-group.induction-curr-req label.col-sm-2.control-label.dataLabel{
    width: 20.66667%;
}

.form-btn-left{
    float: left;
    margin-top: 20px;
    margin-bottom: 20px;
}

.form-btn-right{
    float: right;
    margin-top: 20px;
}

.table .popover, .form-horizontal .control-label .popover{
    width: 245px;
    height: auto;
    text-decoration: none;
}

.form-horizontal .control-label .popover{
    width: 170px;
    display: block;
    top: 25px;
    left: 0px;
}

.radio-inline.radio-btn {
    margin-right: 15px;
    margin-left: 0px;
}

.radio-inline input[type=checkbox]{
    margin-left: -25px;
}

.faq-back-totop-btn{
    float: right;
}

.faq-ans, .client-req-error, .text-justify-align {
    text-align: justify;
}

.curr-actionicons {
    padding: 10px 0px;
    display: table;
    width: 100%;
}

/******************************************************/
/* Catalogue Homepage */
/******************************************************/
#cat_show_homepage {
    display:none;
}
/******************************************************/
/* Catalogue items */
/******************************************************/
.catalog-section-description {
    margin: -15px -15px 10px -15px;
    background-color: #fafafa;
    padding: 15px;
}
.cat-sess-table-outer>tbody>tr:first-child>td {
    border-top: 0;
}
.cat-item-session-container .panel-body {
    padding: 8px;
}
.browse-cat-secondary-desc {
    margin-top: 5px;
}
.catalog-item-force-open,
.catalog-item {
    border:solid 1px transparent;
    margin-top:10px;
    border:solid 1px #efefef;
    -webkit-border-radius:8px;
    cursor:pointer;
    background-color: #fdfdfd;
}
.catalog-item-force-open,
.catalog-item-noexpand {
    cursor: default !important;
}

.catalog-item:hover {
    border:solid 1px #efefef;
    background-color:#f9f9f9;
    -webkit-border-radius:8px;
    -moz-border-radius:8px;
    border-radius:8px;
}

.cat-item-header {
    overflow:hidden;
}

.cat-item-title h5 {
    margin:0 0 4px 50px;
    padding-top: 12px;
    color: #696969;
}
.catalog-item-force-open .cat-item-header a:hover,
.catalog-item .cat-item-header a:hover {
    border-bottom: none;
}

.catalog-item-article:hover .cat-item-title h5 {
    text-decoration:none;
}

.cat-heading h4 {
    font-size:12px;
}
.cat-item-shortlinks {
    float:right;
    padding: 15px 8px;
}
.cat-item-overview {
    margin-bottom: 7px;
    text-align: justify;
}
.cat-item-fld-lbl,
.cat-item-fld-lbl-inline {
    font-weight:bold;
}
.cat-item-fld-lbl-inline {
    display: inline-block;
    padding-right: 8px;
}
.cat-item-showhide {
    margin-top: 2px;
}
.cat-item-cost {
    padding:4px 0;
}

.cat-item-icon {
    font-size:43px;
    display:inline;
    float:left;
}
.panel-brochure-desc p {
    overflow-wrap: break-word;
}

.table>tbody>tr>td.cat-item-icon-td{
    padding: 3px 0px;
}
.table>tbody>tr>td.cat-cell-brochure {
    padding: 15px 8px;
}

.cat-item-body {
    clear:both;
}
.cat-item-session-container {
    clear:both;
}
.cat-item-session-container .panel-group {
    max-width:100%;
    margin:5px 0 15px;
}
.cat-item-session-container .panel-heading,
.cat-item-curr-container .panel-heading {
    padding:0;
}
.cat-panel-heading {
    padding:8px;
}
.accordian-chev {
    top: 8px;
}
.cat-sess-body .panel-body {
    padding:0;
}
.cat-sess-table td {
    vertical-align: top;
    padding:0 4px;
}
.cat-sess-table td.cat-sess-title {
    padding-bottom: 4px;
}
.cat-sess-title a:hover{
    border-color: #fff;
}

.cat-trcred-tbl td {
    padding:3px 8px;
    background-color: #f6f6f6;
}
.cat-trcred-tbl tr:first-child td {
    border-top: solid 1px #ddd;
}
.cat-trcred-tbl .item-end {
    border-bottom: solid 1px #ddd;
}
.cat-trcred-val {
    text-align: right;
}
.cat-cell-brochure a.icon-with-tt>.glyphicon {
    font-size:16px;
}
.cat-curr-item-btn {
    text-align: right;
    margin-bottom: 8px;
}
td.cell-ses-enrol {
    text-align: center;
    vertical-align: middle;
    padding-top: 10px;
}

@media (min-width: 992px){
    .equal, .equal > div[class*='col-'] {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        /*flex:1 1 auto;*/
    }
    .equal .panel {
        width:100%;
    }

    .usr-sess-brochure.row{
        margin-right: 0px;
    }
}

.catalog-item-force-open div.cat-item-header,
.catalog-item div.cat-item-header,
.catalog-item-force-open div.cat-item-body,
.catalog-item div.cat-item-body,
.induction-curr-form {
    padding: 8px;
}
.catalog-item-force-open div.cat-item-header,
.catalog-item div.cat-item-header {
    padding-bottom: 0px;
}

.catalog-item-force-open div.cat-item-body,
.catalog-item div.cat-item-body {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.cat-item-arrow{
    background-color: #f1f1f1;
    padding-bottom: 0px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    padding: 5px;
    height: 24px;
    border-top: solid 1px #efefef;
}

.browse-cat-title {
    font-size: 15px;
    color:#666;
}
.browse-cat-title .glyphicon {
    color:#666;
}
span.glyphicon.glyphicon-info-sign.glyphicon-catalogueresult{
    font-size: 17px;
    position: relative;
    top: 4px;
}

.cat-item-section-container {
    clear: both;
}
.catalog-recommend-btns {
    float:right;
}
.catalog-recommendations-header .alert {
    max-width: 100%;
}
.cat-item-arrow .cat-item-arrow-text {
    line-height: 13px;
    float:right;
    display: none;
}
.cat-item-arrow:hover .cat-item-arrow-text {
    display: inline-block;
}
.cat-prereq-panel .panel-body {
    padding: 0;
}
.cat-pre-req-item {
    padding: 8px;
    position: relative;
    padding-right: 28px;
}
.cat-pre-req-item.no-pre-req {
    background-color: #f3e2e2;
}
.cat-pre-req-item.no-pre-req:not(:last-child) {
    border-bottom: solid 1px #ddc1c1;
}
.cat-pre-req-item.no-pre-req .cat-pre-req-alert-icon {
    color: #a76767;
}
.cat-pre-req-item.no-pre-req a {
    color: #7e2d2d;
}
.cat-pre-req-item.no-pre-req a:hover {
    border: none;
}
.cat-pre-req-alert-icon {
    position: absolute;
    right: 5px;
    top: 30%;
}
.cat-pre-req-alert-icon .mdi {
    font-size: 22px;
    line-height: 12px;
}
/******************************************************/
/* New-look categories (for end user UI) */
/******************************************************/
.catalog-global-curr-outer,
.catalog-categories-outer {
    border:solid 1px #ddd;
    border-radius:4px;
    padding:10px;
    margin-bottom:10px;
}
.catalog-categories-outer .row.primary-category-row {
    margin-bottom: 10px;
}
.catalog-categories-outer.news-item .row:last-child,
.catalog-categories-outer.news-item .row p:last-child{
    margin-bottom:0;
}
.catalog-categories-outer h6 {
    font-size:15px;
    font-weight:bold;
    color:#666;
    margin-top:0;
}
.cat-item-container {
    border:solid 1px #ddd;
    border-radius:4px;
}
.catalog-categories-outer.secondary-category .cat-item-container,
.cat-split-row .cat-item-container {
    margin-bottom:8px;
}
.cat-item-head {
    box-sizing:content-box;
    border-bottom:solid 1px #ddd;
    background-color:#f5f5f5;
    border-top-left-radius:3px;
    border-top-right-radius:3px;
    padding:5px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    min-height: 32px;
}
.cat-item-head.no-children {
    border-bottom:0;
}
.cat-item-head.no-children.no-desc {
    border-bottom-left-radius:3px;
    border-bottom-right-radius:3px;
}
.cat-item-head-text {
    display:inline-block;
    padding-left: 8px;
}
.cat-item-head-icon {
    display:inline-block;
}
.cat-item-icon {
    float:left;
}
.cat-item-head img {
    max-height:30px;
    max-width:30px;
}
.category-title-link {
    text-decoration:none;
    font-weight:bold;
    font-size:13px;
}
.cat-item-body ul {
    padding-left:0;
    margin-bottom:0;
}
.cat-item-body .extra-cat ul {
    margin-top:0;
}
.catalog-item-force-open .cat-item-body ol,
.catalog-item-force-open .cat-item-body ul,
.catalog-item .cat-item-body ol,
.catalog-item .cat-item-body ul {
    padding-left:15px;
    margin-bottom: 0;
    margin-top: 8px;
}
.catalog-categories-outer .cat-item-body li {
    position:relative;
    box-sizing:border-box;
    display:block;
    padding:0;
    cursor:pointer;
    border-bottom:solid 1px #eee;
}
.cat-item-body li:last-child {
    border-bottom:none;
}
.cat-item-body .extra-cat li:first-child {
    border-top:solid 1px #eee;
}
.cat-item-body li a {
    text-decoration:none;
    display:block;
    padding:8px;
}
.cat-item-body li span:hover,
.cat-item-body li a:hover {
    text-decoration:none;
    border-bottom:0;
    background-color:#fcfcfc;
}
.cat-child-more {
    border-top:solid 1px #eee;
}
.cat-child-more span {
    display:block;
    padding:8px;
    font-weight:bold;
}
.cat-news-media img {
    width:100%;
    max-width:300px;
}
.cat-description,
.cat-subcats {
    padding-top: 8px;
}

@media (max-width:992px) {
    .catalog-global-curr-outer .row,
    .catalog-categories-outer .row {
        margin-bottom: 0;
    }
    .catalog-global-curr-outer .row .col-md-3,
    .catalog-categories-outer .row .col-md-3,
    .catalog-categories-outer .row .col-md-6 {
        margin-bottom:10px;
    }
}
@media (min-width:993px) {
    .catalog-global-curr-outer .col-md-3 {
        margin-bottom: 10px;
    }
}
.catalog-panel-title {
    display: inline-block;
}
.catalog-panel-title.bcrumb a {
    text-decoration: none;
    border-bottom-color: transparent;
}
.catalog-panel-title.bcrumb a {
    text-decoration: none;
    border-bottom-color: inherit;
}
.catalog-section-sub-cat-links {
    padding-top: 8px;
}
.catalog-section-sub-cat-links a {
    padding: 6px 10px;
    border-radius: 5px;
    display: inline-block;
    margin-bottom: 10px;
    margin-right: 20px;
    border: 0;
}
.catalog-section-sub-cat-links a:hover {
    border:0;
}

/******************************************************/
/* Items in the Catalogue Category */
/******************************************************/
.row.catalogue-category-items-row  {
    margin-right: 0px;
    margin-left: 0px;
}

.catalogue-category-item-icon {
    float: left;
    margin-right: 10px;
}

@media (max-width: 768px) {
    .row.catalogue-category-items-row .col-sm-3 , .row.catalogue-category-items-row .col-sm-6 {
        clear: both;
    }
}

/******************************************************/
/* Items in the Outcome DEtails Table */
/******************************************************/
.course-buttons{
    width: 30px;
}


.table-icons>img{
    width: 35px;
    height:35px;
    margin-top: -2px;
}

.enrol-course, .delete-course, .view-course, .upload-course{
    width: 43px;
    height: 32px;
    float: right;
    margin-top: 3px;
}

.enrol-course{
    background-image: url('img/enrol-icon.png');
}

.delete-course{
    background-image: url('img/delete-icon.png');
}

.view-course{
    background-image: url('img/viewdoc-icon.png');
}

.upload-course{
    background-image: url('img/upload-icon.png');
}

.enrol-course:hover{
    background-image: url('img/enrol-icon-hover.png');
}

.delete-course:hover{
    background-image: url('img/delete-icon-hover.png');
}

.view-course:hover{
    background-image: url('img/viewdoc-icon-hover.png');
}

.upload-course:hover{
    background-image: url('img/upload-icon-hover.png');
}

.form-inline .form-group .input-group {
    max-width: 350px;
    margin-right: 10px;
}

/* Commenting this out for now - affecting dashboard modal openings
@media (min-width: 768px){
    .modal-dialog {
        width: 800px;

    }
}
*/
@media (max-width: 580px){
    .form-btn-left {
        float: right;
    }
}

@media (max-width: 780px) {
    .nav-tabs > li {
        float:none;
        border:1px solid #dddddd;
    }
    .nav > li > a:hover, .nav > li > a:focus,
    .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus
     {
        border:none;
    }
    .tab-pane .panel-body .panel-group{
        max-width: 100%;
    }
}

@media (min-width: 780px) and (max-width: 992px){
    .tab-pane .panel-body .panel-group .col-sm-10 {
        width: 70.333333%;
        margin-left: 30px;
    }
}

/******************************************************/
/* Items in the Outcome DEtails Table */
/******************************************************/

/* jQuery overrides/additional */
.ui-state-default{ max-height: 30px; }
.ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
.ui-timepicker-div dl { text-align: left; margin-top: 20px; margin-bottom: 20px;}
.ui-timepicker-div dl dt { margin-bottom: -19px; padding-left: 3px;}
.ui-timepicker-div dl dd { margin: 0 10px 10px 80px;}
.ui-timepicker-div td { font-size: 90%; }
.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }

.ui-timepicker-rtl{ direction: rtl; }
.ui-timepicker-rtl dl { text-align: right; }
.ui-timepicker-rtl dl dd { margin: 0 65px 10px 10px; }

.ui-datepicker th {background-color:inherit;}

.ui-widget-header .ui-state-disabled{
    background-image: none !important;
}

/******************************************************/
/* Profile & Setting Dropdowns in the Header */
/******************************************************/
@media (max-width: 780px){
    .navbar.navbar-default.navbar-fixed-top.hidden-md.hidden-lg{
        height: 52px;
    }

    nav.navbar.navbar-default.mainmenu{
        height: 52px;
    }

   #settings_dropdown, #profile_dropdown{
        display: none;
    }
}

@media (max-width: 992px){
    #settings_dropdown a.dropdown-toggle{
        height: 51px;
        padding-top: 14px;
    }

    #profile_dropdown a.dropdown-toggle{
        height: 51px;
    }
}

@media (min-width: 992px){
    .profilename-with-icon{
        margin-top: -4px;
        height: 54px;
    }

   div#profile_options{
        display: none;
    }
}

#settings_dropdown span.glyphicon.glyphicon-cog{
    top: 2px;
}

#profile_dropdown{
    padding-left: 8px;
}

#help_header_item{
    padding-right: 15px;
}

nav.navbar.navbar-default.mainmenu{
    height: 52px;
}

/*** Profile Dropdown without a profile photo ***/
.navbar-default .navbar-nav>.dropdown.open>a, .navbar-default .navbar-nav>.dropdown.open>a:hover, .navbar-default .dropdown.navbar-nav>.open>a:focus{
  height: 50px;
}

/*** Profile Dropdown with a profile photo ***/
.navbar-default .navbar-nav>.dropdown.profilename-with-icon.open>a, .navbar-default .navbar-nav>.dropdown.profilename-with-icon.open>a:hover, .navbar-default .navbar-nav>.dropdown.profilename-with-icon.open>a:focus{
  height: 55px;
}

.navbar-default .navbar-nav>.dropdown.open>a, .navbar-default .navbar-nav>.dropdown.profilename-with-icon.open>a{
    border: none;
}

#profile_dropdown{
    margin-left: -12px;
}

.btn-group.open a.icon-with-tt.dropdown-toggle {
    box-shadow: none;
}

a.dropdown-toggle:not(.btn-icon-dropdown):hover{
    border-bottom: 0em;
}

.profile-icon-small{
    width: 30px;
    height: 30px;
    margin-right: 4px;
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: 99em;
    border: 1px solid #eee;
    box-shadow: 0 3px 2px rgba(0, 0, 0, 0.3);
    /*object-fit: cover;
    object-position: 30% 50%;*/
}

.dropdown{
    border-bottom: none;
}

/* UAT (test) site indicator - top of page */
.nav-uat-title {
    float:right;
    margin:10px 20px 0 0;
}
.uat-title {
    padding:2px 15px;
    background-color:#e5cbcb;
    border:solid 1px #9a5e5e;
    border-radius:5px;
    color:#9a5e5e;
    font-weight:bold;
    letter-spacing:1px;
    font-size:17px;
    text-transform:uppercase;
}

@media (max-width: 992px) {
    .nav-uat-title {
        margin-right:10px;
    }
    nav.mainmenu .nav-uat-title {
        display:none;
    }
}

/******************************************************/
/* Profile & Setting Dropdowns in the Footer */
/******************************************************/
.container.footer-container li{
    list-style: none;
}

.downloads-dropdown-menu{
    position: absolute;
    bottom: 100%;
    top: auto !important;
    right: 0px;
}

.footer-dropdown{
    position: absolute;
    bottom: 100%;
    top: auto !important;
    right: 0px;
    left: auto;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
}

@media (max-width: 992px){
    .footer-dropdown{
        right: 10px;
    }
}

.footer-dropdown li{
    font-size: 15px;
}

.footer-dropdown li.dropdown-header{
    font-size: 13px;
    padding-bottom: 0px;
    padding-top: 10px;
}

.footer-dropdown li.footer-dropdown-header-small{
    font-size: 11px;
}

.dropdown-footer-info{
    font-size: 10px;
    margin-top: 5px;
    padding-bottom: 5px;
    color: #999;
}
.footer-support-msg {
    padding-left: 20px;
    padding-right: 20px;
    white-space: nowrap;
}


.cfg-support-msg {
    padding:0 20px;
}
.cfg-support-email,
.cfg-support-phone {
    white-space:nowrap;
    font-size:13px;
    padding-top:3px;
}
.dropdown-footer-info.cfg-support-msg {
    font-size:12px;
}
.cfg-support-msg .mdi:before { /* this will eventually be handled by removing MDI bootstrap shims */
    font-size:20px;
    left:0;
}
.cfg-support-phone-val,
.cfg-support-msg a {
    margin-left:8px;
}
/******************************************************/
/* LMSHelper.cgi Settings */
/******************************************************/
.drpdown-footer-n6logo{
    width: 50px;
}
.help-infopanel .mdi {
    position: relative;
    top: 2px;
    vertical-align: middle;
}
.help-infopanel .help-val {
    display:inline-block;
    padding-left:8px;
}
.help-infopanel .cfg-support-msg {
    padding-left:0;
    padding-right:0;
}
.help-infopanel .dropdown-footer-info:first-child {
   margin-top:0;
}
/******************************************************/
/* PM SkillAssess */
/******************************************************/
input.sar-radio {
    margin-top:4px !important;
}
.sar-rating-cell {
    width:220px;
}
@media (max-width: 768px){
    .sar-rating-cell {
        width:180px;
    }
}
.sar-item-title {
    font-weight:bold;
    margin-bottom:4px;
}
.sar-item-desc {
    font-style:italic;
    margin-bottom:4px;
    color:#333;
}
.sar-item-behav-trigger {
    margin-bottom:4px;
}

.sar-item-behav-text {
    display:none;
    color:#333;
}
.sar-behav-chevron {
    margin-left:4px;
}
.sar-pf-behav-heading {
    font-weight:bold;
    display:none;
}
.table>tbody>tr>td.sar-key-action-cell {
    padding:0;
}
.sar-key-action {
    padding:10px;
    min-height:90px;
}
.sar-key-action textarea {
    margin-bottom:25px
}
.sar-rating-print {
    padding: 0 5px 5px;
}
.sar-key-action-title {
    font-weight:bold;
    margin-bottom:4px;
}

/******************************************************/
/* catalog homepage Settings */
/******************************************************/
#catalog_homepage_old, #catalog_inst_led_course_old{
    display: none;
}

.well.search-filter-section{
    padding: 7px;
    margin-bottom: 10px;
}

.well.advanced-search {
    margin-top: 14px;
    margin-bottom: 7px;
}

.well.advanced-search table tbody tr td{
    padding-bottom: 10px;
}

.well.search-result-options{
    height: 46px;
    border-radius: 0px;
    padding:0 10px;
    margin:15px 0 0;
}

a.search-result-link {
    margin-right: 2px;
}
a.search-result-firstpage-link {
    margin-right: 6px;
}
a.search-result-lastpage-link {
    margin-left: 6px;
}

table.basicTable.catalogue-filter-section, table.basicTable.catalogue-calendar-filter-section{
    width: 100%;
}

.form-control.cat-fld-keywords {
    width: 35%;
}
.form-control.cat-fld-objtype {
    width: 35%;
}
.with-recommend .form-control.cat-fld-objtype {
    width: 30%;
}

@media (min-width: 770px) and (max-width: 1200px){
    table.basicTable.catalogue-filter-section, table.basicTable.catalogue-calendar-filter-section{
        width: 70%;
    }
}

@media (min-width: 586px) and (max-width: 770px){
     table.basicTable.catalogue-filter-section>tbody>tr>td{
        display: inline-block;
        width: 20%;
    }

    table.basicTable.catalogue-calendar-filter-section>tbody>tr>td{
        display: inline-block;
        width: 35%;
    }
}

@media (max-width: 735px){
    table.basicTable.catalogue-calendar-filter-section>tbody>tr>td{
        display: block;
        width: 100%;
    }

    table.basicTable.catalogue-calendar-filter-section>tbody>tr>td .form-control.form-field-small{
        display: block;
    }

    .catcal-submitbtn{
        margin-top: 5px !important;
    }
}

@media (max-width: 586px){
     table.basicTable.catalogue-filter-section>tbody>tr>td{
        display: block;
        width: 100%;
    }

    table.basicTable.catalogue-filter-section>tbody>tr>td .form-control.form-field-small{
        display: block;
    }

    .catalogue-filter-submit, .catalogue-filter-advsearch{
        margin-top: 5px !important;
    }
    select.form-control.form-field-small.cat-type-select {
        margin-top: 5px;
    }
}

.catcal-submitbtn{
    margin-top: -1px;
}

.sparkleTable.table>tbody>tr>td{
    border-color: #fff;
}

.sparkleTable.table>tbody{
    border-bottom: 1px solid #eee;
}

.sparkleTable.table h3{
    font-size: 12px;
    padding-top: 6px;
}

.innertable-searchresult.table>tbody>tr>td{
    border-top: 1px solid #fff;
}

.innertable-course-results.table>tbody>tr>td{
    /*border-top: 1px solid #fff;*/
    border-top: 1px solid #f5f5f5;
}

.innertable-course-results.table>tbody>tr:not(:last-child)>td {
    border-bottom: 1px solid #eee;
}

table.innertable-searchresult.table {
    margin-top: -18px;
}

.add-to-shortlist{
    right: 24px;
    position: absolute;
    font-size: 11px;
}

.sch-description{
    text-align: justify;
    margin-top: 5px;
}

.add-to-training-plan{
    right: 24px;
    position: absolute;
    margin-top: 27px;
    font-size: 11px;
}

.sparkleTable.table>tbody>tr>td.small.td-with-bottomborder{
    /*border-bottom: 1px solid #eee;*/
    position: relative;
    padding-right: 127px;
}

.tab-pane .panel-body .panel-group.curriculum-course{
    margin-top: 0px;
    width: 540px;
}

.panel-heading.curriculum-course-header, .panel-heading.inst-led-course-header{
    max-height: 27px;
}

.panel-heading.curriculum-course-header h4.panel-title, .panel-heading.inst-led-course-header h4.panel-title{
    font-size: 12px;
    margin-top: -3px;
}

.category-title, .category-title span.glyphicon{
    font-size: 14px;
    color: #909090;
}

.catalogSubCategory{
    list-style-type: none;
    margin-top: 8px;
    padding-left: 0px;
    overflow: hidden;
}

.small.title-width{
    min-width: 400px;
    width: 400px;
}

.personal-task-link{
    margin-right: 90px;
    margin-top: -2px;
}

.journal-enteries {
    float: right;
}

b.page-number-selected a {
    color: #333;
}

.tab-pane .panel-body .panel-group.inst-led-course{
    margin-top: 0px;
    width: 80%;
}

table.table.table-hover.table-auto-width>tbody>tr>td{
    width: auto !important;
}

@media (min-width: 992px) and (max-width: 1200px){
    tr.sparkletable-table-info {
        float: left;
        padding-top: 10%;
    }

    .tab-pane .panel-body .panel-group.inst-led-course{
        width: 90%;
    }
}

@media (max-width: 580px){
    .tab-pane .panel-body .panel-group.inst-led-course{
        width: 60%;
    }
}

@media (max-width: 440px){
    .tab-pane .panel-body .panel-group.inst-led-course{
        width: 50%;
    }
}

.catalogue-scroll-table{
    margin-bottom: 0px;
    overflow-x:scroll;
    overflow-y:hidden;
}

/******************************************************/
/* angular bootstrap datepicker */
/******************************************************/
div[uib-datepicker] button.btn-default {
    border:none;
    border-radius: 0px;
    background-color:transparent;
}
div[uib-datepicker] button.btn-default.active {
    background: #e6e6e6 url(../images/images/ui-bg_glass_75_e6e6e6_1x400.png) 50% 50% repeat-x;
}
input.uib-dp {
    text-transform:uppercase;
}
/******************************************************/
/* Dashboard's panel Settings */
/******************************************************/
@media (min-width: 720px) and  (max-width: 991px) {
    .dash-md5-cols {
        display: flex;
        flex-flow: row wrap;
        margin: 5px 0;
    }
    .dash-md5-col {
        flex: 1;
        min-width: 49%;
    }
    .dash-md5-col:first-child { margin-right: 5px; }
    .col-md-5 .dash-md5-col .panel-body {
        height: 190px;
    }
}

/******************************************************/
/* catalog calendar Page Settings */
/******************************************************/
.dash-control {
    position:relative; /* for absolute positioning of child elements */
}

.search-advanced-panel{
    position: fixed;
    left: 0;
    right: 0;
    top: 52px;
    z-index: 1050;
}

.search-panel-backdrop {
    position: fixed;
    top: 52px;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1040;
    background-color: #000;
    opacity:0.5;
}
.search-panel-backdrop.in {
    opacity:0.5;
}

/* from global search merge conflict
.search-advanced-panel{
    border: 1px solid #ddd;
    border-top: none;
    margin-top: -33px;
    border-radius: 4px;
    position: absolute;
    z-index:10;
    background-color: #fff;
}*/

.advanced-search-context span.label-title{
    float: left;
    margin-bottom: 3px;
}

.advanced-search-container{
    border: 1px solid #ddd;
    border-top: none;
    max-width:1100px;
    background-color: #fff;
    border-bottom-right-radius:5px;
    border-bottom-left-radius:5px;
    max-height:calc(100vh - 52px);
    overflow:auto;
}

.advanced-search-items{
    padding-left: 12px;
    border-top-color: #5cb85d;
    padding-bottom: 20px;
}

.advanced-search-buttons{
    padding-left: 0px;
    float: right;
    margin-right: 44px;
}

.advanced-search-date-invalid {
    display:inline-block;
    margin-left:8px;
    color:#900;
    font-size:11px;
    font-weight:bold;
}

.input-group.search-date-input{
    width: 100%;
}

.input-group-addon.search-date-input-label{
    width: 62px;
}

.input-group.lr-search-inputgroup {
    width: 280px;
}

.advanced-search-context{
    margin-top: 12px;
}

ul.nav.navmenu-nav.advanced-search-navlist {
    margin-top: 17px;
    margin-left: 10px;
}

ul.nav.navmenu-nav.advanced-search-navlist li{
    width: 60px;
    height: 60px;
    margin: 0px 0px 10px 0px;
    border-radius: 70px;
}

ul.nav.navmenu-nav.advanced-search-navlist>li>a {
    padding: 5px;
}

.advanced-search-navlist li.nav-item a:hover, .advanced-search-navlist li.nav-item.item-active a:hover, .advanced-search-navlist li.nav-item.item-active a:focus {
    background-color: transparent;
}

span.ui-datepicker-month, span.ui-datepicker-year{
    font-size: 14px;
    text-shadow: none !important;
}
.navbar-form .form-group.advanced-search-dates-row {
    display:block;
}
.advanced-search-dates-row .col-md-6:first-child {
    padding-left:0;
}
@media (min-width: 992px){
    .advanced-search-buttons{
        margin-right: 1px;
    }

    .advanced-search-items{
        width: 90%;
    }
}

@media (max-width: 992px){
    .advanced-search-buttons{
        top: 3px;
    }
    .advanced-search-dates-row .col-md-6:last-child {
        margin-top:10px;
        padding-left:0;
    }
    .advanced-search-container {
        padding-right: 15px;
        padding-bottom: 10px;
    }

    ul.nav.navmenu-nav.advanced-search-navlist {
        display: inline-flex;
        display: -webkit-inline-flex;
        display: -ms-inline-flexbox;
        margin-top: 0px;
    }

    ul.nav.navmenu-nav.advanced-search-navlist .nav-item {
        margin-right: 10px;
    }

    .advanced-search-buttons{
        float: none;
        padding-right: 0px;
    }
    .advanced-search-navlist li{
        margin-right: 10px;
    }
    .advanced-search-items{
        border-top-color: #5CB84E;
    }

    .large-width-navbar-header{
        display: none;
    }
}

.advanced-search-icon {
    font-size:45px;
    color:#444;
}
.activity-icon.advanced-search-icon.icon-CU-active, .activity-icon.advanced-search-icon.icon-CRS-active, .activity-icon.advanced-search-icon.icon-AC-active, .activity-icon.advanced-search-icon.icon-RD-active{
    margin-top: -3px;
}

.filter-adv-search-toggle {
    font-size: 16px;
    padding: 0 4px;
    line-height: 22px;
    margin-right: 10px;
}
tr[data-adv-search-row] {
    display:none;
}


/******************************************************/
/* table responsiveness of catalogue page */
/******************************************************/
 .table-responsive table.innertable-course-results.table>tbody>tr {
    /*display: inline-block;*/
    display: table-row;
}
@media (min-width: 996px){
    .table-responsive table.innertable-course-results.table>tbody{
        white-space:nowrap;
    }
    table.innertable-course-results.table{
        white-space:nowrap;
    }
}
table.innertable-course-results.table{
    overflow-x:scroll;
    overflow-y:hidden;
    max-width: 95%;
}

.table-responsive {
    margin-bottom: 15px;
    overflow-x: auto;
    border: 1px solid #fff;
    width: 88%;
}

tr.sparkletable-table-info{
    width: 100px;
}

td.small.sparkletable-extra-info{
    height: 55px;
    overflow-y: scroll;
}

@media (max-width: 1200px){
    .table-responsive {
        width: 72%;
    }
}


@media (max-width: 992px){
    tr.sparkletable-table-info{
        float: left;
        padding-top: 10%;
    }

    /*.table-responsive {
        width: 100%;
    }*/

    .small.table-empty-col{
        display: none;
    }
}

@media (max-width: 720px){
    .table-responsive {
        width: 63%;
    }

    .tab-pane .panel-body .panel-group.curriculum-course {
        width: auto;
    }
}

@media (max-width: 657px){
    .table-responsive {
        width: 58%;
    }
}

@media (max-width: 768px){
    .sparkleTable.table h3{
        margin-left: -72px;
        margin-top: 62px;
        max-width: 290px;
    }
}

@media (max-width: 617px){
    .table-responsive {
        width: 51%;
    }
    .sparkleTable.table>tbody>tr>td.small.td-with-bottomborder {
        padding-right: 0px;
    }
    .small.sparkletable-extra-info{
        position: absolute;
        margin-left: -72px;
        margin-top: -13px;
    }
}

@media (max-width: 565px){
    .table-responsive {
        width: 44%;
    }
}

@media (max-width: 500px){
    .panel.panel-default.curriculum-course-list{
        margin-left: -70px;
        max-width: 320px;
    }
/*    .item-title {
        max-width: 250px;
    }*/
}


@media (max-width: 490px){
    .table-responsive {
        width: 38%;
    }
}

@media (max-width: 429px){
    .table-responsive {
        width: 34%;
    }
/*    .item-title {
        max-width: 200px;
    }*/
}

/******************************************************/
/* table Settings */
/******************************************************/
.basicTable.table.table-hover.table-withauto-width>tbody>tr>td{
    width: auto;
    vertical-align: top;
}

table.table.table-bordered {
    margin-bottom: 5px;
}

table.changepass-table tr>td .form-control{
    margin-bottom: 5px;
}

@media (max-width: 700px){
    .dropdown-list-ellipsis {
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 270px;
    }
}

.launcher-textfield{
    vertical-align: middle;
}

.sectionTitle {
    padding: 0px 5px 5px 0px;
    clear: both;
}

.form-section-container .sectionTitle {
    padding-left: 5px;
}

ul.list-group {
    margin-bottom: 7px;
}

.list-group-header {
    font-size: 16px;
    font-weight: bold;
}

.list-group-item .inline-left-data {
    width: 100%;
}
.list-group-item .inline-right-data {
    padding-left: 10px;
}

/* List Group with Left and Right Spans in each of its Items */
.list-group-lspan {
    float: left;
    width: 20%;
}
.list-group-rspan {
    display: inline-block;
    width: 80%;
}

/******************************************************/
/* Assessment Settings */
/******************************************************/
body.assess-mark #content>.panel {
    border:none;
    padding:0;
    box-shadow: none;
}
body.assess-mark #content>.panel>.panel-body {
    padding:0;
}
.assess-casestudy{
    position: relative; 
    min-height: 100px;
    height: 100%;
}
.assess-qn-div {
    width: 100%;
    background-color: white;
    overflow: auto;
    height: 100%;
    top: 0px;
    position: absolute;
}
.assess-qn-td-container {
    height:100%;
    padding:10px
}
.assess-casestudy-footer{
    border-top: 1px solid #e7e7e7;
    padding: 5px;
}

.assessment-introduction {
    padding: 10px 0px;
}

.alert-assessment{
    padding: 15px;
    margin: 10px 0;
    border: 1px solid transparent;
    border-radius: 4px;
    color: #333;
    background-color: rgba(0,0,0,0.1);
    border-color: rgba(0,0,0,0.2);
}

.th-top-border{
    border-top: 1px solid #e7e7e7;
}

.assessment-overall-result,
.alert-assessment-overallresult{
    padding: 10px;
    border: 1px solid transparent;
    border-radius: 4px;
    color: #333;
    background-color:#e5e5e5; /* removed alpha as other alpha items were doubling up */
    border-color: rgba(0,0,0,0.2);
    width: 90%;
    display: block;
    margin:10px auto;
}

.assessment-overall-result .form-section-container,
.alert-assessment-overallresult .form-section-container {
    margin:0;
}
.assessment-overall-result .form-container,
.alert-assessment-overallresult .form-container {
    padding-bottom:0;
}
.assessment-overall-result .form-group,
.alert-assessment-overallresult .form-group {
    margin-bottom:4px;
}

.csv-link-container{
    clear: both;
    text-align: right;
    margin-bottom: 10px;
}

.assess-help-links, .question-help-links {
    float:right;
}
.qg-links {
    right:10px;
    top:0px;
}
.assess-help-links {
    margin:0 0 10px 10px;
}
.question-help-links {
    margin: 5px;
}

.assess-qn-group {
    text-align: justify;
}

.workplace-assess-table{
    white-space: nowrap;
}

.assess-table{
    border: 1px solid #e7e7e7;
    border-collapse: separate;
    border-radius: 4px;
}
.assess-results {
    border-top: 1px solid #e7e7e7;
}

.assess-table-th{
    background-color: #f5f5f5;
    border-bottom: 1px solid #ddd;
    height: 40px;
    padding-left: 9px;
    color: #777;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
th.assess-table-th.assess-table-lr-header {
    padding-right: 9px;
    text-align: right;
}
.cell-quest-reponse {
    padding:4px 6px;
}

.cell-quest-reponse.quest-maxscore-percent{
    border-bottom: 1px solid #e7e7e7;
    padding: 10px 6px;
}

.basicTable.question-container{
    border: 1px solid #e7e7e7;
    margin: 5px 0px;
    border-collapse: separate;
    border-radius: 4px;
}

table.assess-intro-section {
    margin-top: 20px;
    margin-bottom: 20px;
}

div.question-number{
    font-weight: bold;
    color: #fff;
    width: 88px;
    background-color: rgba(91, 183, 91, 0.8);
    position: absolute;
    padding:8px 0;
    text-align: center;
    border-top-left-radius: 3px;
    margin-left: -1px;
    margin-top: -1px;
    height: 36px;
}

.overall-result-header{
    font-weight: bold;
    color: #777;
    margin-left: 8px;
}

.question-header-td{
    border-bottom: 1px solid #e7e7e7;
    background-color: #f8f8f8;
    border-top-right-radius: 4px;
}

.question-text{
    text-align: justify;
    padding:8px 38px 8px 100px;
}

.question-text.no-quest-num {
    padding-left:8px;
}
input.question-radio-btn{
    margin-top: 4px !important;
    margin-right: 10px;
}

input.question-radio-btn-horiz{
    margin-top: 4px !important;
    margin-left:6px;
}

input[type=checkbox].question-radio-btn{
    margin-left: 0px;
    width: auto !important;
}

td.data.question-answer-td-input{
    padding-left: 14px;
    padding-top: 3px;
    padding-bottom: 3px;
    border-bottom: 1px solid #e7e7e7;
}

td.data.question-answer-td-horiz {
    text-align:center;
    vertical-align:top;
    padding:3px;
    border-left: 1px solid #e7e7e7;
    border-bottom: 1px solid #e7e7e7;
}

td.data.question-answer-td-horiz:first-child {
    border-left: none;
}

td.data.question-answer-td-vert {
    border-bottom: 1px solid #e7e7e7;
    border-left: 1px solid #e7e7e7;
    padding-left: 4px;
}

.question-container tr:last-child td.data.question-answer-td-vert , .question-container tr:last-child td.data.question-answer-td-input, .question-container tr:last-child td.data.question-answer-td-horiz{
    border-bottom: none;
}

td.data.question-answer-td-vert label,
td.data.question-answer-td-horiz label {
    font-weight:normal;
    cursor:pointer;
    margin-bottom:0;
    display: block;
}

.table-help-links td {
    padding-left:8px;
}
.question-result-title, .question-feedback-title, .learner-answer-title-inline {
    padding-top: 4px;
    padding-left: 7px;
    vertical-align: top;
    display: inline-block;
}

/* improved tutor marking display */
.learner-answer, .suggested-answer, .tutor-comments {
    border: solid 1px #e7e7e7;
    border-radius: 4px;
    margin: 8px;
}
.tutor-score {
    margin:8px;
}
.tutor-score .input-group .form-control {
    max-width:250px;
}
.tutor-comments-title,
.learner-answer-title,
.suggested-answer-title {
    background-color: #f8f8f8;
    border-bottom: solid 1px #e7e7e7;
    padding: 3px 8px;
    font-weight: bold;
    color: #666;
}
.tutor-score .input-group-addon {
    font-weight: bold;
    color: #666;
    font-size: 13px;
}
.tutor-score .input-group-addon,
.tutor-score input[readonly] {
    background-color: #f8f8f8;
}
.tutor-score .input-group-addon .glyphicon,
.tutor-score .input-group-addon .mdi {
    color:#666;
}
.tutor-comments-text,
.learner-answer-text,
.suggested-answer-text {
    padding:8px;
}
.tutor-comments-pretext {
    color: #888;
    font-style: italic;
    font-size: 12px;
    margin-bottom: 8px;
}
.tutor-score-posttext {
    padding:7px 0 0 3px;
}
.tutor-score-posttext .checkbox-inline {
    padding-top:0; /* padding taken care of by parent */
}
.tutor-score-posttext .checkbox-inline input[type="checkbox"] {
    margin-top:2px;
}
/* ----------- */

td.question-feedback-text {
    padding-left: 11px;
    padding-bottom: 5px;
}

td.question-feedback-text{
    border-top: 1px solid #e7e7e7;
}

.question-result, .feedback-result, .answer-result{
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 6px;
    display: inline-block;
    padding-right: 10px;
    text-align: justify;
}

.answer-result{
    vertical-align: middle;
}

.img-only-qchoice-chb img,
.img-only-qchoice-rad img {
    border: solid 2px transparent;
}
.img-only-qchoice-chb.selected img,
.img-only-qchoice-rad.selected img {
    border: solid 2px #ccc;
}

/* ********************************** */
.btn.btn-default.btn-with-leftmargin, .btn-with-leftmargin {
    margin-left: 4px;
}

.btn.btn-default.btn-with-mediumleftmargin, .calprevmonth-margin, .tu-calendar-header{
    margin-left: 7px;
}

input.btn.btn-default.btn-with-bottommargin{
    margin-bottom: 4px;
}

.pm-addnote-bg{
    padding-bottom: 9px;
    margin-bottom: 10px;
}
.dont-break-out{
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-all;
}

.note-add-del-section{
    float: right;
    padding-left: 30px;
}

.note-add-del-section span.glyphicon.glyphicon-edit, .note-add-del-section span.glyphicon.glyphicon-trash{
    margin-right: 2px;
    font-size: 17px;
}

h3.devplan-header {
    margin-top: -16px;
    margin-left: 20px;
}

input#introCloseLink {
    margin-left: 4px;
}

td.calendar-day-tablecell{
    height: 100px;
    padding: 1px;
    min-height: 100px;
}
th.Data.calendar-day-tablecell, td.calendar-day-tablecell{
    border: 1px solid #e0e2e7;
}

.calender-month-name {
    font-size: 18px;
    font-weight: bold;
    text-align: center;
}
.pl-simple-calendar table {
    border-collapse: collapse;
}
.pl-simple-calendar th.calendar-day-tablecell,
.pl-simple-calendar td.calendar-day-tablecell {
    border: solid 1px #ccc;
    position:relative;
}
.pl-simple-calendar th.calendar-day-tablecell {
    padding:3px;
    font-size:14px;
    text-align:center;
}
.pl-simple-calendar td.calendar-day-tablecell {
    padding:0;
}
.pl-simple-calendar td.calendar-day-tablecell.has-items {
    cursor:pointer;
    padding-bottom: 15px;
}
.pl-simple-calendar td.calendar-day-tablecell.has-items:hover {
    background-color: #f9f9f9;
}
.pl-simple-calendar td.calendar-day-tablecell.today {
    background-color:#eee;
}
.pl-simple-calendar td.calendar-day-tablecell>p {
    margin:0;
    padding:0;
    position: absolute;
    top: 5px;
    text-align: center;
    width: 100%;
    color: rgba(0,0,0,0.1);
    font-size: 55px;
    z-index:1;
}
.pl-simple-cal-day {
    padding:2px 4px 0;
    z-index:2;
    position:relative;
}
.pl-simple-cal-popover-content {
    display:none;
}
.pl-simple-cal-popover {
    display:inline-block;
    font-size:11px;
    line-height: 13px;
    margin-bottom: 3px;
    cursor:pointer;
    font-weight:bold;
}
.pl-simple-cal-popover:focus,
.pl-simple-cal-popover:hover {
    text-decoration: none;
    border:none;
}
.pl-simple-cal-popover:hover {
    /* handled by whole cell hover now */
/*    background-color:rgba(238,238,238,0.5);*/
}

/* calendar enrol modal */
#day_item_clone {
    display: none;
}
.day-item {
    padding:8px 0;
    box-shadow: inset 0 5px 5px #efefef;
}
.day-item .row {
    margin:0;
}
.day-item-modal-body {
    padding:0;
}
.day-item-header {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 10px;
}
.day-item-enrol {
    text-align: left;
}
.day-item-time-loc {
    font-size: 15px;
}
.day-item-timezone {
    display: none;
    font-size: 14px;
}
.day-item-time-venu-deet>.row>div {
    padding-left: 0;
}
span.day-item-no-enrol {
    font-weight: bold;
    color: #600;
}
.ses-loc-dash {
    display:none;
}
.pl-simple-cal-day-more {
    position: absolute;
    bottom: 0;
    width: 100%;
    text-align: center;
    color: #d3d3d3;
    font-size: 12px;
}
@media screen and (min-width: 993px) {
    .day-item-enrol {
        text-align: right;
    }
}
/******************************************************/
/* QR code functionality */
/******************************************************/
.qr-img-lg {
    width: 100%;
}
.qr-code-text-small, .qr-code-text-large {
    font-family:'Verdana';
    font-weight:bold;
    text-align:center;
    background-color: #c4c4c4;
}
.qr-code-text-small {
    position:absolute;
    z-index:1000;
    top:0;
    width:204px;
}
.qr-code-instr {
    padding:4px;
    font-style:italic;
}

/******************************************************/
/* Column Checkbox Choices */
/******************************************************/
.crpt-container{
    padding-bottom: 20px;
}

.column_choice_section:last-child{
 border-bottom: none;
}

.column_choice_section{
    border-bottom: 1px solid #e3e3e3;
    padding-top: 10px;
    padding-bottom: 5px;
    padding-left: 10px;
}

.column_choice_section_header{
    font-weight: bold;
    padding-bottom: 5px;
}

.lbl_colchoice{
    font-weight: normal;
    padding-left: 17px;
    text-indent: -17px;
}

.lbl_colchoice input{
    width: 13px;
    height: 15px;
    margin: 0;
    vertical-align: bottom;
    position: relative;
    top: -1px;
}

.column_choice_section_body li{
    list-style-type: none;
    display: inline-block;
    width: 24%;
    vertical-align: top;
}

.basicTable.tbl-cust-report{
    border: 1px solid #e3e3e3;
}

.save-col-types, .lms-roles{
    font-weight: bold;
    width: 15%;
    vertical-align: middle !important;
    text-align: right;
}

.cust-report-td-left{
    float: left;
    font-weight: bold;
    width: 15%;
    float: none;
    display: table-cell;
    vertical-align: middle !important;
    text-align: right;
}

.save-col-types-select, .save-col-roles-select, .cust-report-td-right{
    border-right: 1px solid #e3e3e3;
    padding-right: 8px;
}

/******************************************************/
/* Report pages - Ad hoc Report */
/******************************************************/
.datasource-list, .datasource-selected{
    min-width: 110px;
    padding: 5px;
    color: #555;
}

.datasource-list{
    margin-right: 3px;
}

.datasource-selected{
    margin-left: 3px;
}

.form-control-withmargin{
    margin-left: 2px;
}

td.crpt-action-cell input[type='button'] {
    margin: 6px;
}

td.crpt-action-cell input.btn-crpt-rem{
    margin-left: -4px;
}
table.dyn-add-filter-tbl {
    margin-left: 4px;
}

.td-orderby-padding{
    padding-left: 4px;
}

.dyn-add-filter-tbl select.form-control{
    width: 101px;
}

div.form-container{
    padding-bottom: 10px;
}

.dyn-add-filter-tbl td div.form-container div.form-group label, .dyn-add-filter-tbl td div.form-container div.form-group label span.label-title{
    font-weight: normal;
}

.dyn-add-filter-tbl td div.form-container div.form-group label span.label-title{
    text-align: left;
}

.dyn-add-filter-tbl td div.form-container div.form-group label{
    width: 120px;
    padding-left: 4px;
    margin-top: 6px;
}

.dyn-add-filter-tbl td div.form-container div.form-group div.col-sm-10 {
    width: 69px;
    padding-left: 5px;
    padding-right: 0px;
}

.dyn-add-filter-tbl td.DataLabel{
    width: 120px;
    padding-right: 12px;
    vertical-align: middle;
    padding-left: 2px;
}

#CRPT_FILTER_TABLE td:nth-child(3) {
    padding-left:4px;
}
#CRPT_FILTER_TABLE td:nth-child(4) {
    padding:0 4px;
    white-space:nowrap;
}
#CRPT_FILTER_TABLE td:nth-child(5) select,
#CRPT_FILTER_TABLE td:nth-child(5) input[type='text'] {
    width:100%;
    max-width:200px;
}
#CRPT_FILTER_TABLE td:nth-child(5) .chosen-container {
    width:100% !important; /* to override chosen JS using style attribute */
    max-width:200px;
}
#CRPT_FILTER_TABLE td:nth-child(5) label.radio-inline:first-child {
    padding-left:30px;
}
#CRPT_FILTER_TABLE td:nth-child(5) label.radio-inline,
#CRPT_FILTER_TABLE td:nth-child(5) label.checkbox-inline {
    padding-top:0;
}

/*************** rating scale html page Classes **************/
.ratingscale-table-header{
    background-color: #f5f5f5;
}

/*************** CKE Editor Classes **************/
.cke_chrome, .cke_inner {
    border-radius: 4px;
}

div#cke_PPACT_TITLE, .cke_toolgroup{
    border: 1px solid #d3d3d3 !important;
}

span#cke_1_top {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    background-color: #f5f5f5;
    border-color: #ddd;
    border-bottom: 1px solid #d3d3d3;
    background-image: none;
}

span#cke_1_bottom{
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    background-color: #f5f5f5;
    border-color: #ddd;
    border-top: 1px solid #d3d3d3;
    background-image: none;
}

.cke_resizer_ltr {
    margin-right: -1px !important;
    margin-top: 4px !important;
}

.co-priorities{
    min-width: 160px;
}

/******************************************************/
/* Footer Settings */
/******************************************************/
.container.footer-container{
    padding: 0px !important;
}

.footer-img{
    float: right;
    margin-top: 10px;
}

.footer-links-container {
    float:left;
    margin-top:8px;
    padding-left:30px; /* to account for .container's padding, .col-md-X's padding,
                          and our absence of using .row in main layout */
}

.footer-link {
    display:inline-block;
}

.footer-link a {
    font-size:11px;
    font-weight:normal;
}

@media (max-width: 992px){
    .footer-img{
       padding-right: 31px;
    }
}

@media (min-width: 768px) and (max-width: 991px){
    .container {
        width: 100%;
        /*padding-left: 0px;
        padding-right: 0px;*/
    }
}

@media (max-width: 680px){
    .container {
        padding-left: 17px;
        padding-right: 13px;
    }
}

/******************************************************/
/* LMSHelper.cgi Settings */
/******************************************************/
@media (max-width: 650px){
    .col-xs-6.help-infopanel {
      clear: both;
      width: 100%;
    }
}

a.pdf_help, a.html_help{
    font-weight: normal;
}

.help-guide-infopanel-hide{
    display: none;
}

/******************************************************/
/* Task List panels */
/******************************************************/
/* color: inherit has been used to avoid css redundancy of css for other sites */
.panel-heading:hover .accordion-toggle span.glyphicon, .panel-heading a:link, .panel-heading:hover h4 div {
   color: inherit; 
}

.panel-heading a:hover {
    color: rgb(0, 153, 51);
}

/******************************************************/
/* Task List Show Expired icon Classes */
/******************************************************/
.expired-items-toggle {
    float:right;
    margin-top:-5px;
    margin-right:8px;
}

/******************************************************/
/* Task List Priority Classes */
/******************************************************/
.tasklist-expired{
    color: #333;
    background-color:  rgba(91, 183, 91, 0.5);
    border-bottom: 1px solid rgba(91, 183, 91, 0.6);
}

.tasklist-priority-one{
    color: #333;
    background-color: rgba(91, 183, 91, 0.32);
    border-bottom: 1px solid rgba(91, 183, 91, 0.5);
}

.tasklist-priority-two{
    color: #333;
    background-color: rgba(91, 183, 91, 0.17);
    border-bottom: 1px solid rgba(91, 183, 91, 0.25);
}

.tasklist-priority-three{
    color: #333;
    background-color: rgba(91, 183, 91, 0.055);
    border-bottom: 1px solid rgba(91, 183, 91,0.24);
}

.tasklist-expired .panel, .tasklist-priority-one .panel, .tasklist-priority-two .panel, .tasklist-priority-three .panel{
    border: none;
}

.activity-list-item:hover {
    -webkit-box-shadow: inset 0 0 20px #cbcbcb;
    -moz-box-shadow: inset 0 0 20px #cbcbcb;
    box-shadow: inset 0 0 20px #cbcbcb;
}

.panel-collapse .panel-body .activity-list-item:hover { 
    border-bottom: solid 1px #d8d8d8;
}

.tasklist-expired:hover{
    -webkit-box-shadow: inset 0 0 30px rgba(91, 183, 91, 0.6);
    -moz-box-shadow: inset 0 0 30px rgba(91, 183, 91, 0.6);
    box-shadow: inset 0 0 30px rgba(91, 183, 91, 0.6);
}

.tasklist-priority-one:hover{
    -webkit-box-shadow: inset 0 0 30px rgba(91, 183, 91, 0.5);
    -moz-box-shadow: inset 0 0 30px rgba(91, 183, 91, 0.5);
    box-shadow: inset 0 0 30px rgba(91, 183, 91, 0.5);
}

.tasklist-priority-two:hover{
    -webkit-box-shadow: inset 0 0 20px rgba(91, 183, 91, 0.4);
    -moz-box-shadow: inset 0 0 20px rgba(91, 183, 91, 0.4);
    box-shadow: inset 0 0 20px rgba(91, 183, 91, 0.4);
}

.tasklist-priority-three:hover{
    -webkit-box-shadow: inset 0 0 20px rgba(91, 183, 91, 0.3);
    -moz-box-shadow: inset 0 0 20px rgba(91, 183, 91, 0.3);
    box-shadow: inset 0 0 20px rgba(91, 183, 91, 0.3);
}

/************* tasklist expired title *******************/
.tasklist-expiredtitle-section{
    color: #e2f2e2;
    border-color: rgb(91, 183, 91);
    height: 21px;
    background-color: rgb(91, 183, 91);
    border-bottom: 1px solid rgba(91, 183, 91, 0.9);
    width: 80px;
    -moz-border-radius-bottomright: 50px;
    border-bottom-right-radius: 44px;
    border-right: 1px solid rgb(91, 183, 91);
}

.tasklist-expire-title{
    margin-left: 15px;
}

/************* Priority User Guide *******************/
.tasklist-userguide-click:hover{
    cursor:pointer;
}

.tasklist-userguide{
    margin-top: -1px;
    margin-left: 6px;
    left: 14.90625px;
    display: block;
    opacity: 1;
    width: 220px;
    height: 190px;
    position: absolute;
    z-index: 1010;
    max-width: 276px;
    padding: 1px;
    text-align: left;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 6px;
    box-shadow: 0 5px 10px rgba(0,0,0,.2);
    white-space: normal;
    transition: opacity .15s linear;
}

.userguide-title{
    margin: 0;
    padding: 8px 14px;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    background-color: #f7f7f7;
    border-bottom: 1px solid #ebebeb;
    border-radius: 5px 5px 0 0;
}

.userguide-content{
    font-style: normal;
    font-size: 12px;
    padding: 9px 14px;
}

.userguide-expired, .userguide-priority-one, .userguide-priority-two, .userguide-priority-three{
    height: 30px;
    width: 30px;  border-radius: 35px;
    margin-bottom: 3px;
}

.userguide-expired{
    background-color:  rgba(91, 183, 91, 0.5);
    border-bottom: 1px solid rgba(91, 183, 91, 0.6);
}

.userguide-priority-one{
    background-color: rgba(91, 183, 91, 0.32);
    border-bottom: 1px solid rgba(91, 183, 91, 0.5);
}

.userguide-priority-two{
    background-color: rgba(91, 183, 91, 0.17);
    border-bottom: 1px solid rgba(91, 183, 91, 0.25);
}

.userguide-priority-three{
    background-color: rgba(91, 183, 91, 0.055);
    border-bottom: 1px solid rgba(91, 183, 91,0.24);
}

.userguide-expired-text, .userguide-priority-one-text, .userguide-priority-two-text, .userguide-priority-three-text{
    width: 400px;
    padding-left: 37px;
    padding-top: 6px;
    color: #333;
}
@media (min-width: 992px){
    .tasklist-userguide{
        margin-left: 14px;
    }
}
/******************************************************/
/* left/right containers */
/******************************************************/
.main-container {
    clear: both;
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.main-container .left-container {
    float: left;
    padding-right: 2px;
}

.main-container .right-container {
    float: right;
}

@media (max-width: 706px){
    .main-container .right-container{
       clear: both;
       width: 100%;
       margin-bottom: 10px;
    }
    .main-container .left-container{
        width: 100%;
        margin-bottom: 4px;
    }
    .sro-objdetail-title-description{
        text-align: justify !important;
        padding-right: 15px;
    }
}

.btn-left {
    float:left;
}
.btn-right {
    float:right;
}
.btn-right input[type='reset'],
.btn-right input[type='button'],
.btn-right input[type='submit'],
.btn-right button,
.btn-left input[type='reset'],
.btn-left input[type='button'],
.btn-left input[type='submit'],
.btn-left button {
    margin-bottom:5px;
}
/******************************************************/
/* Mobile view Display for screen sizes < 400px */
/******************************************************/

@media (max-width: 480px) {
    .navbar-brand {
        font-size: 14px;
    }
    .navbar-brand-logo {
        margin-right: 5px;
    }
}

@media (max-width: 399px) {
/*    input.form-control.search-field{
        width: 93.8%;
    }
    .search-groupbtns {
        width: 94.5%;
    }
    .search-advanced-panel{
       border: 0px;
    }
    .container-fluid.advanced-search-container {
        margin-right: 28px;
    }*/
    .container-fluid {
        padding-left: 0px;
        padding-right: 0px;
    }

    .navbar-brand-text{
        display: none;
    }

    .column_choice_section_body li{
        width: auto;
        display: block;
    }
}

/******************************************************/
/* tab-nav responsive deign */
/******************************************************/
#current_tab.narrow-mode {
    margin-right: -2px;
}
#current_tab.narrow-mode a {
    border-bottom-width: 2px;
}
ul.nav.nav-tabs li.narrow-mode {
    width: 80px;
    border: 1px solid #ddd;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    height: 42px;
}
ul.nav.nav-tabs li.narrow-mode.active{
    width: auto !important;
    border: none !important;
}
ul.nav.nav-tabs li.narrow-mode:hover{
    background-color: #F5F5F5;
}
ul.nav.nav-tabs li.active.narrow-mode:hover{
    background-color: transparent;
}
li.narrow-mode a.tabnav-title:hover,
.nav-tabs>li.narrow-mode:not(.active)>a:hover{
    background-color: transparent;
    border-color: transparent;
}
li.narrow-mode a.tabnav-title {
    white-space: nowrap;
    width:80px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align:center;
}
li.narrow-mode a.tabnav-title{
    padding-left:8px;
    padding-right:8px;
}
ul.nav.nav-tabs li.narrow-mode.active .tabnav-title{
    width: auto;
    height: 43px;
}

/******************************************************/
/* Login classes */
/******************************************************/
.login-container, #login_confirm_container {
    max-width:800px;
    margin:0 auto;
}

.login-container .well{ /* to allow for removal of default BS .well bottom-padding earlier in this file */
    padding:9px;
}

.self-reg-header {
    font-weight:bold;
    margin:4px 0;
    font-size:14px;
}

.login-err-msg {
    max-width:600px;
}

#content div.panel-body.info_box_inner.password-change h1, .selfreg_msg h1{
    color: #909090;
    font-size: 17px;
    margin-top: 4px;
}

table.roleListTbl input.btn.btn-default.btn-rolelist-new-ui{
    float: left;
    margin-bottom: 10px;
}

.login-container .panel-body .row .col-sm-7 h2{
    font-size: 19px;
    margin-top: 0px;
}

.dash-tasklist-emptmsg {
    display: inline;
    border-radius: 11px;
    border: 2px solid;
    margin-right: 3px;
    padding: 3px 0px 1px 4px;
}
.dash-tasklist-emptmsg .glyphicon{
    color: #fff;
    margin-right: 2px;
    font-size: 13px;
}

.dash-tasklist-errmsg span.glyphicon-alert {
    color: rgba(91, 183, 91, 0.8);
    font-size: 23px;
    top: 5px
}

.pword-view-field-div {
    display: inline-block;
    width: 55%;
}
.pword-view-field input[type="password"],
.pword-view-field input[type="text"] {
    width:100% !important;
}
.field-pword-icon {
    float: right;
    font-size: 22px;
    padding-right: 8px;
    margin-left: -36px;
    margin-top: 2px;
    position: relative;
    z-index: 2;
    cursor:pointer;
}

.failed-login-msg {
    float:right;
    margin-right:30px;
}
.failed-login-msg .alert {
    margin-top:0;
}

#login_confirm_container .panel-footer {
    background-color: transparent;
}

/*** Error Details Table ***/
.error-detail-table tbody tr td{
    word-break: break-all;
}

.error-detail-table td.error-detail-param {
    max-width: 400px;
    overflow: auto;
}

/*** Responsiveness of roleListInfo Table on logon.pm ***/
table.roleListTbl{
    margin-top: 8px;
}

div#roleList{
    margin-top: 4px;
}

.login-change-password {
    max-width:800px;
    margin:0 auto;
}

/*** Search Result Prev/Next Navigations Div ***/
.search-result-nav{
    text-align: center;
    margin-top: 5px;
    margin-bottom: 5px;
    clear: both;
}

input[type=checkbox].pwd-expiry-checkbox {
    float: left;
    margin-top: 9px;
}

/* self registration wu selector lookup list */
.org-lookup-list {
    display:none;
    overflow: auto;
    height: 150px;
    max-width: 250px;
    border: solid 1px #ccc;
    margin-top:5px;
    padding: 6px 12px;
    font-size: 14px;
    color: #555;
    background-color: #fff;
    background-image: none;
    border-radius: 4px;
}
.org-list-link {
    display: inline;
    clear: both;
    padding-top: 10px;
    margin-left: 3px;
}
.org-lookup-list .org-list-entry {
    display:block;
    cursor:pointer;
}
.org-lookup-list .org-list-entry:hover {
    background-color:#eee;
}

/******************************************************/
/* Perf Mgmnt Feedback  */
/******************************************************/
#accordion_emlog #heading_emlog_panel .glyphicon, #accordion_audit #heading_audit_panel .glyphicon {
    color: inherit;
}
#accordion_emlog #heading_emlog_panel a, #accordion_audit #heading_audit_panel a {
    font-size: 14px;
    font-weight: normal;
}
.feedback-header {
    font-style:italic;
}

/******************************************************/
/* settings for GEM::Generator::Accordion */
/******************************************************/
.accord-item .panel-heading {
    padding:0;
    min-height:auto !important;
}
.accord-item .panel-title a:hover {
    border:none;
}
.accord-item .panel-title a>div {
    display:block;
    padding:8px;
}
/******************************************************/
/* Table TD with nowrap */
/******************************************************/
td.td-nowrap{
    white-space: nowrap;
    width: 500px;
}

/****************************************************************
                        Custom Shims (add more as needed)
*****************************************************************/
.top-pad-10 {
    padding-top:10px;
}

/****************************************************************
                        Glyphicons
*****************************************************************/
.glyphicon-alert:before {
    content: "\e209";
}

/****************************************************************
                        Help Container
*****************************************************************/
.help-container {
    border: solid 1px #ddd;
    border-radius: 4px;
}

.panel-heading.help-container-header{
    background-color: #f5f5f5;
    border-color: #ddd;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
}

/****************************************************************
             self-reg modal user ID display
*****************************************************************/
.dupe-ahpra-display,
.dupe-email-add-display,
.login-modal-userid {
    font-weight: bold;
    font-family: "Roboto Mono","Source Code Pro","Lucida Console","Courier New","Verdana";
}
.dupe-email-add-display,
.login-modal-userid {
    font-size: 18px;
    word-wrap:break-word;
}
@media (min-width: 768px) {
    /* displaying user-entered names which might be long
       hence bump up the width of the modal */
    .curr-logon-modal .modal-dialog {
        width:680px;
    }
}

/****************** Last Updated Info DIV ***********************/
#info_cron_update {
    padding: 0px 0px 15px 15px;
}

/****************** Old School hover help ***********************/
#overDiv {
    position:absolute;
    visibility:hidden;
    z-index:10000;
    left: 18px;
    top: 32px;
}
/****************************************************************
                        Bootstrap Shims
*****************************************************************/
.vert-offset-top-20 {
    margin-top: 20px;
}
.vert-offset-top-10 {
    margin-top: 10px;
}

/* ----------------------------------- */
/* Global table data alignment classes */
/* ----------------------------------- */
/* This match up with styles assigned at Perl
   Object metadata level in LMS */
.cell-align-text,
.cell-align-left {
    text-align:left;
}
.cell-align-num,
.cell-align-right {
    text-align:right;
}
.cell-align-code,
.cell-align-link,
.cell-align-btn,
.cell-align-action,
.cell-align-chb,
.cell-align-center {
    text-align:center;
}

.table>tbody>tr>td.cell-valign-top {
    vertical-align:top;
}
.table>tbody>tr>td.cell-valign-middle {
    vertical-align:middle;
}
.table>tbody>tr>td.cell-valign-bottom {
    vertical-align:bottom;
}

.count-cell-val {
    display:inline-block;
    min-width:22px;
    vertical-align:top;
}

/* sometimes modal markup is inserted into action columns. Need to reset */
.cell-align-action .modal {
    text-align:initial;
}

.seq-btn-container {
    width:36px;
    display:inline-block;
}
.seq-btn-img {
    width:16px;
    height:16px;
    border:none;
}
.seq-btn-container.disabled {
    pointer-events: none;
    cursor: not-allowed;
    opacity: 0.3;
}
/******************************************************/
/* Leaderboard CLASSES */
/******************************************************/
.leaderboard-header {
    margin: -15px -15px 15px -15px;
}
.leaderboard-header:hover {
    box-shadow: none;
}
.leaderboard-header-logo {
    width: 90px;
    height: 80px;
    border-bottom-right-radius: 44px;
    display: inline-block;
}
.leaderboard-header-logo span {
    font-size: 70px;
    color: #fff;
    margin: 7px;
}
h2.leaderboard-header-title {
    display: inline-block;
    position: absolute;
    margin-left: 14px;
    font-size: 20px;
    margin-top: 26px;
}

.leaderboard-item {
    display: flex;
    padding: 0px 10px;
}

.leaderboard-item span {
    font-weight: bold;
    width: 100px;
}
.leaderboard-first-place span {
    font-size: 60px;
}
.leaderboard-second-place span {
    font-size: 40px;
}
.leaderboard-third-place span {
    font-size: 30px;
}
.leaderboard-normal-place span {
    font-size: 20px;
}

.leaderboard-lr-photo {
    display: block;
    margin: auto;
}
.leaderboard-first-place img {
    width: 70px;
    height: 70px;
}
.leaderboard-second-place img {
    width: 60px;
    height: 60px;
}
.leaderboard-third-place img {
    width: 50px;
    height: 50px;
}

.tasklist-expired td div.leaderboard-lr-details {
    font-size: 23px;
    font-weight: bold;
}
.tasklist-priority-one td div.leaderboard-lr-details {
    font-size: 20px;
}
.tasklist-priority-two td div.leaderboard-lr-details {
        font-size: 15.5px;
}

.leaderboard-lr-details span {
    display: inline-block;
}
.leaderboard-lr-details span.leaderboard-lr-name {
    width: 32%;
    min-width: 280px;
}
.leaderboard-lr-details span.leaderboard-lr-score {
    width: 10%;
    min-width: 100px;
}
.leaderboard-lr-details span.leaderboard-lr-date {
    width: 40%;
    min-width: 300px;
}

/************************************************************************ */
/* LMS Program summary charts (g_vis charts) */
/************************************************************************ */
.prog-summary-dash-outer {
/*    border:solid 1px #ddd;
    border-radius: 4px;
*/    width:100%;
    margin-bottom: 10px;
    margin-right: 10px;
}
.prog-summary-dash-header {
    border-bottom:solid 1px #ddd;
    background-color: #ddd;
    color:#333;
    font-weight:bold;
    font-size:14px;
    padding:8px;
}
.prog-summary-dash-body {
    padding:10px;
}
.prog-summary-chart-container {
    width:100%;
    height:650px;
}
div[id^='chart'] g[column-id],
div[id^='chart'] g path,
div[id^='chart'] g path ~ text {
    cursor:pointer;
}
/*chart flickering fix*/
svg>g>g:not([column-id]):last-child {
    pointer-events: none;
}
.summary-header {
    font-size: 16px;
    font-weight: bold;
    margin: 3px 0;
    padding: 3px 0px;
}

/* custom legends */
.legend-row {
    padding-bottom: 6px;
}
.legend-swatch-container {
    display: table-cell;
}
.legend-swatch {
    width: 40px;
    height: 20px;
}
.legend-text {
    display: table-cell;
    font-size: 13px;
    line-height: 20px;
    padding-left: 8px;
    vertical-align: top;
}
.chart-legends .swpa-chart-legend {
    width: 49%;
}
.chart-legends .legend-left {
    float: left;
}
.chart-legends .legend-right {
    float: right;
}
@media screen and (max-width:1200px) {
    .chart-legends .swpa-chart-legend {
        width: 100%;
    }
}

/************************************************************************ */
/* bootstrap radio-inline & checkbox-inline:
   affected by other styling choices made ^above, so I'm 'undo'ing some of
   that here until we can safely remove said choices. This one is affected
   by: panel-body{font-size:13px} - bootstrap is expecting 14px, I'd like
   to increase whole LMS to this eventually.
   Also affected by input[type="radio"] styling ^above.
   Here we're targeting radio/checkbox-inline's used in filter form tables
/************************************************************************ */
form[name="filterForm"] table .checkbox-inline,
form[name="filterForm"] table .radio-inline {
    font-size: 14px;
    padding-top: 4px; /* to give it some vert space in table based layout label */
    padding-bottom: 4px; /* to give it some vert space in table based layout label */
}
/* bootstrap 3.3.7 update */
form[name="filterForm"] table .checkbox-inline input[type="checkbox"],
form[name="filterForm"] table .radio-inline input[type="radio"] {
    position: absolute;
    margin-top: 4px \9;
    margin-left: -20px;
}

form[name="filterForm"] table input[type="checkbox"],
form[name="filterForm"] table input[type="radio"] {
    margin: 4px 4px 0px 0px;
    margin-top: 1px \9;
    line-height: normal;

    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    padding: 0;
}

/******************************************************/
/* Table editable row action icons */
/******************************************************/
.lms-editrow-table .btn-group span.mdi {
    font-size: 20px;
    line-height: 18px;
    top: 2px;
    position: relative;
}
.btn-group.btn-group-view {
    display: flex;

}
.lms-editrow-view-container {
    display:  block;
}
.btn-group.btn-group-modify,
.lms-editrow-modify-container {
    display: none;
}
.lms-editrow-view-elem-prefix {
    display: inline-block;
    margin-right: 5px;
}
.lms-editrow-view-elem-suffix {
    display: inline-block;
    margin-left: 5px;
}
.lms-editrow-table .editrow-table-action-container {
    position: relative;
}
.lms-editrow-table .editrow-table-action-container .spinner-container {
    width: 18px;
    height: 20px;
    margin: 0;
    background-repeat: no-repeat;
    line-height: 18px;
    position: absolute;
    top: 5px;
    z-index: 10;
    display: none;
}
.lms-note.no-data-msg.hidden {
    display: none;
}
.lms-editrow-table .btn-group span[class^="sr-icon-"] {
    font-size: 18px;
    top: 3px;
}

/******************************************************/
/* forum functionality */
/******************************************************/
.forum-post-item {
    background-color:#eee;
    margin-bottom:5px;
    border-radius:4px;
}
.forum-post-item.reply2 {
    margin-left:15px;
}
.forum-post-item.reply3 {
    margin-left:30px;
}
.forum-post-item.reply4 {
    margin-left:45px;
}
.forum-post-item.replymax {
    margin-left:60px;
}
.forum-post-item-header {
    background-color:#ddd;
    min-height:40px;
    border-top-left-radius:4px;
    border-top-right-radius:4px;
}
.forum-post-item-header-text {
    padding: 8px 8px 8px 48px;
    font-size: 12px;
    font-weight: bold;
    line-height: 22px;
    color: #555;
}
.forum-post-item-header-text .mdi:before {
    font-size:18px;
}
.forum-post-user-pic {
    width:40px;
    height:40px;
    float:left;
    border-top-left-radius:4px;
}
.forum-post-item-body {
    padding:8px;
}
.forum-post-actions {
    float:right;
    position:relative;
    top:5px;
    right:8px;
    margin-left:10px;
}
.forum-post-actions a,
.forum-post-actions a:active,
.forum-post-actions a:visited,
.forum-post-actions a:link {
    text-decoration:none;
    display:inline-block;
    font-size:20px;
    color:#666;
    text-align:center;
    line-height: 25px;
    width:30px;
    height:30px;
    background-color:transparent;
    border-radius:50%
}
.forum-post-actions a:hover {
    color:#333;
    background-color:rgba(0,0,0,0.1);
}
.forum-post-actions a span {
    vertical-align:middle;
}
.forum-post-inappr-msg {
    padding:4px 8px;
    margin-top:8px;
    display:inline-block;
    border-width: 1px;
    border-style: solid;
    border-radius: 3px;
}
.forum-topic-header {
    font-size:16px;
}

/************************************************************************ */
/* brochure edit (end user UI field shown in admin UI) */
/************************************************************************ */
#br_flds .form-group {
    border-bottom:solid 2px #e0e2e7;
    margin:0;
    background-color:#f5f5f5;
}
#br_flds .form-group:last-child {
    border-bottom:none;
}
#br_flds .form-container {
    border: solid 2px #e0e2e7;
    padding:0;
}
#br_flds .form-container:not(:last-child) {
    margin-bottom:10px;
}
#br_flds .col-sm-2 {
    width:28%;
}
#br_flds .col-sm-10 {
    width:72%;
    padding:0px;
    border-left:solid 2px #e0e2e7;
    background-color:#fff;
}
#br_flds .brochure-field {
    padding:8px;
    padding-right: 28px;
}
#br_flds .brochure-non-editable {
    min-height:30px;
}
#br_flds .label-title {
    font-size:11px;
}
#br_flds .control-label {
    padding-right:10px;
}
#br_flds .placeholder {
    color:#aaa;
}
.brochure-plain-text {
    border: 0;
}
.brochure-plain-text::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #aaa;
  opacity: 1; /* Firefox */
}
.brochure-plain-text:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #aaa;
}
.brochure-plain-text::-ms-input-placeholder { /* Microsoft Edge */
  color: #aaa;
}
.brochure-plain-text.br-fld-medium {
    width: 60%;
}
.brochure-plain-text.br-fld-large {
    width: 100%;
}
.btn-save-brochure-container {
    display:none;
    padding:2px 0 4px 4px;
}
.btn-cancel-brochure {
    display:none;
}
.br-grp-head {
    font-weight:bold;
}
.br-grp-show-in-cat {
    float:right;
    font-weight:normal;
}
.icon-show-in-cat {
    position: absolute;
    right: 5px;
    top: 5px;
}
.icon-show-in-cat .mdi {
    font-size:24px;
    line-height:18px;
}
.icon-show-in-cat.pending {
    opacity:0.2;
}
.brochure-clone-item {
    display:none;
}
.br-chb-grp {
    display:none;
}
.br-audience-grp-other {
    clear:both;
}
[data-div-placeholder]:empty::before {
    content: attr(data-div-placeholder);
    color: #ccc;
    cursor: text;
}

[data-div-placeholder]:empty:focus::before {
    content: "";
}
/****************************************************************************/
/* New Brochure edit iframe - shown in end user UI for Work Unit Curriculum */
/****************************************************************************/
#f_brochure_edit {
    width:100%;
    border: 0;
    overflow:hidden;
}

/************************************************************************ */
/* custom checkboxes */
/************************************************************************ */
.sr-cb-cont {
    display: inline-block;
    position: relative;
    padding-left: 26px;
    padding-top: 3px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 12px;
    font-weight:normal;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default checkbox */
.sr-cb-cont input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

/* Create a custom checkbox */
.sr-cm {
    position: absolute;
    top: 0;
    left: 0;
    height: 22px;
    width: 22px;
    background-color: #eee;
    border-radius: 4px;
}

/* On mouse-over, add a grey background color */
.sr-cb-cont:hover input ~ .sr-cm {
    background-color: #ccc;
}

/* When the checkbox is checked, add a coloured background */
.sr-cb-cont input:checked ~ .sr-cm {
    background-color: #009933;
}

/* Create the checkmark/indicator (hidden when not checked) */
.sr-cm:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.sr-cb-cont input:checked ~ .sr-cm:after {
    display: block;
}

/* Style the checkmark/indicator */
.sr-cb-cont .sr-cm:after {
    left: 8px;
    top: 4px;
    width: 7px;
    height: 12px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.access-chbs .sr-cb-cont {
    float:left;
    width:200px;
}

/************************************************************************ */
/* custom radio buttons */
/************************************************************************ */
.sr-rd-cont:checked,
.sr-rd-cont:not(:checked) {
    position: absolute;
    left: -9999px;
}
.sr-rd-cont:checked + label,
.sr-rd-cont:not(:checked) + label
{
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
    color: #666;
    margin-right:10px;
}
.sr-rd-cont:checked + label:before,
.sr-rd-cont:not(:checked) + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 18px;
    height: 18px;
    border: 1px solid #ddd;
    border-radius: 100%;
    background: #fff;
    box-sizing: content-box;
}
.sr-rd-cont:checked + label:after,
.sr-rd-cont:not(:checked) + label:after {
    content: '';
    width: 12px;
    height: 12px;
    background: #5bc0c0;
    position: absolute;
    top: 4px;
    left: 4px;
    border-radius: 100%;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
    box-sizing: content-box;
}
.sr-rd-cont:not(:checked) + label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
.sr-rd-cont:checked + label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}

/************************************************************************ */
/* Attach (paperclip) icons in subject rows */
/************************************************************************ */
.cell-attach-link {
    float: right;
}
.cell-attach-link .attach-link {
    position: relative;
    top: 2px;
    display: inline-block;
}
.cell-attach-link .attach-link:hover {
    opacity: 0.7;
}
.attach-link .mdi.mdi-attachment {
    font-size: 24px;
    line-height: 8px;
}
/************************************************************************ */
/* LMS Journal */
/************************************************************************ */
.lms-log-item pre {
    white-space: normal;
    word-break: normal;
}

/************************************************************************ */
/* Default colours used in all colour schemes */
/************************************************************************ */
.highlight-bg-color {
    background-color:#dbf3dd;
}
.highlight-border-color {
    border-color:#009933;
}

/******************************************************/
/* Become user */
/******************************************************/
.sudo-outer {
    position: fixed;
    top: 0;
    width: 100%;
    pointer-events: none;
    z-index:1040;
}
.sudo-inner {
    margin: 0 auto;
    max-width: 300px;
    pointer-events: all;
    text-align:center;
    border-bottom-left-radius:5px;
    border-bottom-right-radius:5px;
}
.sudo-msg {
    cursor:pointer;
}
.sudo-msg-add {
    padding:0 5px 5px;
    display:none;
}
.sudo-msg-add .btn-sudo {
    background-color:transparent;
    font-size:13px;
}
/******************************************************/
/* Offline Assessment (move to lms_assess.css) */
/******************************************************/
.input-group-addon.toggle-password .mdi {
    top:0;
    font-size:20px;
    cursor:pointer;
}
#setup_oa {
    display:none;
}
.lms-list.no-border {
    border:0;
}
.lms-list .list-item:not(:last-child) {
    border-bottom:solid 1px rgb(221, 221, 221);
}
.lms-list .list-item.list-empty {
    padding:15px;
    text-align:center;
}
.list-item-inner {
    display:flex;
    padding:10px;
}
.list-item-data {
    flex-grow:1;
}
.list-item-actions {
    min-width:190px;
    text-align: right;
}
.attempt-list-actions .badge {
    margin-right: 5px;
    background-color: #1b72b9;
}
#offline_key_entry {
    display:none;
}
.li-data-info-label {
    font-weight:bold;
}
.li-data-container {
    margin-bottom: 3px;
}
#no_sync_offline {
    display:none;
}
.offline-lr-id + .select2-container {
    display:block;
    width:100% !important;
}
#offlineSyncList .list-item {
    border-bottom-color:#f6f6f6;
}
#offlineSyncList .attempt-item.last-item {
    border-bottom:solid 1px #ddd;
}
#offlineSyncList .attempt-item {
    overflow:hidden;
    padding:3px 12px;
}
button.btn-default.disabled-with-tt {
    background-color: #fff;
    border-color: #ccc;
    opacity:0.65;
    filter: alpha(opacity=65);
    -webkit-box-shadow: none;
    box-shadow: none;
}
.panel-body.sync-panel {
    position:relative;
}

.panel-body.sync-panel .spinner-container {
    margin: 20px auto 10px;
    width: 40px;
    height: 40px;
}

/**************************************************************/
/* Devlog item styling */
/**************************************************************/
.panel-group.devlog-accord {
    margin-bottom: 3px;
}
.devlog-accord .panel-heading {
    padding: 3px;
    cursor:pointer;
}
.panel-heading-items {
    display:flex;
    flex-wrap: wrap;
}
.dl-table,
.dl-month-table {
    width: 100%;
    border: 0;
    border-collapse: collapse;
}
.dl-year,
.dl-months-container {
    border-top: solid 3px #ddd;
    border-bottom: solid 3px #ddd;
}
.dl-month-empty-dot {
    font-size: 20px;
    line-height: 6px;
    color: #ddd;
    padding: 0 20px;
    display: inline-block;
    vertical-align: middle;
}
.dl-year {
    color: #555;
    font-size: 20px;
    width: 80px;
    padding: 5px;
}
.dl-month-empty,
.dl-month {
    color: #555;
    font-size: 16px;
    width: 60px;
}
.dl-month-items {
    padding: 3px 0;
}
.dl-list-icon {
    font-size: 34px;
    line-height: 20px;
    flex: 0 0 40px;
}
.dl-list-result {
    line-height: 20px;
    flex: 0 0 40px;
}
.dl-list-result .result-icon {
    font-size: 24px;
    line-height: 24px;
    width: 25px;
    height: 25px;
    border: solid 2px;
    border-radius: 50%;
    position: relative;
    top: 6px;
}
.dl-list-result .sr-icon-tick-sm {
    border-color: #4cae4c;
    color: #4cae4c;
}
.dl-list-result .sr-icon-dismiss-sm {
    border-color: #d40000;
    color: #d40000;
}
.dl-list-result .mdi-color-helper {
    border-color: #2c54c7;
    color: #2c54c7;
    padding: 1px 2px;
    font-size: 20px;
}
.result-icon.mdi-color-helper::before {
    position: relative;
    top: -8px;
}
.dl-list-title {
    flex: 1;
    font-weight: bold;
    line-height: 30px;
    height: 30px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.dl-btn-more-col {
    text-align:right;
}
.devlog-accord .panel-heading .accordion-toggle:after {
    /* symbol for "opening" panels */
    font-family:"Material Design Icons";
    content: "\f13f";
    float: right;
    color: grey; 
    font-size: 26px;
    line-height: 34px;
}
.devlog-accord .panel-heading.collapsed .accordion-toggle:after {
    content: "\f13c";
}
.dl-txt-val {
    line-height: 14px;
}
.lr-out-obj-view .mdi,
.dl-view-item .mdi {
    font-size: 18px;
    line-height: 10px;
    vertical-align: middle;
    top: 0;
    left: 0;
}
.dl-obj-item-type span {
    font-size: 28px;
    line-height: 12px;
    vertical-align: middle;
    position: relative;
    top: -3px;
}
.dl-linked-items-col ul.list-group {
    width: auto;
}
#dev_log_form input.form-control.highlight-bg {
    background-color: #e4fbff;
}


.inline-keyword-container {
    display:flex;
}
.inline-keyword-label {
    flex:0 0 90px;
    padding-top: 8px;
    text-align: right;
}
.inline-keyword-field {
    flex: 1;
}
.input-group-from-record {
    width:190px;
}
.input-group-show-record {
    width:145px;
}
.input-group-row .form-group {
    display:inline-block;
}

@media (max-width: 992px) {
    .input-group-from-record {
        margin-left:90px;
    }
    .input-group-row {
        margin-top:5px;
    }
    .dl-year-filter {
        margin-left: 90px;
        margin-top: 10px;
    }
}
.accordion-control .link-color {
    font-size:12px;
    cursor:pointer;
}
.accordion-control .link-color:hover {
    text-decoration:underline;
}
.link-hide-all {
    margin-left:10px;
}
.panel-body.bs-col-layout.dl-panel-body {
    padding: 0;
}
.dl-body-main {
    display: flex;
    padding: 8px;
}
.dl-body-main.with-objlist {
    border-bottom: solid 1px #ddd;
}
.dl-fields {
    flex: 1;
}
.dl-more-btn {
    flex: 0 0 100px;
    text-align: center;
    margin: auto;
}
/******************************************************/
/* Learner Add to list function */
/******************************************************/
.modal-learner-list .list-group-item .badge {
    display: none;
}
.modal-learner-list .list-group-item.list-group-item-success .badge {
    background-color: #3c763d;
    display: inline-block;
    padding: 3px;
    margin-top: -2px;
}
.modal-learner-list .list-group-item .badge .mdi {
    font-size: 16px;
    line-height: 14px;
    position: relative;
    top: 0;
    left: 0;
}
.modal-learner-list .list-group-item:not(.list-group-item-success):hover {
    background-color: #eee;
}
.modal-learner-list .list-group-item {
    cursor: pointer;
}
.modal-learner-list .list-group-item .learner-name {
    font-weight: bold;
    display: inline-block;
    margin-right: 10px;
}
.modal-learner-list .list-group-item .learner-org {
    font-size: 12px;
    display: inline-block;
}

/******************************************************/
/* Accreditaion add-row functionality */
/******************************************************/
.ac-table-container {
    float: left;
    padding-right: 15px;
    padding-bottom: 15px;
}
.ac-table {
    display: table;
}
.ac-table-row {
    display: table-row;
}
.ac-table-cell {
    display: table-cell;
    padding: 2px 5px;
}
.ac-table-header,
.ac-table-footer {
    font-weight: bold;
}
.form-inline .form-control.ac-table-hours-fld {
    width: 70px;
}
.ac-type-btns-container {
    float: left;
    padding-left: 5px;
    padding-top: 10px;
}
.ac-type-btns-container input[type="button"] {
    display: block;
    width: 142px;
    margin-bottom: 8px;
}

.btn-item-row-del {
    margin-right: 5px;
}

/******************************************************/
/* 'Report loading' form-post display */
/******************************************************/
.report-loading-outer {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: rgba(200,200,200,0.5);
    z-index: 10;
}
.report-loading-inner {
    margin: 0 auto 0;
    position: relative;
    top: 50%;
    width: 260px;
    text-align: center;
    padding: 10px 15px;
    background-color: #c3c3c3;
    border-radius: 10px;
}
.report-loading-text span {
    font-size: 20px;
    font-weight: bold;
    color: #333;
}
.report-loading-text .lds-ellipsis {
    height: 20px;
}
.report-loading-text .lds-ellipsis div {
    top: 11px;
    width: 6px;
    height: 6px;
    background-color: #333;
}
/* Assess tutor marking results section fix */
/* (until we can switch to new assess display template) */
.alert-assessment-overallresult {
    width: auto;
    padding: 8px;
    margin: 8px;
}
.assess-results .form-group {
    display: inline-block !important;
    white-space: nowrap;
    vertical-align: top;
}
.assess-results .form-group .col-sm-2.control-label,
.assess-results .form-group .col-sm-10 {
    width: auto;
}

.assess-results .form-group .col-sm-10 span.form-view-value {
    display: inline-block;
}
.assess-results .form-group .col-sm-2 .label-title,
.assess-results .form-group .col-sm-10 span.form-view-value {
    padding-top: 6px;
}

/************************************************************************ */
/* multi-factor-authentication */
/************************************************************************ */
.mfa-code-input-group {
    width:300px;
}
.mfa-code-input-group span.mdi {
    font-size: 22px;
    top:0;
}

/* Copy to clipboard           */
/************************************************************************ */
a.clipboard-only-icon span.mdi {
    font-size: 20px;
    margin: 0 5px;
    position: relative;
    top: 4px;
    line-height: 12px;
}

/************************************************************************ */
/* Developer Debug Tools           */
/* Hit ctrl-1 to toggle visibility */
/************************************************************************ */
.n6debug {
    display : none;
}

.checkbox-confirm-container {
    display: inline-block;
    padding: 2px 15px;
    border: solid 1px #ccc;
    border-radius: 5px;
}
.checkbox-confirm-container input,
.checkbox-confirm-container label {
    cursor: pointer;
}

/******************************************************/
/* Print as PDF instructions */
/******************************************************/
#pdf_print_instructions {
    border-style:solid;
    border-width:1px;
    border-radius: 5px;
    opacity: 0.9;
    position: absolute;
    top:10px;
    right:10px;
    width:210px;
    height:60px;
}
#pdf_print_instructions .close {
    position: absolute;
    top: 5px;
    right: 5px;
    font-size: 24px;
    line-height: 13px;
    font-weight: bold;
    cursor: pointer;
    opacity: 1;
}
#pdf_print_instructions .pdf-print-min span.mdi {
    font-size: 28px;
}
#pdf_print_instructions .pdf-print-expand ol {
    padding-left: 15px;
}
#pdf_print_instructions .pdf-print-min {
    cursor: pointer;
}
#pdf_print_instructions .pdf-print-min,
#pdf_print_instructions .pdf-print-expand {
    padding:10px;
}
#pdf_print_instructions .pdf-print-expand {
    display:none;
}
@media print {
    #pdf_print_instructions {
        display:none;
    }
}

/******************************************************/
/* Catalog basket */
/******************************************************/
.cat-basket-count-container {
    border-radius: 4px;
    margin: 2px 5px 0;
}
span.cat-basket-total {
    font-size: 18px;
    line-height: 12px;
    font-weight: bold;
}
.cat-basket-count-container span[class^="sr-icon-"] {
    font-size: 40px;
    line-height: 12px;
    vertical-align: top;
    display: inline-block;
    color:#333 !important;
    padding: 4px 0 0 5px;
}
.cat-basket-count-container .caret {
    color:#333 !important;
}
.cat-basket-count-container .caret.disabled {
    opacity: 0.1;
}
.cat-item-text-list li a {
    cursor: default;
}
.cat-basket-item-remove {
    position: absolute;
    right: 10px;
    font-size: 22px;
    line-height: 18px;
    font-weight: bold;
    color: #333;
    cursor: pointer;
}