@media all {
    html { font-size: 90%; font-weight: 400; }
    html, td, input, button, select, textarea { font-family: Roboto, Arial, Helvetica, sans-serif; }
    body { padding: 0; margin: 0; font-size: 1em; background: #fff; overflow: hidden; }
    .noList, .noList > li { list-style: none; margin: 0; padding: 0; }
    input, select, textarea, button { font-size: 1em; }
    .clearFix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
    .clear { clear: both; }
    .pad { padding: 15px 2%; }
    a i.material-icons, button i.material-icons { font-size: 1.4rem; }
    .mainContent a { text-decoration: none; color: #212121; }
    .mainContent a.emph:hover { text-decoration: underline; }

    .mainContent.scrollContent.hasToolbar { top: 145px; padding: 1em 0 2em; }

    h3.indent { margin-top: 30px; margin-left: 2%; }

    form { }
    fieldset { border: none; border-radius: 3px; padding: 1em 2%; background: #fff; }

    body.overlay:before { content: ''; display: block; position: fixed; left: 0; right: 0; top: 0; bottom: 0; background-color: rgba(0,0,0,.5); z-index: 10003; }

    #sideBar fieldset { padding: 1em 20px; }
    legend { font-weight: 600; font-size: 1.2em; margin: 0 0 .5em -2px; text-transform: uppercase; color: #7e8387; display: none; }
    fieldset.enableLegend legend { display: block; float: left; width: 100%; padding-bottom: .75em; margin: 1em 0 1.5em -2px; border-bottom: solid 1px #ddd; }
    label { display: inline-block; font-size: 1em; width: 12em; vertical-align: top; padding-top: .65em; }
    form.overAndUnder label:not(.error), fieldset.overAndUnder label:not(.error), li.overAndUnder label:not(.error) { display: block; width: unset; margin-bottom: .5em; }
    label.after { margin-bottom: 0; margin-left: .25em; padding-top: 0; width: auto; }
    label.error { display: inline-block; font-size: smaller; background: #BF4949; padding: .25em .5em; width: auto; color: #fff; margin-left: 1em; margin-top: .5em; }
    #sideBar label.error { margin-left: calc(12rem + 3px); }
    #sideBar textarea.xxl + label.error { margin-left: 0; }
    #sideBar form.overAndUnder label.error { margin-left: 0; }
    #sideBar form.overAndUnder input.datePicker + label.error { margin-left: 1em; }
    #sideBar textarea.overAndUnder { display: block; }
    #sideBar textarea.overAndUnder + label.error { margin-left: 0; }
    #sideBar #textMessageForm .field label.error { margin-left: 0; margin-bottom: .5rem; }

    label > small { display: block; padding-top: .3em; color: #888; max-width: 90%; }
    label.after > small { max-width: none; }
    label.textareaLabel { width: auto; display: block; }
    input.textBox, textarea.textBox, select, .tablesorter input { padding: .5em .75em; border: solid 1px #ccc; width: 15em; }
    input.textBox, textarea.textBox, select { width: calc(100% - 1.5em - 2px); max-width: 15em; }
    input[readonly] { opacity: .7; border-color: #e1e1e1; }
    select { min-width: 25em; width: auto; }
    select.large { min-width: 31.5em; }
    select.small { min-width: 12em; }
    input.textBoxNumeric, input.small { max-width: 7em; }
    input.xsmall { max-width: 3em; }
    textarea.textBox { max-width: 30em; height: 5em; resize: vertical; }
    input.checkBox, input[type="checkbox"] { width: 1.25rem; height: 1.25rem; -webkit-appearance: none; border: solid 1px #bbb; background: #fff; border-radius: 2px; vertical-align: top; position: relative; top: -3px; cursor: pointer; }
    input.checkBox:checked::after, input[type="checkbox"]:checked::after { content: "✓"; display: block; position: relative; font-size: 1rem; font-family: Arial, Helvetica, sans-serif; font-weight: 700; left: 2px; line-height: 1.155rem; }
    input.checkBox { margin-left: 12.25em; }
    table.dataTable .col input[type="checkbox"] { top: 0; }
    input[type="radio"] { -webkit-appearance: none; width: 15px; height: 15px; border: solid 1px #adadad; border-radius: 50%; line-height: 1.25em; position: relative; top: -2px; font-family: Arial, Helvetica, Sans-serif; font-size: 15px; cursor: pointer; }
    input[type="radio"]:checked::after { background: #636363; content: ""; width: 7px; height: 7px; display: block; border-radius: 50%; transform: translateX(3px) translateY(3px); }
    input.checkBox:disabled, input[type="checkbox"]:disabled, input[type="radio"]:disabled { opacity: .5; cursor: not-allowed; }

    input.large { max-width: 30em; }
    .textBox.small + .textBox.medium { max-width: 21.1em; }
    textarea.xl { height: 12em; }
    textarea.xxl { height: 25em; max-width: 45em; }
    textarea.overAndUnder { clear: both; margin-top: 1em; }
    input.error, select.error, textarea.error { border-color: #DAA7A7 !important; background: #FFF6F6 !important; }
    input:focus, textarea:focus, select:focus { outline-color: #adc2d8; }
    button, .button { border: solid 1px #E1E6E8; padding: .5em 1em; background: #F1F2F3; border-radius: 1px; cursor: pointer; margin-right: 1em; outline: none; }
    html.noTouch button:not(.disabled):hover { background: #53a93f; color: #fff; border-color: #499437; }
    html.noTouch button.disabled:hover { cursor: not-allowed; }
    html.noTouch button#toolbarButtondelete:not(.disabled):hover { background: #c14a4a; color: #fff; border-color: #a84040; }

    html.noTouch button.disabled, html.touch button.disabled, html.noTouch .button.disabled, html.touch .button.disabled { background: #fff; border-color: #fff; color: #777; cursor: default; }
    button.smallButton { padding: .35em 1em; margin-top: .5em; font-size: .9em; }
    button.iconButton { padding: .4em 1em; margin-bottom: .1em; vertical-align: middle; }
    button.iconButton i { vertical-align: middle; }
    .formList > li { padding: .5em 0; }
    .formList > li > label:not(.after) { font-weight: 500; }
    .formList > li > label > small { font-weight: 400; overflow: hidden; text-overflow: ellipsis; }
    .formList.sideBySide li { display: inline-block; padding-right: 1em; }
    .formList.sideBySide li label { width: auto; margin-right: 1em; }
    .formList li.navigation { padding-top: 1.5em; }
    .formList li.navigation a { text-decoration: none; margin-right: 1em; color: #212121; }
    .formList li.navigation button { min-width: 8em; margin-left: 12.25em; margin-right: 3em; }
    .formList li.navigation.noIndent button { margin-left: 0; }
    .formList .radioList { display: inline-block; padding-top: .2em; margin-bottom: 1em; }
    .formList .radioList label.error { float: right; }
    .formList .radioList li { padding-bottom: 0; margin-left: -.35em; }
    .formList h3 { text-transform: uppercase; color: #7e8387; border-bottom: solid 1px #ddd; padding-bottom: .75em; margin: 1.5em 0; }
    .formList h3.first { margin-top: .5em; }
    .formList li.conditional { display: none; }
    .formList li small.fieldInfo { display: block; margin: .5rem 0 0 12.5rem; line-height: 1.5em; }
    form div.status { position: fixed; top: 105px; padding: .5em 1em; background: #dadada; display: none; color: #111; border-radius: 3px; box-shadow: #fff 0 0 15px 10px; z-index: 10002; }
    .loginpage form div.status { position: static; margin-top: 2em; }
    form#courseInstanceDatesForm div.status { z-index: 10010; }
    form div.status.noIndent { margin-left: 0; }
    form div.status.success { background: #53a93f; color: #fff; }
    form div.status.error { background: #BF4949; color: #fff; }
    form .formNotice { margin: 0 0 0 .5em; display: inline-block; padding: .5em; background: #FFFCC1; }
    form .field { display: inline-block; width: 30em; }
    form .field.wide { width: unset; }
    form .selector.field { width: unset; position: relative; }
    form .selector ul { display: inline-block; width: 18em; border: solid 1px #ccc; padding: 3px; min-height: 68px; height: 100%; vertical-align: top; margin-right: 2em; position: relative; z-index: 2; }
    form .selector ul:last-child { margin-right: 0; }
    form .selector ul li { background-color: #f5f5f5; font-size: .9em; padding: .5em; margin-bottom: 1px; cursor: pointer; max-width: calc(100% - 1em); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    form .selector ul li:last-of-type { margin-bottom: 0; }
    form .selector ul.sourceList li.selected { display: none; }
    form .selector i { vertical-align: middle; font-size: 2em; line-height: 1.4em; color: #999; position: absolute; top: 50%; left: 0; right: 0; -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); text-align: center; }
    form .selector select option { }
    form .selector .targetList li:hover { background: #efcccc; }
    form .selector .sourceList li:hover { background: #c0e6c0; }
    form .selector select:active, form .selectorselect:hover { outline: none; background: transparent !important; }

    form .charCountWrapper { display: block; font-size: .9em; }
    form .charCount { display: inline-block; background-color: #efefef; padding: .25em; }
    form .charCount.maxed { background-color: #BF4949; color: white; }

    form .filePicker { }
    form .filePicker .preview { padding: .35em; border: solid 1px #e1e1e1; max-width: 12em; max-height: 11em; min-height: 6em; text-align: center; position: relative; }
    form .filePicker .preview img { display: block; max-height: 6em; margin: 0 auto; max-width: 100%; }
    form .filePicker .preview .remove { position: absolute; bottom: .45em; right: .45em; color: white; width: 26px; height: 26px; border-radius: 50%; background-color: #BF4949; opacity: .8; }
    form .filePicker .preview .remove i { font-size: 1.2em; display: inline-block; vertical-align: middle; line-height: 26px; }
    form .filePicker .preview:hover .remove { opacity: 1; }
    form .filePicker .upload { display: inline-block; width: 12em; height: 6em; text-align: center; border: solid 1px #e1e1e1; color: #999; line-height: 6em; }
    form .filePicker .upload i { font-size: 2em; display: inline-block; vertical-align: middle; }
    form .filePicker .preview a .file { font-size: 2.4em; color: #777; margin-top: .45em; }
    form .filePicker .preview a span { display: block; width: 100%; overflow: hidden; font-size: .75em; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; }
    form .CodeMirror { display: inline-block; width: 50em; margin-top: .5em; border: solid 1px #ccc; }
    form .fieldLockTrigger { display: inline-block; margin-left: .25em; vertical-align: middle; cursor: help; color: #999; }
    form .fieldLockTrigger:hover { opacity: 1; color: #999 !important; }

    form .formList .formInputNote { display: block; margin-left: 12.25rem; margin-top: .5rem; }

    form select.required.error + label.error { display: none !important; }
    form select.required.error + label.error + .chosen-container > .chosen-choices { border: solid 1px #DAA7A7; }


    .pickmeup { z-index: 10006 !important; }

    .searchBox { border-bottom: solid 1px #ddd; margin-bottom: 1em; padding-bottom: 1em; }
    .searchBox .formList li { float: left; margin-right: 1em; }
    .searchBox label { display: block; padding: 0 0 .5em; }
    .searchBox .formList li.navigation button { min-width: 8em; margin: .8em 0 0; }

    #courseLocationForm .button i { vertical-align: middle; position: relative; margin-top: -3px; }
    #courseLocationForm .button[disabled] { opacity: .5; cursor: not-allowed; pointer-events: none; }

    #sideBar #newJobConsultantForm div.error { color: #BF4949; border: solid 1px #BF4949; padding: 1em; margin-bottom: 1em; display: none; }

    #mainNav { position: fixed; top: 0; left: 0; bottom: 0; z-index: 10; width: 100px; background: #012538; }
    .singleSectionMode #mainNav { display: none; }
    #mainNav a { display: block; text-align: center; color: #C2CAD2; text-decoration: none; border-bottom: solid 1px rgba(255,255,255,.15); }
    #mainNav li:first-of-type a { border-top: solid 1px rgba(255,255,255,.15); }

    #logoLink { height: 90px; }
    #mainNav ul li a { padding: 1.3em 15px; }

    html.noTouch #mainNav:hover ul li a { color: #fff; }
    #mainNav ul li a.active, html.noTouch #mainNav ul li a:hover { padding-left: 10px; }
    #mainNav ul li a i { font-size: 2.1em; }
    #mainNav ul li a span { display: block; text-align: center; font-size: .75em; padding-top: .2em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }

    #mainNav ul { max-height: calc(100% - 88px); overflow-y: auto; overflow-x: hidden; }

    #mainNav ul::-webkit-scrollbar { width: 4px; background-color: rgba(255,255,255,0.75); -webkit-border-radius: 2px; }
    #mainNav ul::-webkit-scrollbar:hover { background-color: rgba(255,255,255,0.8); }
    #mainNav ul::-webkit-scrollbar-thumb { max-height: 5em; }
    #mainNav ul::-webkit-scrollbar-thumb:vertical { background: rgba(0,0,0,0.5); -webkit-border-radius: 2px; }
    #mainNav ul::-webkit-scrollbar-thumb:vertical:active { background: rgba(0,0,0,0.61); -webkit-border-radius: 2px; }

    .dashboard main .header:first-child h1.firstHeader { float: left; }
    /*.dashboard.hasPrimaryAdministrators main .header:first-child h1 { top: 1.4em; }*/
    .dashboard .mainContent { padding-right: 1.5em; padding-bottom: 1.5em; background: #fff; }
    .dashboard .column { float: left; }
    .dashboard .mainColumn { width: 66.66%; display: flex; margin: 0 0; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; align-items: stretch; -ms-flex-direction: row; -webkit-flex-direction: row; flex-direction: row; justify-content: flex-start; }
    .dashboard .asideColumn { width: 33.33%; }
    .dashboard .mainColumn .column { width: 47%; padding-right: calc(3% - 1px); border-right: solid 1px #ddd; }
    .dashboardBox { -ms-flex: 0 0 calc(50% - 1.5em); -webkit-flex: 0 0 calc(50% - 1.5em); flex: 0 0 calc(50% - 1.5em); align-self: auto; margin: 1.5em 0 2em 1.5em; padding: 0; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; overflow: hidden; background: #fff; }
    .dashboardBoxContent { padding-left: 2em; }
    .checkListBox .dashboardBoxContent { max-height: none; }
    .dashboard #primaryAdministratorToggle { position: fixed; margin-left: 1.3rem; margin-top: -4.5rem; color: white; }
    .dashboard #primaryAdministratorToggle i { vertical-align: middle; }
    .dashboard #primaryAdministratorToggle label { width: auto; margin-left: .1em; vertical-align: middle; padding-top: 0; font-size: .9em; cursor: pointer; }
    
    #sectionTree { position: absolute; top: 0; left: 100px; bottom: 32px; z-index: 5; width: 370px; background: #fff; border-right: solid 1px #ddd;  }
    .singleSectionMode #sectionTree { left: 0; }
    #sectionTree .treeHeader { position: relative; z-index: 5; }

    #sectionTree.narrow { width: 280px; }
    #sectionTree > ul { padding: 15px 5px; overflow: auto; position: absolute; width: 100%; bottom: 0; top: 88px; box-sizing: border-box; z-index: 5; background: white; }
    #sectionTree > ul li { display: block; }
    #sectionTree > ul div.clearFix { padding: .1em; }
    #sectionTree > ul ul div.clearFix { padding-left: 4em; }
    #sectionTree > ul ul ul div.clearFix { padding-left: 5.75em; }
    html.noTouch #sectionTree > ul div.clearFix:hover { background: #f8f8f8; }
    #sectionTree > ul li a { display: block; padding: .25em; color: #333; text-decoration: none; float: left; }
    #sectionTree > ul li a.item { min-width: 200px; margin-left: 1.75em; overflow: hidden; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; }
    #sectionTree > ul ul li a.item { max-width: 85%; }
    #sectionTree > ul li.has-children a.item { margin-left: 0; }
    #sectionTree > ul li a.more { float: right; padding: .25em .5em; display: none; }
    #sectionTree > ul li div.clearFix:hover a.more { display: block; }
    #sectionTree > ul li div.clearFix:hover a.more:hover { background: #fff; cursor: pointer; }
    #sectionTree > ul li div.clearFix.active { background: #F1F2F3; }
    #sectionTree > ul li a.item i { margin-right: 10px; vertical-align: middle; color: #5A6169; }
    #sectionTree > ul li a.item span:not(.toggler) { display: inline; vertical-align: middle; }
    #sectionTree > ul li a.item .toggler i { margin-right: 0; margin-left: 5px; }
    #sectionTree > ul li a.item .toggler-disabled { opacity: .25; }
    #sectionTree > ul li.empty .toggler { visibility: hidden; }
    #sectionTree > ul li a.more i { vertical-align: middle; }
    #sectionTree > ul li.has-children > ul { display: none; }
    #sectionTree > ul li.has-children.expanded > ul { display: block; }
    #sectionTree > ul li.has-children.expanded .toggler i { position: relative; color: transparent; }
    #sectionTree > ul li.has-children.expanded .toggler i::before { content: 'arrow_drop_down'; position: absolute; left: 0; top: 0; color: #5A6169; }

    .template1062 #sectionTree > ul > li { margin-bottom: .5em; }

    #sectionTree #treeFilterForm { position: absolute; left: 0; right: 0; top: 88px; z-index: 100001; background-color: #F9FAFB; padding: .25rem .65rem; border-bottom: solid 1px #CFD7E0; }
    #sectionTree #treeFilterForm input { border: none; background-color: transparent; outline: none; max-width: none; width: 100%; }
    #sectionTree #treeFilterForm + .navList { top: 125px; }

    #sectionTree .navList li.filtered { display: none; }
    #sectionTree > .navList li.noResults { padding: .5rem 1.1rem; }

    .treeMenu { display: none; position: absolute; top: 0; left: 371px; bottom: 0; width: 300px; background: #fff; z-index: 4; border-right: solid 1px #ddd; box-shadow: rgba(0,0,0,.1) 4px 0 8px 0; }
    .treeMenus.narrow .treeMenu { left: 291px; }
    .treeMenu > ul { margin: 15px; }
    .treeMenu > ul li { display: block; }
    .treeMenu > ul li a { display: block; padding: .5em; color: #333; text-decoration: none; }
    html.noTouch .treeMenu > ul li a:hover { background: #f8f8f8; }
    .treeMenu > ul li a i { vertical-align: middle; margin-right: 10px; color: #5A6169; }
    .treeMenu > ul li a span.confirm { display: none; }

    .header { height: 88px; text-align: left; padding: 0 20px; background: #004467; }
    .header h1 { margin: 0; font-size: 1.2em; font-weight: 700; text-transform: uppercase; color: #fff; position: relative; top: 3em; white-space: nowrap; max-width: 100%; overflow: hidden; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }
    .column .header h1 i { float: left; margin-right: .5em; color: #4f5861; position: relative; top: -1px; }

    .header.subHeader { height: 40px; background: #fff; padding: 0 0 0 10px; }
    .header.subHeader h1 { top: .85em; text-transform: none; font-size: 1.4em; font-weight: 400; color: #222; float: left; }
    .header.subHeader a { color: #333; text-decoration: none; font-size: .9em; float: right; margin: 1.9em 0 0; max-width: 6em; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

    .header h1 span.number::before { content: ' ('; }
    .header h1 span.number::after { content: ')'; }

    ul.breadcrumbList { font-size: 1.2em; font-weight: 700; text-transform: uppercase; position: relative; top: 3em; }
    ul.breadcrumbList li { display: inline-block; }
    ul.breadcrumbList li a { display: inline-block; text-decoration: none; color: #c3d0dc; }
    ul.breadcrumbList li a i { position: relative; top: 2px; }
    ul.breadcrumbList li a[href] { color: #fff; }
    ul.breadcrumbList li:not(:last-of-type) a:after { content: "/"; display: inline-block; width: 1em; text-align: center; vertical-align: middle; }
    ul.breadcrumbList li a span { display: inline-block; max-width: 240px; overflow: hidden; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
    html.noTouch ul.breadcrumbList li a[href]:hover { color: #c3d0dc; }

    ul.toolList { padding: 15px 2% 1.5em; top: 78px; transition: top ease-in-out .2s; }
    ul.toolList li { display: inline-block; margin-right: 1em; }
    ul.toolList li select { margin-right: 1em; }
    ul.toolList li em { display: inline-block; margin-right: 1em; }
    ul.toolList li input[type="checkbox"] { position: relative; top: -.15em; }
    ul.toolList li label { padding-top: 0; }
    main > ul.toolList { margin: 12px 0 0; border-bottom: solid 1px #eee; padding: 0 2% .75em; }
    ul.toolList button { margin-right: 0; outline: none; }
    ul.toolList .group > button:not(.disabled):hover { opacity: .8; background-color: #F1F2F3; border-color: #E1E6E8; color: inherit; }
    ul.toolList .group > button:after { content: '▼'; display: inline-block; margin-left: .75em; font-size: .67em; position: relative; top: -1px; }
    ul.toolList .group.active > button:after { content: '▲'; top: -2px; }
    ul.toolList .group .groupButtons { display: none; position: absolute; background-color: white; width: 100%; max-width: 15em; margin-top: .25em; z-index: 10001; box-shadow: rgba(0,0,0,.2) 0 0 2px 0; }
    ul.toolList .group .groupButtons button { display: block; width: 100%; border-bottom: none; text-align: left; }
    ul.toolList .group.active .groupButtons { display: block; }
    ul.toolList li form { border-right: solid 1px #ddd; margin-right: 1em; padding-right: 1em; }
    ul.toolList li form .formList.sideBySide label { vertical-align: text-bottom; }
    ul.toolList li form .formList.sideBySide > li { padding: 0; }

    body.scrolledToTabContent ul.toolList { position: fixed; z-index: 99; top: 88px; background: #fff; width: 100%; box-sizing: border-box; padding: 12px 1.5%; margin: 0; border-bottom: solid 1px #ddd; box-shadow: rgba(0,0,0,.15) 0px 6px 6px -5px; }

    #mobileHeader { display: none; }
    main { position: absolute; top: 0; bottom: 32px; left: 471px; right: 0; }
    .singleSectionMode main { left: 371px; }
    main.noTree { left: 100px; }
    main.narrowTree { left: 381px; }
    #userInfo { position: absolute; bottom: 0; left: 100px; right: 0; height: 11px; z-index: 5; padding: 10px 20px; font-size: .75em; text-align: right; background: #dbdee0; }
    .singleSectionMode #userInfo { left: 0; }
    #userInfo a { display: inline-block; margin-left: 1em; text-decoration: none; }
    #userInfo a:hover { text-decoration: underline; }
    .scrollContent { position: absolute; top: 88px; left: 0; right: 0; bottom: 0; overflow: auto; }




    div.card { padding: 20px 2%; margin-bottom: 2em; }
    div.card:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
    div.card .cardHeader h2 { font-size: 1.75em; font-weight: 400; margin: 0 0 1.2em; color: #222; float: left; }
    div.card .cardHeader a.edit { float: left; margin: .25em 0 0 2em; color: #313B45; text-decoration: none; }
    html.noTouch div.card .cardHeader a.edit:hover { color: #617182; }
    div.card ul.cardList { width: 30%; margin-right: 3%; float: left; }
    div.card ul.cardList li { padding: 0 0 .5em; }
    div.card ul.cardList li label { padding: 0 1em .25em 0; font-weight: 600; font-size: 1em; width: 15em; }
    div.card ul.cardList li div { line-height: 1.4em; }
    div.card ul.cardList li div.limited { max-height: 12em; overflow-y: auto; overflow-x: hidden; word-break: break-word; }
    div.card ul.cardList li div.limited.overflown { border-bottom: solid 1px #ddd; }
    .diplomaMasterTemplateCard ul.cardList li div { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    

    ul.enrollmentNoteList { margin: 15px 2% 1.5em; clear: both; }
    ul.enrollmentNoteList li { padding: .25em 0; }

    .enrollmentCard .userPhoto { margin-bottom: .5rem; }
    #enrollmentCompanyVatCountryCode option[data-note]:not([data-note=""]) { font-weight: bold; }

    .cardContent.entityNote { padding: 2em 2%; border-top: solid 1px #ddd; }
    .cardContent.entityNote p { max-width: 55em; line-height: 1.5em; margin: 0; }
    .cardContent.entityNote p + p { margin-top: 1em; }

    div.card .cardList .role + .role::before { content: ' | '; }
    div.card .cardList .role a:not([href]) { color: #222 !important; }

    .userPhoto { display: block; width: 70px; height: 90px; background-position: center center; background-size: cover; background-repeat: no-repeat; }
    .enrollmentTable .colStudent i { vertical-align: middle; font-size: 1.25em; margin-right: .05em; cursor: help; width: 1em; }
    .enrollmentTable .colStudent .name { display: inline-block; vertical-align: middle; }
    .userTable .colName i { vertical-align: middle; font-size: 1.25em; margin-right: .05em; cursor: help; width: 1em; }
    .userTable .colName .name { display: inline-block; vertical-align: middle; }


    ul.tabList { margin: 0 0 0 2em; overflow-x: auto; overflow-y: hidden; white-space: nowrap; }
    ul.tabList li { display: inline; }
    ul.tabList li a { display: inline-block; text-decoration: none; font-size: 1em; font-weight: 500; color: #222; margin-right: .005em; padding: .5em .55em; border: solid 1px #ccc; border-bottom: none; position: relative; top: 2px; z-index: 1; background: #f8f8f8; border-radius: 3px 3px 0; overflow: hidden; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; }
    ul.tabList li a.active { color: #617182; border-bottom-color: #fff; background: #fff; border-bottom: solid 1px #fff; z-index: 3; }
    ul.tabList li a.errors, ul.tabList li a.errors:hover { color: #ab2929 !important; background: linear-gradient(to bottom, rgb(247, 240, 240) 0%,rgba(255,255,255,0) 100%); }
    .tabContent { display: none; position: relative; top: -3px; z-index: 2; border-top: solid 1px #ccc; padding-top: 1em; padding-bottom: 2em; }
    .tabContent.active { display: block; }
    .tabContent.active[data-tab="attendance"]) { top: -3px; }
    .tabContent[data-error]:not([data-error=""])::before { content: attr(data-error); color: #fff; background: #ab2929; padding: .5em 1em; font-size: .9em; margin: .5em 2em; display: inline-block; border-radius: 3px; }
    .dataTable { border-collapse: collapse; width: 96%; display: none; margin: 0 2% 2em; }
    .dataTableFixed { table-layout: fixed; }
    .dataTable.hasFilters { margin-bottom: 0; }
    .resetDataTableFilter { margin: 1em 0 2em 2%; display: inline-block; font-size: .9em; padding: .5em 1em; background-color: #F1F2F3; float: left; }
    .dataTable.smaller { font-size: smaller; }
    .dataTable thead th { text-align: left; font-weight: 600; font-size: 1.05em; border-bottom: solid 4px #C2CAD2; padding: 0 24px .5em .85em; background-position: right .5em; background-repeat: no-repeat; white-space: nowrap; }
    .dataTable td { padding: .75em 1em; border: solid 1px #E1E6E8; vertical-align: top; white-space: nowrap; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
    .dataTable .col.nw { white-space: nowrap; }
    .dataTable tbody tr.even { background-color: #FDFDFD; }
    .dataTable tr.tablesorter-filter-row td { padding: .2em .25em; border-bottom-color: #CFD7E0; background: #F9FAFB; position: relative; }
    .dataTable tr.tablesorter-filter-row td a.help { position: absolute; top: -30px; right: 1.1em; color: #35548d; display: none; z-index: 10001; background-color: white; }
    .dataTable tr.tablesorter-filter-row td input.focus + a.help { display: block; z-index: 1000; }
    .dataTable thead td .tablesorter-filter { border: solid 1px #F9FAFB; font-size: .9em; background: #F9FAFB; width: 100%; }
    .dataTable thead td select.tablesorter-filter { padding: .349em .2em; font-size: .9em; min-width: 3em; max-width: none; }
    .dataTable thead td input.tablesorter-filter::-webkit-search-cancel-button { -webkit-appearance: none; }
    .dataTable thead td input.tablesorter-filter:focus::-webkit-search-cancel-button { -webkit-appearance: searchfield-cancel-button; }
    .dataTable thead td .tablesorter-filter.disabled { display: none; }
    .dataTable thead th:not(.sorter-false) .tablesorter-header { cursor: pointer; outline: none; }
    .dataTable thead .tablesorter-header-inner { white-space: nowrap; }
    .dataTable th.tablesorter-headerAsc { background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjI8Bya2wnINUMopZAQA7); }
    .dataTable th.tablesorter-headerDesc { background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjB+gC+jP2ptn0WskLQA7); }
    .dataTable .col.right { text-align: right; }
    .dataTable .col.center { text-align: center; }
    .dataTable .col .ellipsis { width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }
    body.busy .dataTable tbody { opacity: .5; }
    .tablesorter .filtered { display: none; }
    .tablesorter .tablesorter-errorRow td { text-align: center; cursor: pointer; background-color: #e6bf99; }

    .dataTable .sortable .col { vertical-align: middle; }
    .dataTable .sortable .colIcon i { cursor: move; color: #666; }

    .dataTable.smallDataTable { font-size: .9em; }
    .dataTable.smallDataTable th { font-size: 1em; font-weight: 500; }
    .dataTable.smallDataTable .col { padding: .35em .75em; }


    .dataTable .col.colTags { width: 6%; }
    .dataTable td.col.colTags { text-align: center; }
    .dataTable .col.colTags span { display: inline-block; background-color: #e27433; padding: 0 .5em; line-height: 1.35em; font-size: .9em; font-weight: 500; color: white; cursor: help; border-radius: 3px; }
    .dataTable .col.colTags span.tags { display: none; }

    .dataTable .col.colUserPhoto { text-align: center; width: 5%; }
    .dataTable .note { position: absolute; top: -.3rem; right: -.1rem; }
    .dataTable .note .icon { color: #e27433; cursor: help; display: block; }
    .dataTable .note .icon::before { content: '◥'; }
    .dataTable .note .tooltip { display: none; background-color: white; padding: 1em; font-size: .85em; width: 25em; position: absolute; right: -350%; bottom: 100%; white-space: normal; z-index: 20001; box-shadow: rgba(0,0,0,.35) 0 0 5px 0; border-radius: 2px; }
    .dataTable .note:hover .tooltip { display: block; }
    .dataTable .hasNote { position: relative; }
    .dataTable tbody tr .col:first-of-type .tooltip { right: -1100%; }
    .dataTable tbody tr:first-of-type .tooltip { top: 240%; bottom: auto; }

    .dataImportTable { display: block; margin: 0; }
    .dataImportTable .colMessage { }
    .dataImportTable .colMessage span { display: inline-block; color: white; background-color: #53a93f; padding: .25em .5em; font-size: .9em; max-width: 20em; white-space: normal; }
    .dataImportTable .col { vertical-align: middle; }
    .dataImportTable .error .colMessage span { background-color: #b70707; }
    .dataImportTable .warning .col { background-color: white; }
    .dataImportTable .warning .colMessage span { background-color: #dba100; }
    .dataImportTable tr.ignored { opacity: .35; text-decoration: line-through; }
    .dataImportTable tr.ignored .colMessage span { background-color: #a2a2a2; }
    .dataImportTable tr.processing { }
    .dataImportTable tr.processed { }
    .dataImportTable tr.processed.success .colMessage span { background-color: #53a93f; }
    .dataImportTable tr.processed.error .colMessage span { background-color: #b70707; }
    

    tr.anonymous td { position: relative; font-style: italic; }

    .genericNoteTable .colEntity { width: 15%; }
    .genericNoteTable .colCategory { width: 8%; }
    .genericNoteTable .colAuthor, .genericNoteTable .colDateTime { width: 12%; }
    .genericNoteTable .colText span { display: block; max-width: 40em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

    .tablesorter-pager { margin: 1em 2em; text-align: center; font-size: smaller; float: right; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; user-select: none; }
    .tablesorter-pager .disabled { opacity: 0.5; filter: alpha(opacity=50); cursor: default; color: initial !important; }
    .tablesorter-pager a { display: inline-block; margin: 0 .25em; cursor: pointer; vertical-align: middle; }
    .tablesorter-pager a i { font-size: 2em; vertical-align: middle; }
    .tablesorter-pager span { vertical-align: middle; display: inline-block; margin: 0 1em; }

    .enrollmentTable .tablesorter-filter-row td:first-child { border-left: solid 2px #C2CAD2; }
    .enrollmentTable tr.enrollmentState1 td:first-child { border-left: solid 2px #65aad8; }
    .enrollmentTable tr.enrollmentState2 td:first-child { border-left: solid 2px #FFE256; }
    .enrollmentTable tr.enrollmentState3 td:first-child { border-left: solid 2px #53a93f; }
    .enrollmentTable tr.enrollmentState4 td:first-child { border-left: solid 2px #DA5E5E; }
    .enrollmentTable tr.enrollmentState5 td:first-child { border-left: solid 2px #C2CAD2; }
    .enrollmentTable tr.enrollmentState6 td:first-child { border-left: solid 2px #af7acf; }
    .enrollmentTable tr.enrollmentState7 td:first-child { border-left: solid 2px #99e077; }

    .enrollmentTable tr.enrollmentState4 td,
    .enrollmentTable tr.enrollmentState5 td,
    .enrollmentTable tr.enrollmentState6 td { opacity: .6; }

    .enrollmentTable tr.enrollmentState3[data-stopped="true"] .col { background-color: #f1f1f1; opacity: .75; }
    .enrollmentTable tr.enrollmentState3[data-stopped="true"] .colStopped { font-weight: 700; }

    .enrollmentTable .colType { }
    .enrollmentTable .colType i { vertical-align: middle; font-size: 1.25em; margin-right: .25em; cursor: help; }
    .enrollmentTable .colType .ellipsis span { display: inline-block; vertical-align: middle; }




    .courseTable tr.inactive { opacity: .6; }

    .courseInstanceTable tr.cancelled { opacity: .6; }
    .courseInstanceTable tr.row td:first-child { border-left: solid 2px #C2CAD2; }
    .courseInstanceTable tr.row.full td:first-child { border-left-color: #FFE256; }
    .courseInstanceTable tr.row.overBooked td:first-child { border-left-color: #DA5E5E; }
    .courseInstanceTable tr.row.current td:first-child { border-left-color: #53a93f; }
    .courseInstanceTable tr.row.current td { background: #ebf5e1; }



    .courseInstanceInstructorTable .col.colAssistantInstructor { width: 15%; }

    .enrollmentExamTable .tablesorter-filter-row td:first-child, .enrollmentExamTable tr td:first-child { border-left: solid 2px #C2CAD2; }
    .enrollmentExamTable tr.passed td:first-child { border-left: solid 2px #53a93f; }
    .enrollmentExamTable tr.notPassed td:first-child { border-left: solid 2px #DA5E5E; }

    .courseInstancePersonalDataCollectionTable .colEnrollments,
    .courseInstancePersonalDataCollectionTable .colData,
    .courseInstancePersonalDataCollectionTable .colType,
    .courseInstancePersonalDataCollectionTable .colActive { width: 10%; }

    #enrollmentCompanySearchForm { padding: 1em 1.5em 2em; }
    #enrollmentCompanySearchForm .textBox { width: 25em; }
    .companyResultList li { padding: 1em 1.5em; border-bottom: solid 1px #ddd; }
    .companyResultList li:hover { background: #f5f5f5; }
    .companyResultList li a { text-decoration: none; color: inherit; display: block; position: relative; }
    .companyResultList li p { margin: 0 0 .25em; }
    .companyResultList li a > i { position: absolute; top: 0; right: 0; font-size: 1.4em; color: #ccc; }
    .companyResultList li .contactPerson { margin-top: .5em; }
    .companyResultList li .contactPerson i { font-size: 1.7em; float: left; margin-right: .25em; }
    .companyResultList li .contactPerson span { float: left; font-size: .9em; }

    #moveEnrollmentsSideBar form { margin-top: 2rem; padding-top: 2rem; border-top: solid 1px #e1e1e1; text-align: right; }
    #moveEnrollmentsSideBar form button { margin: 0 0 0 1rem; }

    .statsList h3 { margin-bottom: 0; max-width: 55rem; }
    .statsList .info { font-size: .8em; max-width: 55rem; display: block; }

    .statsTable { display: table; margin: 1rem 0 2em; }
    .statsTable td { -moz-user-select: all; -ms-user-select: all; -webkit-user-select: all; user-select: all; white-space: normal; }
    .statsTable td.dates { width: 15%; }
    .statsTable td.location { width: 25%; }
    .statsTable td.count { width: 8%; text-align: right; font-weight: 600; position: relative; }
    .statsTable tr:first-child td.count::before { font-weight: normal; font-size: .7em; text-transform: uppercase; position: absolute; left: .25rem; right: .25rem; text-align: center; top: -1rem; color: #004467; white-space: normal; overflow: hidden; text-overflow: ellipsis; }
    .statsTable tr:first-child td.enrollmentCount::before { content: attr(data-header); }
    .statsTable tr:first-child td.userCertificationCount::before { content: attr(data-header); }
    .statsTable tr:first-child td.passedEnrollmentCount::before { content: attr(data-header); }

    .statsTable tfoot td, .statsTable.summaryTable { background-color: #f7f7f7; }
    .statsTable tfoot tr:first-child td { border-top-width: 2px; }
    .statsTable tfoot tr:last-child td:first-child,
    .statsTable.summaryTable tr:last-child td:first-child { font-weight: bold; }

    #statsFilterForm { margin-bottom: 2rem; border-bottom: solid 1px #e1e1e1; padding-bottom: 1rem; }
    #statsFilterForm input.textBox + label { width: 2rem; text-align: center; }
    #statsFilterForm .formList > li > label:not(.after):first-of-type { width: 8em; }
    #statsFilterForm input[type="checkbox"],
    #statsFilterForm input[type="checkbox"] + label { vertical-align: middle; top: 0; }
    #statsFilterForm #groupBy,
    #statsFilterForm input[type="checkbox"] + label { margin-right: 2rem; }
    #statsFilterForm .dateButtonList { display: inline-flex; margin: 0; flex-direction: row; flex-wrap: wrap; max-width: 18em; position: absolute; margin-top: -.45rem; margin-left: 1rem; }
    #statsFilterForm .dateButtonList li { max-width: 16.66%; flex: 16.66%; box-sizing: border-box; padding: .1rem; }
    #statsFilterForm .dateButtonList li button.dateButton { padding: .25em .5em; font-size: .75em; text-transform: capitalize; width: 100%; margin: 0; }
    #statsFilterForm .dateButtonList li button.dateButton.active { background: #53a93f; color: #fff; border-color: #499437; }
    #statsFilterForm .navigation { padding-top: .5rem; }
    #statsFilterForm .navigation button { margin-left: 8.2rem; }


    .attendanceTable .colAttendance { width: 5%; text-align: center; }
    .attendanceTable span.stopped { text-decoration: line-through; cursor: help; }

    .tendencyCharts canvas { max-width: 80%; margin: 0 auto 4em; }

    .leadTable .col.colInterestedIn { max-width: 30em; }
    .sentMailTable .col.colName { max-width: 20em; }

    .sentTextMessageTable .col.colType { width: 7%; }
    .sentTextMessageTable .col.colMessage { width: 22%; max-width: 25em; }
    .sentTextMessageTable .col.colSentDate { width: 7%; }
    .sentTextMessageTable .col.colSentBy { width: 20%; }
    .sentTextMessageTable .col.colDelivered { width: 7%; text-align: center; }
    .sentTextMessageTable .col.colTo { width: 10%; }

    .sentTextMessageTable .tablesorter-filter-row td:first-child { border-left: solid 2px #C2CAD2; }
    .sentTextMessageTable tr.statusDelivered td:first-child { border-left: solid 2px #53a93f; }
    .sentTextMessageTable tr.statusEnroute td:first-child { border-left: solid 2px #FFE256; }
    .sentTextMessageTable tr.statusNotDelivered:not(.statusEnroute) td:first-child { border-left: solid 2px #DA5E5E; }

    html.noTouch .dataTable.grid tbody tr:hover td { background-color: #DDE3EA; cursor: default; }
    html.noTouch .dataTable.grid tbody tr.empty:hover td { background-color: inherit !important; }
    .dataTable.grid tbody tr.selected td { background-color: #D1D8E0 !important; opacity: 1 !important; }

    .dataTable td.past { text-decoration: line-through; color: #5a5a5a; }

    .courseInstanceDateTable .colDate { width: 15%; }
    .courseInstanceDateTable .col:nth-child(2), .courseInstanceDateTable .col:nth-child(3) { width: 10%; }
    .courseInstanceDateTable .col.colDisplayName { width: 10%; }
    .courseInstanceDateTable .colEvaluation { width: 12%; }
    .courseInstanceDateTable .colAgendaCount { width: 10%; }
    .courseInstanceDateTable .colTags { width: 15%; }

    .dataTable i.inline { font-size: 14px; position: relative; top: 2px; left: 5px; cursor: help; }

    .templateBlockValueTable .imageWrapper span, .diplomaMasterTemplateBlockTable .imageWrapper span { display: block; }

    #sideBar { position: fixed; z-index: 10005; top: 0; right: 0; bottom: 0; width: 300px; border-left: solid 1px #ddd; background: #fff; box-shadow: rgba(0,0,0,.1) -2px 0 4px 0; display: none; }
    #sideBar .sideBarContent { position: absolute; top: 88px; left: 0; right: 0; bottom: 0; overflow: auto; }
    #sideBar .header button { float: right; margin-top: 2em; margin-right: 0; padding: .25em .35em 0; font-size: .5em; }
    #sideBar .header button.close:hover { background: #bd2e2e; border-color: #bd2e2e; }
    #sideBar .sideBarContent .pad { padding: 1em 2em; }
    #sideBar .sideBarContent .dialogForm label { width: auto; }
    /*#sideBar .sideBarContent .error:not(.textBox):not(select):not(li) { color: #bd2e2e; border: solid 1px #bd2e2e; padding: 1em; margin: 1em; }*/
    #sideBar .sideBarContent a { color: #212121; text-decoration: none; }
    #sideBar .sideBarContent p.noResults:not(.pad) { padding: 1em 2em; }


    #sideBar .exportList li { margin-bottom: .5em; }
    #sideBar .exportList li a { display: inline-block; font-size: 1em; text-decoration: none; color: #333; background-color: #e1e1e1; padding: .5em 2em; min-width: 8em; }
    #sideBar .exportList li a i { vertical-align: middle; margin-right: .2em; font-size: 1.2em; }

    #sideBar #enrollmentAssessmentForm li { }
    #sideBar #enrollmentAssessmentForm li:not(.navigation) { clear: both; width: calc(100% - 2em); border-bottom: solid 1px #e1e1e1; padding: 1em 0 1em 2em; position: relative; }
    #sideBar #enrollmentAssessmentForm li input { position: absolute; left: 0; top: .85em; }
    #sideBar #enrollmentAssessmentForm li label { display: block; margin-bottom: .4em; padding-top: 0; }
    #sideBar #enrollmentAssessmentForm textarea { height: 1.4em; }

    #sideBar #courseInstanceDateAttendanceForm li { }
    #sideBar #courseInstanceDateAttendanceForm li:not(.navigation) { clear: both; width: calc(100% - 2em); border-bottom: solid 1px #e1e1e1; padding: 1em 0 1em 2em; position: relative; }
    #sideBar #courseInstanceDateAttendanceForm li input { position: absolute; left: 0; top: .85em; }
    #sideBar #courseInstanceDateAttendanceForm li label { display: block; margin-bottom: .4em; padding-top: 0; }
    #sideBar #courseInstanceDateAttendanceForm textarea { height: 1.4em; }

    #sideBar #examForm a.toggleLink { color: #212121; }
    #sideBar #examForm .enrollmentWrapper { width: 40em; margin-top: .65em; }
    #sideBar #examForm .enrollmentWrapper li:not(.navigation) { clear: both; width: calc(100% - 2em); border-bottom: solid 1px #e1e1e1; padding: 1em 0 1em 2em; position: relative; }
    #sideBar #examForm .enrollmentWrapper li input { position: absolute; left: 0; top: .85em; }
    #sideBar #examForm .enrollmentWrapper li .name { font-weight: 500; display: block; }
    #sideBar #examForm .enrollmentWrapper li .user { font-size: .8em; }

    #sideBar .enrollmentPickerForm .enrollmentWrapper li { padding: .75em 0; border-bottom: solid 1px #e1e1e1; }
    #sideBar .enrollmentPickerForm .enrollmentWrapper li:last-child { border-bottom: none; }
    #sideBar .enrollmentPickerForm .enrollmentWrapper li.processed { }
    #sideBar .enrollmentPickerForm .enrollmentWrapper li.processed.success { color: #53a93f; }
    #sideBar .enrollmentPickerForm .enrollmentWrapper li.processed.error { color: #BF4949; }
    #sideBar .enrollmentPickerForm .enrollmentWrapper .status { font-size: 1.1em; display: inline-block; width: 20%; text-align: center; }
    #sideBar .enrollmentPickerForm .enrollmentWrapper label { width: 70%; display: inline-block; }
    #sideBar .enrollmentPickerForm .enrollmentWrapper a.toggleLink,
    #sideBar .enrollmentPickerForm a.toggleLink { margin-top: 1em; display: inline-block; text-decoration: none; color: #222; }

    #sideBar #certificationForm .enrollmentWrapper { width: 30em; margin-top: .65em; }
    #sideBar #certificationForm .enrollmentWrapper li { clear: both; width: calc(100% - 2em); border-bottom: solid 1px #e1e1e1; padding: 1em 0 1em 2em; position: relative; }
    #sideBar #certificationForm .enrollmentWrapper li input { position: absolute; left: 0; top: .85em; }
    #sideBar #certificationForm a.toggleLink { display: inline-block; text-decoration: none; color: #222; }

    #sideBar #userSearchResultList { margin: 2em 0; }

    #sideBar .userSearchResultList a { display: block; padding: 1em 1.5em; margin: 0; border: none; border-top: solid 1px #ddd; }
    #sideBar .userSearchResultList a + a,
    #sideBar .userSearchResultList > li:first-child a:first-child { border: none; }

    #sideBar .userSearchResultList a:hover { cursor: pointer; background: #f5f5f5; }

    .userSearchResultList a span,
    #studentData span,
    #userData span { display: block; }
    .userSearchResultList a span.name,
    .userSearchResultList a span.address,
    #studentData span.name,
    #studentData span.address,
    #userData span.name,
    #userData span.address { margin-bottom: .25rem; }
    #studentData { margin-bottom: .5rem; }

    #studentSearchBox .userSearchResultList a { display: block; padding: 1em; border: solid 1px #ccc; background: #fff; box-sizing: border-box; height: 100%; }
    #studentSearchBox .userSearchResultList li { flex: 25%; padding: 0 .5em 1em; box-sizing: border-box; max-width: 25%; }
    #studentSearchBox .userSearchResultList { display: flex; margin: 0 -.5em; flex-direction: row; flex-wrap: wrap; font-size: .95em; width: 100%; }
    #studentSearchBox .userSearchResultList a:hover { cursor: pointer; background: #f5f5f5; color: #222; }

    #studentSearchResults { margin-top: 2rem; }

    #studentDataWrapper { display: inline-block; padding-top: .6em; }


    #dashboardSearchBox { float: right; }
    #dashboardSearchBox ul.formList { margin: 2.25em 0 0; }
    #dashboardSearchBox ul.formList li { display: inline-block; margin-left: 1em; }
    #dashboardSearchBox .busyMessage { display: none; }
    #dashboardSearchBox.busy .busyMessage { display: block; padding: .57em; }
    #dashboardSearchBox.busy input { display: none; }

    .courseInstanceSearchList li { padding: 1em 1.5em; border-bottom: solid 1px #ddd; }
    .courseInstanceSearchList li a { text-decoration: none; color: #212121; }
    .courseInstanceSearchList li p { margin: 0 0 .25em; }

    ul.dashboardLinkList { margin-left: 20px; }
    ul.dashboardLinkList li { padding: 1.2em 0; border-bottom: solid 1px #f1f1f1; max-width: 100%; display: block; white-space: nowrap; overflow: hidden; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }
    ul.dashboardLinkList li small { padding: .25em .7em; background: #1989d4; color: #fff; margin-right: 1em; position: relative; top: -.4em; }
    ul.dashboardLinkList li p { margin: 0 0 .25em; }
    ul.dashboardLinkList li .listSubject { display: inline-block; position: relative; top: -4px; }
    ul.dashboardLinkList li a { text-decoration: none; color: #212121; }
    ul.dashboardLinkList li a.listName { max-width: calc(100% - 200px); overflow: hidden; display: inline-block; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }
    ul.dashboardLinkList li .listDesc { display: block; padding-top: .5em; overflow: hidden; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }
    ul.dashboardLinkList li span.enrollmentCount { float: right; font-size: 1.25em; color: #111; }
    ul.dashboardLinkList li span.enrollmentCount span.approved { font-weight: 700; cursor: help; }
    ul.dashboardLinkList li span.enrollmentCount span.tempApproved { font-weight: 700; cursor: help; opacity: .5; }
    ul.dashboardLinkList li span.enrollmentCount span.tempApproved::before { content: '/'; display: inline-block; color: black; font-weight: normal; padding: 0 .25rem; }
    ul.dashboardLinkList button.listBtn { padding: .2em 1em; float: right; position: relative; top: -.2em; margin: 0 0 0 1em; }
    a.dashboardListAction { font-size: .9em; margin-top: 1.5em; margin-left: 20px; display: inline-block; }
    ul.dashboardLinkList.enrollmentList li .courseName { font-size: .9em; display: none; }

    .coursesComingUpBox ul.dashboardLinkList li.noEnrollments { display: none; }
    body.withAllCourses .coursesComingUpBox ul.dashboardLinkList li.noEnrollments { display: block; }
    .coursesComingUpBox a.toggleLink span.hideEmpty { display: none; }
    body.withAllCourses .coursesComingUpBox a.toggleLink span.hideEmpty { display: inline; }
    body.withAllCourses .coursesComingUpBox a.toggleLink span.showAll { display: none; }
    #sideBar ul.dashboardLinkList { margin-right: 20px; }

    /* mails/sms */
    ul.messageList { margin: 0 2em 2em; }
    ul.messageList > li { padding: 2em; margin-top: 2em; border: solid 1px #ddd; position: relative; }
    ul.messageList > li span.entityId { font-size: .7em; position: absolute; top: -2em; right: -1px; padding: .25em 1em; background: #fff; border: solid 1px #ddd; border-bottom: none; border-radius: 3px; }
    ul.messageList > li p.address { font-size: .9em; margin: 0 0 .25em; }
    ul.messageList > li p.subject { font-size: 1.1em; margin: 0 0 .5em; font-weight: 700; }
    ul.messageList > li div.body { margin-top: 1.5em; padding-top: 1.5em; border-top: dashed 1px #ddd; }

    .generateMessageButtons { margin-left: 2em; }
    #sideBar .messageStatus { margin: 2em; padding: .5em 1em; background: #444; color: #fff; border-radius: 3px; float: left; }
    #sideBar .messageStatus.success { background: #53a93f; }
    #sideBar .messageStatus.error { background: #BF4949; }

    .textMessageWarning { background-color: #BF4949; color: white; display: inline-block; padding: .25em; margin-top: 1em; }

    .dashboard .dateList .past { text-decoration: line-through; }

    .sentMailTable tr td:first-child { border-left: solid 2px #E1E6E8 }

    .sentMailTable tr.statusSent td:first-child { border-left: solid 2px #FFE256; }
    .sentMailTable tr.statusDelivered td:first-child, .sentMailTable tr.statusOpened td:first-child { border-left: solid 2px #53a93f; }
    .sentMailTable tr.statusNotDelivered td:first-child { border-left: solid 2px #DA5E5E; }
    .sentMailTable tbody tr.statusNotDelivered .colStatus { color: #BF4949; }

    #mailForm li.copy { height: 0; max-height: 0; overflow: hidden; transition: max-height .25s ease-in-out; }
    #mailForm:not(.withCopy) li.copy { padding: 0; }
    #mailForm.withCopy li.copy { height: auto; max-height: 20em; }
    #mailForm.withCopy #copyButton { background: #53a93f; color: #fff; border-color: #499437; outline: none; }
    #mailForm #mailTo { vertical-align: middle; }

    /* certifications */
    .certificationTable tbody tr td:first-child,
    .userCertificationTable tbody tr td:first-child { border-left: solid 2px #C2CAD2; }
    .certificationTable tbody tr.hasExpirationFlags td:first-child,
    .userCertificationTable tbody tr.hasExpirationFlag td:first-child { border-left-color: #DA5E5E; }

    .certificationTable .note .tooltip,
    .userCertificationTable .note .tooltip { max-width: 19em; }

    .certificationTable tbody tr.deactivated { opacity: .6; }

    .userCertificationTable tbody tr.hasNewerVersion .col { color: #999; }
    .userCertificationTable tbody tr.hasNewerVersion .col .note { color: black; }

    .tabContent[data-tab="certifications"] .toolList .custom form { border-left: solid 1px #ddd; border-right: none; margin: 0 0 0 1.5rem; padding: 0 0 0 1.5rem; }

    #userCertificationExpirationFlagForm a.toggleLink { font-size: .8em; }

    #userCertificationExpirationFlagForm .formList { margin-top: .25rem; }
    #userCertificationExpirationFlagForm .formList strong { }
    #userCertificationExpirationFlagForm .formList > li:not(.navigation) { clear: both; border-bottom: solid 1px #e1e1e1; padding: 1em 0; }
    #userCertificationExpirationFlagForm .formList ul { margin-left: 1rem; }
    #userCertificationExpirationFlagForm .formList ul li:not(.navigation) { clear: both; width: calc(100% - 2em); padding: .1em 0 .1em 2em; position: relative; }
    #userCertificationExpirationFlagForm .formList ul li input { position: absolute; left: 0; top: .55em; }
    #userCertificationExpirationFlagForm .formList ul li label span { display: block; font-size: .8em; margin-top: .25rem; }
    #userCertificationExpirationFlagForm .formList a.toggleLink { margin-left: .5rem; }

    /* LOADER */
    .loader { display: none; }
    body.loading .loader { display: block; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background-color: rgba(255,255,255,.9); padding: 5em 0 0 5em; }
    body.loading .circular { -moz-animation: rotate 2s linear infinite; -o-animation: rotate 2s linear infinite; -webkit-animation: rotate 2s linear infinite; animation: rotate 2s linear infinite; height: 40px; position: relative; width: 40px; vertical-align: middle; margin-right: .5em; }
    body.loading .path { stroke-dasharray: 1,200; stroke-dashoffset: 0; animation: dash 1.5s ease-in-out infinite; stroke-linecap: round; stroke: #5A6169; }
    /*body.loading .path { stroke-dasharray: 1,200; stroke-dashoffset: 0; -moz-animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite; -o-animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite; -webkit-animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite; animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite; stroke-linecap: round; }*/

    .studentFileTable .colIcon { width: 4%; text-align: center; }
    .noTouch .studentFileTable .colIcon { cursor: move !important; }
    .studentFileTable .colName { width: 66%; }
    .studentFileTable .colSize { width: 15%; }
    .studentFileTable .colCreateDate { width: 15%; }
    main .fileUploadForm { display: none; }
    .fileUploadForm { padding: 0 1em 1em 1em; }
    .fileUploadForm input[type='file'] { position: absolute; left: -5000px; }
    .fileUploadForm .uploadingList { margin-top: 1em; }
    .fileUploadForm .uploadingList li { padding: .5em 0; }
    .fileUploadForm .uploadingList li.error { color: #BF4949; }
    .fileUploadForm .uploadingList li.error span.progress span { background-color: #BF4949; }
    .fileUploadForm .uploadingList li span { display: block; }
    .fileUploadForm .uploadingList li span.progress { display: none; background-color: #FBFBFB; margin-top: .2em; }
    .fileUploadForm .uploadingList li span.progress span { height: 3px; background-color: #53a93f; width: 0; }
    .fileUploadForm .totalProgress { display: block; margin-bottom: 2em; background-color: #FBFBFB; }
    .fileUploadForm .totalProgress div { height: 10px; background-color: #53a93f; width: 0; }
    .fileUploadForm button { padding: 0; }
    .fileUploadForm button label { padding: .5em 1em; display: block; cursor: pointer; }

    #filterForm { margin-bottom: 2em; }
    #filterForm li { display: inline-block; }

    .diplomaMasterTemplateBlockTable .colValue, .templateBlockValueTable .colValue { white-space: normal; width: 70%; }

    .diplomaMasterTemplateBlockTable .colIcon { width: 4%; text-align: center; color: #999; }
    .diplomaMasterTemplateBlockTable .colIcon:hover { color: #666; }
    .diplomaMasterTemplateBlockTable .colIcon i { cursor: move; font-size: 14px; }
    .diplomaMasterTemplateBlockTable .colIsEditable { width: 4%; text-align: center; }

    .diplomaMasterTemplateBlockTable .imageWrapper img,
    .templateBlockValueTable .imageWrapper img { max-width: 450px; max-height: 150px; width: 100%; }

    .templateBlockValueTable .colIsEditable { width: 4%; text-align: center; }
    .templateBlockValueTable .col p, .diplomaMasterTemplateBlockTable .col p { margin: 0; }
    .templateBlockValueTable tbody tr { opacity: .6; }
    .templateBlockValueTable tbody tr.editable { opacity: 1; }
    main .templatePreview { display: none; }
    main .diplomaTemplatePicker { display: none; }

    .diplomaTemplatePicker .enrollmentWrapper a.toggleLink,
    #enrollmentAssessmentForm a.toggleLink,
    #courseInstanceDateAttendanceForm a.toggleLink { margin-top: 1em; display: inline-block; text-decoration: none; color: #222; }

    .studentDiplomaTable td.col.colName { max-width: 400px; overflow: hidden; text-overflow: ellipsis; }

    .evaluationQuestionOptions { position: relative; min-height: 150px; }
    .evaluationQuestionOptions .amount { margin-bottom: 1em; }
    .evaluationQuestionOptions .amount input { width: 5em; }
    .evaluationQuestionOptions .amount label.error { display: none !important; }
    .evaluationQuestionOptions .options ol { counter-reset: my-counter; }
    .evaluationQuestionOptions .options ol li.option:before { display: inline-block; content: counter(my-counter); counter-increment: my-counter; background-color: #98c47e; color: white; padding: .45em .65em; vertical-align: middle; margin-right: .4em; }
    .evaluationQuestionOptions .options ol li.empty { color: #999; font-style: italic; }
    .evaluationQuestionOptions .options input { font-size: .9em; }
    .evaluationQuestionOptions .helpers, #evaluationQuestionTranslationForm .helpers { font-size: .8em; }
    .evaluationQuestionOptions .helpers button, #evaluationQuestionTranslationForm .helpers button { margin: 0 .2em 1em 0; }
    .evaluationQuestionOptions .helpers button[disabled] { display: none; }
    .evaluationQuestionTable .colIcon { width: 3%; }
    .evaluationQuestionTable .colIcon i { vertical-align: middle; cursor: move; color: #666; }
    .evaluationQuestionTable .colAllowElaboration { width: 5%; }
    .evaluationQuestionTable .colTranslations { width: 15%; }
    .evaluationQuestionTable .col { vertical-align: middle; }

    .agendaTable .colIcon { width: 3%; }
    .agendaTable .colStart, .agendaTable .colEnd { width: 6%; }
    .agendaTable .colIcon i { vertical-align: middle; cursor: move; color: #666; }
    .agendaTable .col { vertical-align: middle; }

    .courseTable .colPrimaryAdministrators { max-width: 25em; }
    .courseTable .colPrimaryAdministrators span { }

    .studentEvaluationTable .colCreateDate { width: 15%; }
    .studentEvaluationTable .colAllowContact { width: 15%; }
    .studentEvaluationTable .colAverage { width: 15%; }

    .studentEvaluationTable .colAnswers { width: 15%; padding-bottom: .3em; }
    .studentEvaluationTable .colAnswers.many { width: 25%; }
    .studentEvaluationTable .colAnswers .answer { height: 1.3em; box-sizing: border-box; display: inline-block; border-radius: 1px; margin: 1px; cursor: help; float: left; }
    .studentEvaluationTable .colAnswers .answer:hover { opacity: .8; }
    .studentEvaluationTable .colAnswers .answer:last-child { border-right: none; }
    .answer.value--1-of-2, .answer.value--1-of-3, .answer.value--1-of-4, .answer.value--1-of-5,
    .answer.value--1-of-6,.answer.value--1-of-7, .answer.value--1-of-8, .answer.value--1-of-9, .answer.value--1-of-10 { background: #f5f5f5; }
    .answer.value-0-of-2, .answer.value-0-of-3, .answer.value-0-of-4, .answer.value-0-of-5 { background: #a9290b; }
    .answer.value-1-of-2, .answer.value-1-of-3, .answer.value-1-of-4, .answer.value-1-of-5 { background: #ce5336; }
    .answer.value-2-of-3, .answer.value-3-of-5 { background: #d8dc32; }
    .answer.value-2-of-5 { background: #dcab45; }
    .answer.value-4-of-5 { background: #9bbd6f; }
    .answer.value-2-of-2, .answer.value-3-of-3, .answer.value-4-of-4, .answer.value-5-of-5 { background: #41982d; }

    .answers .answer.value-1-of-10,
    .answers .answer.value-2-of-10,
    .answers .answer.value-3-of-10,
    .answers .answer.value-4-of-10,
    .answers .answer.value-5-of-10,
    .answers .answer.value-6-of-10 { background-color: #a9290b; }
    .answers .answer.value-7-of-10,
    .answers .answer.value-8-of-10 { background-color: #dcab45; }
    .answers .answer.value-9-of-10,
    .answers .answer.value-10-of-10 { background-color: #41982d; }

    .studentEvaluationGroupList h2 { font-weight: 400; font-size: 1.65em; }
    .studentEvaluationGroupList h3 { font-weight: 400; font-size: 1.5em; }
    .studentEvaluationGroupList > li { margin-bottom: 3em; }
    .studentEvaluationGroupList .studentEvaluationQuestionList { border-top: solid 1px #e1e1e1; }
    .studentEvaluationGroupList .studentEvaluationQuestionList li { padding: 1em 0; border-bottom: solid 1px #e1e1e1; }
    .studentEvaluationGroupList .studentEvaluationQuestionList li label { padding: 0; width: 25em; font-weight: 600; }
    .studentEvaluationGroupList .studentEvaluationQuestionList li span { display: inline-block; }
    .studentEvaluationGroupList .studentEvaluationQuestionList li .answer { max-width: 60%; }
    .studentEvaluationGroupList .studentEvaluationQuestionList li span.answerElaboration { display: block; font-style: italic; margin-top: .5em; }

    #evaluationQuestionTranslationForm .navigation { margin-top: 2em; }
    #evaluationQuestionTranslationForm, #evaluationCategoryTranslationForm { }


    .translationLanguages { float: right; margin: 2em 2em 0 0; }
    .translationLanguages button { font-size: .8em; }
    .translationLanguages button.active { background: #53a93f; color: #fff; border-color: #4b9639; }

    /* tags */
    span.tag { display: inline-block; background-color: #e27433; padding: 0 .65em; line-height: 2em; font-size: .85em; font-weight: 500; color: white; border-radius: 3px; margin: 0 .25em .25em 0; }
    #tagForm li[title] { opacity: .5; cursor: not-allowed; }
    #tagForm li[title] input,
    #tagForm li[title] label { cursor: not-allowed; }

    /* generic notifications */
    .notifications { position: fixed; right: 2em; top: 7.5em; z-index: 101; transition: top ease-in-out .3s; }
    .notifications .trigger { display: block; text-align: center; margin-bottom: .5em; }
    .notifications .trigger i { color: #c1c1c1; font-size: 2em; width: 1.8em; line-height: 1.8em; background-color: #f6f6f6; border-radius: 9999px; }
    .notifications .trigger:hover { }
    .notifications > .overdue .trigger i { background-color: #c14a4a; color: white; }
    .notifications > .current .trigger i { background-color: #e27433; color: white; }
    .notifications > .allChecked .trigger i { background-color: #53a93f; color: white; }
    body.scrolledToTabContent .notifications { top: 11em; }

    /* checklists */
    .checklistItemForm { font-size: .8em; }
    .checklistItemForm input, .checklistItemForm select, .checklistItemForm button { display: inline-block; }
    .checklistItemForm input[type='number'] { width: 3em; }
    .checklistItemForm select { width: 8em; min-width: unset; }
    .checklistItemForm input[name='text'] { width: 20em; }

    .courseChecklistItemTable .col { vertical-align: middle; }
    .courseChecklistItemTable .colEntity { width: 8%; }
    .courseChecklistItemTable .colDays { width: 10%; text-align: center; }
    .courseChecklistItemTable .colSequence { width: 15%; text-align: center; }
    .courseChecklistItemTable .colDate { width: 15%; text-align: center; }
    .courseChecklistItemTable .colIcon { width: 3%; }
    .courseChecklistItemTable .colIcon i { vertical-align: middle; cursor: move; color: #666; }

    #checklistWrapper { display: block; }
    #checklistWrapper .triggerWrapper { }
    #checklistWrapper .checklist { display: none; }

    #sideBar .checklist { padding: 2em 1.5em; }
    #sideBar .checklist label { width: unset; max-width:25em; font-size: 1rem; padding-top: 0; cursor: pointer; }
    #sideBar .checklist .subChecklistItemList { margin: .75rem 1.5rem; }
    #sideBar .checklist .subChecklistItemList > li + li { margin-top: .5rem; }
    #sideBar .checklist .checklistItemList > li { position: relative; padding-left: 1.75em; }
    #sideBar .checklist .checklistItemList > li + li { margin-top: 1rem; }
    #sideBar .checklist .checklistItemList li > i { font-size: 1.5em; position: absolute; left: 0; top: 0; color: #e1e1e1; }
    #sideBar .checklist .checklistItemList .overdue > i { color: #c14a4a; }
    #sideBar .checklist .checklistItemList .current > i { color: #e27433; }
    #sideBar .checklist .checklistItemList .checked > i { color: #53a93f; }
    #sideBar .checklist .checklistItemList form { display: inline-block; vertical-align: middle; }

    #sideBar .checklistItemForm { padding-left: 2rem; position: relative; }
    #sideBar .checklistItemForm .checkbox { position: absolute; left: .15rem; }

    #sideBar .checklist small { display: block; color: #888; height: 0; max-height: 0; overflow: hidden; transition: max-height .3s ease-in-out; padding: 0; margin: 0; font-size: .76rem; }

    #sideBar .checklist .checklistItemList .entityChecklistItemNoteForm textarea { height: 1rem; resize: none; overflow: hidden; margin-bottom: .2rem; }
    #sideBar .checklist .checklistItemList .entityChecklistItemNoteForm { padding-left: 2rem; font-size: .9em; width: 100%; display: block; box-sizing: border-box; max-height: 0; height: 0; overflow: hidden; transition: max-height .3s ease-in-out; }
    #sideBar .checklist .checklistItemList .entityChecklistItemNoteForm button { padding: .45rem .75rem; margin-right: .5rem; }
    #sideBar .checklist .item .note { max-height: 50em; height: auto; overflow: hidden; transition: max-height .3s ease-in-out; margin-left: 2rem; margin-top: .25rem; }
    #sideBar .checklist.showLog .item .note { margin-top: .35rem; }
    #sideBar .checklist .item .note p { margin: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .8rem; }

    #sideBar .checklist .editNoteTrigger { display: inline-block; vertical-align: middle; position: absolute; margin-left: .5rem; opacity: .75; }
    #sideBar .checklist .editNoteTrigger i { font-size: 1.6em; }
    #sideBar .checklist .editNoteTrigger:hover { opacity: 1; }


    #sideBar .checklist .editNote { }
    #sideBar .checklist .editNote > .note { max-height: 0; height: 0; margin-top: 0; }
    #sideBar .checklist .editNote > .note small { margin-top: 0; }
    #sideBar .checklist .editNote > .entityChecklistItemNoteForm { max-height: 50em; height: auto; margin-top: .5rem; }

    #sideBar .checklist.editNoteMode { }
    #sideBar .checklist.editNoteMode li:not(.editNote) > .checklistItemForm,
    #sideBar .checklist.editNoteMode li:not(.editNote) > .note { opacity: .5; pointer-events: none; cursor: not-allowed; }
    #sideBar .checklist.editNoteMode a.editNoteTrigger { display: none; }

    .dashboard .checkList small { color: white; top: .1em; max-width: calc(30% - 1.4em - 1em); overflow: hidden; white-space: nowrap; display: inline-block; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }
    .dashboard .checkList .overdue small { background-color: #c14a4a; }
    .dashboard .checkList .current small { background-color: #e27433; }
    .dashboard .checkList p { display: inline-block; width: 70%; overflow: hidden; float: right; padding-top: .4em; }
    ul.dashboardLinkList.checkList li a { max-width: unset; }

    #sideBar .checklist .checklistLogTrigger { display: inline-block; margin-bottom: 2em; font-size: small; opacity: .8; }
    .noTouch #sideBar .checklist .checklistLogTrigger:hover { opacity: 1; }
    #sideBar .checklist.showLog .checklistLogTrigger { opacity: 1; font-weight: 500; }

    #sideBar .checklist.showLog .item small { height: auto; max-height: 10rem; margin-top: .1rem; }

    #sideBar .entityReminderListWrapper .reminderLogTrigger { display: inline-block; margin-bottom: 2em; font-size: small; opacity: .8; }
    .noTouch #sideBar .entityReminderListWrapper .reminderLogTrigger:hover { opacity: 1; }
    #sideBar .entityReminderListWrapper.showLog .reminderLogTrigger { opacity: 1; font-weight: 500; }
    #sideBar .entityReminderListWrapper .log { height: 0; max-height: 0; overflow: hidden; transition: max-height .3s ease-in-out; }
    #sideBar .entityReminderListWrapper.showLog .log { height: auto; max-height: 10em; }

    /* reminders */
    #entityReminderWrapper .trigger i { background: #ddd; color: #666; }
    #entityReminderWrapper .trigger[data-count] { position: relative; }
    #entityReminderWrapper .trigger[data-count]::after { content: attr(data-count); position: absolute; top: 50%; margin-top: -.5rem; left: 0; right: 0; font-size: .9em; display: block; line-height: 1rem; text-align: center; border-radius: 50%; display: block; font-weight: 700; letter-spacing: -2px; margin-left: -2px; color: #ddd; }
    #entityReminderWrapper.allDisabled .trigger[data-count]::after { color: #53a93f; }
    #entityReminderWrapper.overdue .trigger[data-count]::after { color: #c14a4a; }
    #entityReminderWrapper.current .trigger[data-count]::after { color: #e27433; }

    #entityReminderWrapper.allDisabled .trigger i { background: #53a93f; color: white; }
    #entityReminderWrapper.overdue .trigger i { background: #c14a4a; color: white; }
    #entityReminderWrapper.current .trigger i { background: #e27433; color: white; }

    .entityReminderList { }
    .entityReminderList > li { position: relative; padding: .25rem 4rem .25rem 4rem; }
    .entityReminderList > li > i { position: absolute; left: 0; top: .25rem; color: #666; }
    .entityReminderList > li label { width: 100%; padding: 0; }
    .entityReminderList > li label strong { font-weight: 500; display: block; }
    .entityReminderList > li label small { color: #999; }
    .entityReminderList > li form { position: absolute; left: 2rem; }
    .entityReminderList > li .actions { position: absolute; right: 0; top: .5rem; left: calc(100% - 4rem); text-align: right; }
    #sideBar .entityReminderList > li .actions a { display: inline-block; color: #999; transition: color .3s ease-in-out; }
    #sideBar .entityReminderList > li:hover .actions a { color: #333; }

    .entityReminderList .reminder.disabled > i { color: #999; }
    .entityReminderList .reminder.overdue > i { color: #c14a4a; }
    .entityReminderList .reminder.current > i { color: #e27433; }

    #btnCreateEntityReminder { margin-top: 2em; }

    .dashboard .reminderList li { position: relative; }
    .dashboard .reminderList li small { position: relative; color: white; margin-right: 1em; top: .1em; max-width: calc(37% - 1.4em - 1em); overflow: hidden; white-space: nowrap; display: inline-block; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }
    .dashboard .reminderList li p { display: inline-block; width: 70%; float: right; padding-top: .4em; }
    .dashboard .reminderList li a { max-width: 95%; }
    .dashboard .reminderList .overdue small { background-color: #c14a4a; }
    .dashboard .reminderList .current small { background-color: #e27433; }
    .dashboard .reminderList .comment { padding-top: 0; }



    /* leads */
    .leadEnrollmentCheckList li { padding: 1.5em 1.25em; border-bottom: solid 1px #e1e1e1; }
    .leadEnrollmentCheckList li strong { display: block; }
    .leadEnrollmentCheckList li label { width: 25em; padding-top: 0; }
    .leadEnrollmentCheckList li span { display: block; }
    .leadEnrollmentCheckList li i { float: right; font-size: 1.6em; color: #c14a4a; cursor: help; }

    /* login */
    .loginpage .wrapper { width: 680px; margin: 25vh auto 0; }
    .loginpage header { margin-bottom: 0; text-transform: none; display: block; text-align: center; margin: 0 0 0 0; }
    .loginpage header::before { display: inline-block; vertical-align: middle; }
    .loginpage header::after { font-size: 1.85em; font-weight: 400; display: inline-block; vertical-align: middle; }
    .loginpage .formList li label { text-align: right; margin-right: 1em; }
    .loginpage .formList li.navigation { }
    .loginpage .formList li.navigation button { margin-left: 13.25em; margin-right: 1.25em; }
    .loginpage form div.status { margin-left: 13.25em; }
    .loginpage #resetPasswordForm { display: none; }

    /* warnings */
    .warning, .nameTagsInfo { padding: 1em; margin: 1em 0 2em 0; background-color: #fdf7da; border: solid 1px #ead775; color: #170f00; max-width: 50em; }
    .overbookedWarning { display: block; }

    /* move enrollment */
    main .moveEnrollmentWrapper { display: none; }

    /* enrollment form */
    #enrollmentCompanyVatCountryCode { min-width: 4em; padding: .43em .75em; }
    #enrollmentCompanyVatCountryCode + input { width: 10.1em; }

    /* name tags & participant list */
    .nameTags, .participantList { width: 210mm; height: 297mm; margin: 2em auto; border: solid 1px #ddd; }
    .nameTags .margins { margin: 0 15mm; }
    .nameTags .nameTag { float: left; position: relative; width: 90mm; height: 59.4mm; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; border: dashed 1px #ddd; }
    .nameTags .nameArea { position: absolute; left: 10mm; right: 10mm; top: 20mm; max-height: 25mm; overflow: hidden; }
    .nameTags h1 { margin: 0; font-weight: 600; font-size: 15pt; white-space: nowrap; }
    .nameTags h2 { margin: 0; font-weight: 400; font-size: 11pt; padding-top: 2mm; white-space: nowrap; }
    .nameTags .courseArea { position: absolute; right: 10mm; bottom: 7mm; overflow: hidden; text-align: right; }
    .nameTags .courseName { font-size: 9pt; font-weight: 600; margin-bottom: 1mm; }
    .nameTags .courseInstanceName { font-size: 8pt; }

    .nameTags.type1 .margins { margin: 0 15mm; }
    .nameTags.type1 .nameTag { width: 90mm; height: 59.4mm; }
    .nameTags.type1 .nameArea { left: 10mm; top: 20mm; max-height: 25mm; }

    .nameTags.type2 { width: 297mm; height: 210mm; zoom: .7; }
    .nameTags.type2 .margins { margin: 105mm 0 0; }
    .nameTags.type2 .nameTag { width: 297mm; height: 105mm; }
    .nameTags.type2 .nameArea { left: 30mm; right: 30mm; top: 30mm; max-height: 45mm; }
    .nameTags.type2 .courseArea { right: 15mm; bottom: 12mm; }
    .nameTags.type2 h1 { font-size: 50pt; }
    .nameTags.type2 h2 { font-size: 30pt; }
    .nameTags.type2 .courseName { font-size: 18pt; margin-bottom: 2mm; }
    .nameTags.type2 .courseInstanceName { font-size: 12pt; }

    #nameTagsPrintButton, #participantListPrintButton { float: right; margin: 1em; }

    body.ie-edge .nameTagsInfo p.ie-edge, body.ie-edge .participantListInfo p.ie-edge { margin: 0 0 .7em; display: block !important; }
    .nameTagsPage form label { width: auto; }

    .participantList { height: auto; }
    .participantList .margins { margin: 15mm; }
    .participantList h1 { font-size: 1.4em; font-weight: 500; }
    .participantList h2 { font-size: 1.2em; font-weight: 500; margin-top: 1.5em; }
    .participantList .infoList li { margin-bottom: .5em; }
    .participantList .infoList li label { font-weight: 600; display: block; }
    .participantList .infoList .dateList li { margin: 0; }
    .participantList table { width: 100%; }
    .participantList table th { font-weight: 500; text-align: left; }
    .participantList table .col { padding: .1em 0; }
    .participantList table .colCompany { width: 40%; }
    .participantList table tbody .firstInGroup .col { padding-top: .5em; }
    .participantList table tbody .lastInGroup .col { padding-bottom: .5em; }

    /* latest lists */
    ul.dashboardLinkList li small.enrollmentState1, ul.dashboardLinkList li small.leadState1 { background: #1989d4; }
    ul.dashboardLinkList li small.enrollmentState2, ul.dashboardLinkList li small.leadState5 { background: #e6c41c; }
    ul.dashboardLinkList li small.enrollmentState3, ul.dashboardLinkList li small.leadState4 { background: #53a93f; }
    ul.dashboardLinkList li small.enrollmentState4, ul.dashboardLinkList li small.leadState3 { background: #DA5E5E; }
    ul.dashboardLinkList li small.enrollmentState5, ul.dashboardLinkList li small.leadState2 { background: #b3b9bf; }
    ul.dashboardLinkList li small.enrollmentState6 { background: #af7acf; }
    ul.dashboardLinkList li small.enrollmentState7 { background: #88d464; }


    /* auto task */
    .autoTaskJobActionList { }
    .autoTaskJobActionList li { margin: .5em 0; padding: .5em 0; border-bottom: solid 1px #e1e1e1; }
    .autoTaskJobActionList li .date { display: block; font-weight: 600; margin-bottom: .25em; }
    .autoTaskJobActionList li .text { display: block; }
    .autoTaskJobActionList li .error { color: #DA5E5E; font-size: .9em; font-style: italic; }

    /* user access */
    .accessPolicyWrapper { max-width: 600px; margin-top: 5em; }
    .accessPolicyWrapper > .accessPolicyList > li { background: #f5f5f5; margin: .5em 0; padding: .85em .75em .75em; border-top: solid 1px #ddd; border-bottom: solid 1px #ddd; }
    .accessPolicyWrapper > .accessPolicyList > li > label { font-weight: 700; }
    .accessPolicyWrapper .accessPolicyList .accessPolicyList { margin: .25em 0 .25em 2em; }
    .accessPolicyWrapper .accessPolicyList .accessPolicyList li { padding: .1em 0; }
    .accessPolicyWrapper .accessPolicyList ul ul label { font-size: .9em; vertical-align: text-top; }
    .accessPolicyWrapper .navigation { margin-top: 2em; text-align: right; }
    .accessPolicyWrapper label, .accessPolicyWrapper input { cursor: pointer; }

    /* copy enrollments */
    .copyEnrollmentList { margin-top: 2em; border-top: solid 1px #e1e1e1; }
    .copyEnrollmentList li { padding: .5em; border-bottom: solid 1px #e1e1e1; }
    .copyEnrollmentList li .name { display: inline-block; width: 80%; }
    .copyEnrollmentList li .status { display: inline-block; width: 18%; text-align: right; }
    .copyEnrollmentList li .errorMessage { display: block; font-size: .9em; font-style: italic; margin-top: .25em; }
    .copyEnrollmentList li.queued { color: #888; }
    .copyEnrollmentList li.processing { color: #333; }
    .copyEnrollmentList li.processed .name { text-decoration: line-through; }
    .copyEnrollmentList li.processed.success { color: #53a93f; }
    .copyEnrollmentList li.processed.error { color: #c14a4a; }
    .copyEnrollmentList li.processed.error .status { cursor: help; }

    /* calendar */
    .calendar { margin:1em 2em; max-width:1200px; }
    .calendarList { display: flex; flex-direction: row; flex-wrap: wrap; background-color: #F1F2F3; padding: .2em; }
    .calendarList > li { flex: 14.28%; max-width: 14.28%; border: solid .2em #F1F2F3; padding: .25em; box-sizing: border-box; position: relative; }
    .calendarList.noWeekends .weekend { display: none; }
    .calendarList.noWeekends > li { flex: 20%; max-width: 20%; }
    .calendarList .dayHeader { font-weight: 500; text-align: center; }
    .calendarList .date { background-color: white; min-height: 7em; }
    .calendarList .date .day { font-size: 1.6em; display: inline-block; border-radius: 50%; /* color: #fff; */ width: 1.65em; height: 1.65em; text-align: center; line-height: 1.65em; margin-bottom: .25em; }
    .calendarList .date .day:after { content: ''; }
    .calendarList .date .week { position: absolute; font-size: .8em; color: #999; top: .75rem; right: .5rem; text-transform: capitalize; }
    .calendarList .date.today .day { background: #dcdfe2; color: #032435; }
    .calendarList .date.notThisMonth { opacity: .4; }
    .calendarList .eventList { font-size: .75em; }
    .calendarList .eventList li { margin: .1em 0; }
    .calendarList .eventList a, .instructorCalendar .personList span { display: block; padding: .25em .5em; border-radius: 3px; color: white; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

    .calendarList .eventList a:hover { color: white; opacity: .8; }
    #calendarWrapper .calendarHeader { position: relative; text-align: center; background-color: #004467; padding: .75em 0; }
    #calendarWrapper .calendarHeader h2 { margin: 0; font-weight: normal; color: white; }
    #calendarWrapper .calendarHeader a { position: absolute; top: .65em; color: white; }
    #calendarWrapper .calendarHeader a:hover { color: #fff; opacity: .8; }
    #calendarWrapper .calendarHeader a i { font-size: 2.4em; }
    #calendarWrapper .calendarHeader a:nth-of-type(1) { left: 0.5em; }
    #calendarWrapper .calendarHeader a:nth-of-type(2) { right: 0.5em; }

    #calendarForm .formList > li:nth-of-type(1n+2) { display: inline-block; float: none; margin-right: .5em; }
    #calendarForm .formList .select:not([multiple]) { min-width: unset; }
    #calendarForm .formList #instructors { min-width: 50em; }
    #calendarForm .navigation { padding-top: .25em; }

    /* instructor calendar */
    .instructorCalendar .personList { font-size: .85em; margin-bottom: .5em; }
    .instructorCalendar .personList li { display: inline-block; margin-right: .25em; }

    /* location calendar */
    #calendarForm .formList > li { display: inline-block; float: none; margin-right: .5em; }
    .calendarList .eventList a { background-color: #53a93f; }

    /* agenda mapper */
    #courseInstanceDateAgendaMappingForm.processing { color: #999; }
    #courseInstanceDateAgendaMappingForm .courseInstanceDateList > li:not(.navigation) { margin: 0; padding: 1em 0; border-bottom: solid 1px #eee; }
    #courseInstanceDateAgendaMappingForm .courseInstanceDateList label { text-transform: capitalize; padding-top: 0; vertical-align: middle; font-weight: 500; }
    #courseInstanceDateAgendaMappingForm .courseInstanceDateList .existingAgenda { display: inline-block; vertical-align: middle; color: #999; }
    #courseInstanceDateAgendaMappingForm .courseInstanceDateList > li.processed.success label { color: #53a93f; }
    #courseInstanceDateAgendaMappingForm .courseInstanceDateList > li.processed.error label { color: #BF4949; }
    #courseInstanceDateAgendaMappingForm .courseInstanceDateList > li.processed.error:after { content: attr(data-error); color: #BF4949; display: block; font-size: .85em; margin: .5em 0 0 12.5rem; }

    /* classroom profile */
    .classroomUserAvatar { display: inline-block; width: 75px; height: 75px; border-radius: 50%; background-position: center center; background-size: cover; background-repeat: no-repeat; }
    .classroomUserAvatar:not([style]) { background-color: #e1e1e1; }

    #classroomProfileAvatarForm .avatar { text-align: center; max-width: 6em; }

    .classroomFormWrapper h3 { text-transform: uppercase; color: #7e8387; border-bottom: solid 1px #ddd; margin: 1.5em 0 0; }
    .classroomFormWrapper fieldset { padding-top: 0; padding-bottom: 0; }
    .classroomFormWrapper .pad { }

    /* roles */
    #userUserRoleForm .formList { max-width: 50em; }
    #userUserRoleForm .formList > li:not(.navigation) { padding: 1rem 0 1rem 2rem; border-bottom: solid 1px #ddd; position: relative; }
    #userUserRoleForm .formList > li input[type="checkbox"] { position: absolute; top: .85rem; left: 0; cursor: pointer; }
    #userUserRoleForm .formList > li input[type="checkbox"]:disabled { cursor: not-allowed; }
    #userUserRoleForm .formList > li label { padding: 0; cursor: pointer; }
    #userUserRoleForm .formList > li input[type="checkbox"]:disabled + label { cursor: not-allowed; }
    #userUserRoleForm .formList > li p { margin: 0; font-size: .85em; }

    /* personal data */
    div.courseInstancePersonalDataCollectionCard { margin-bottom: 0; }
    div.courseInstancePersonalDataCollectionCard + .pad { padding-top: 0; }
    .personalDataList { display: flex; flex-direction: row; flex-wrap: wrap; margin: -.5em; }
    .personalDataList > li { box-sizing: border-box; border: solid 1px #ddd; border-radius: 4px; margin: .5em; padding: 1em 1em 3em; width: calc(33.33% - 1em); position: relative; }
    
    .personalDataList h4 { margin: 0 0 .5rem; }
    .personalDataList p { margin: 0 0 .5em; }
    .personalDataList .addData { color: #53a93f; }
    .enrollmentDataList { margin: .5em 1em; }
    .enrollmentDataList li { position: relative; padding: .5em 2em .5em 0; border-bottom: solid 1px #f1f1f1; }
    .enrollmentDataList li:last-child { border-bottom: none; }
    .enrollmentDataList li .actions { position: absolute; right: 0; top: .5rem; }
    .enrollmentDataList li .actions .action { opacity: .5; transition: opacity .3s ease-in-out; }
    .enrollmentDataList li:hover .actions .action { opacity: 1; }
    .enrollmentDataList li:hover .actions .action.delete:hover { color: #BF4949; }

    #multiNoteForm { }
    #multiNoteForm textarea { height: 1.25em; resize: none; max-width: none; width: 96%; }
    #multiNoteForm label { width: 20em; padding-top: 0; }
    #multiNoteForm.hasData #excel { display: none; }
    #multiNoteForm #enrollments {  transition: max-height .3s ease-in-out; }
    #multiNoteForm:not(.hasData) #enrollments { padding-top: 0; padding-bottom: 0; height: 0; max-height: 0; overflow: hidden; }
    #multiNoteForm .navigation button { margin-left: 20.25em; }


    /* errors and warnings */
    .formWarning,
    .cardList li[data-warning]:not([data-warning=""])::after { color: #fff; background: #ab2929; padding: .5em 1em; font-size: .9em; margin: .5em; display: inline-block; border-radius: 3px; }
    .cardList li[data-warning]:not([data-warning=""])::after { content: attr(data-warning); margin: 0; max-width: 30em; }

    /* link colors */
    .mainContent a.emph,
    .mainContent a[href]:hover,
    .formList li.navigation a:hover,
    #userInfo a,
    html.noTouch ul.tabList li a:hover,
    .courseInstanceSearchList li a:hover,
    .diplomaTemplatePicker .enrollmentWrapper a.toggleLink:hover,
    ul.dashboardLinkList li a:hover { color: #53a93f; }
    #mainNav ul li a.active, html.noTouch #mainNav ul li a:hover { border-left: solid 5px #53a93f; color: #fff; }

    #courseInstanceDateEditForm label:first-letter { text-transform:uppercase; }

    /* chosen styles */
    .chosen-container { position: relative; display: inline-block; vertical-align: middle; font-size: 13px; user-select: none; width: calc(100% - 2px); max-width: 31.65rem; }
    .chosen-container * { box-sizing: border-box; }
    .chosen-container .chosen-drop { position: absolute; top: 100%; z-index: 1010; width: 100%; border: 1px solid #ccc; border-top: 0; background: #fff; box-shadow: rgba(0, 0, 0, 0.15) 1px 1px 3px 0; clip: rect(0, 0, 0, 0); margin-bottom: 2em; }
    .chosen-container.chosen-with-drop .chosen-drop { clip: auto; }
    .chosen-container a { cursor: pointer; }
    .chosen-container .search-choice .group-name, .chosen-container .chosen-single .group-name { margin-right: 4px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-weight: normal; color: #999999; }
    .chosen-container .search-choice .group-name:after, .chosen-container .chosen-single .group-name:after { content: ":"; padding-left: 2px; vertical-align: top; }
    .chosen-container .chosen-results { color: #444; position: relative; overflow-x: hidden; overflow-y: auto; margin: 0 4px 4px 0; padding: 0 0 0 4px; max-height: 240px; -webkit-overflow-scrolling: touch; }
    .chosen-container .chosen-results li { display: none; margin: 0; padding: 5px 6px; list-style: none; line-height: 15px; word-wrap: break-word; -webkit-touch-callout: none; white-space:nowrap; }
    .chosen-container .chosen-results li.active-result { display: list-item; cursor: pointer; }
    .chosen-container .chosen-results li.disabled-result { display: list-item; color: #ccc; cursor: default; }
    .chosen-container .chosen-results li.highlighted { background-color: #eee; color: #111; }
    .chosen-container .chosen-results li.no-results { color: #777; display: list-item; background: #f4f4f4; }
    .chosen-container .chosen-results li.group-result { display: list-item; font-weight: bold; cursor: default; }
    .chosen-container .chosen-results li.group-option { padding-left: 15px; }
    .chosen-container .chosen-results li em { font-style: normal; text-decoration: underline; }

    .chosen-container-single { font-size: 1em; }
    .chosen-container-single .chosen-single { display: block; padding: .5em .75em; border: solid 1px #ccc; position: relative; }
    .chosen-container-single .chosen-single:hover { color: #212121; }
    .chosen-container-single .chosen-single::after { content: '⯆'; position: absolute; right: .5em; top: .65em; font-size: .75em; }
    .chosen-container-single .chosen-search { margin: .5em .75em; }
    .chosen-container-single .chosen-search input { padding: .25em .5em; width: 100%; }
    .chosen-container-single .chosen-results li.no-results { margin: .5em .75em; white-space: normal; line-height: 1.4em; font-size: .9em; }
    .chosen-container-single .chosen-results li.no-results span { font-weight: 500; }

    .chosen-container-multi .chosen-choices { position: relative; overflow: hidden; margin: 0; padding: 0 5px 5px; width: 100%; height: auto; border: 1px solid #ccc; background-color: #fff; cursor: text; }
    .chosen-container-multi .chosen-choices li { float: left; list-style: none; }
    .chosen-container-multi .chosen-choices li.search-field { margin: 0; padding: 2px 0 0 0; white-space: nowrap; }
    .chosen-container-multi .chosen-choices li.search-field input[type="text"] { margin: 3px 0 0; padding: 0; height: 21px; outline: 0; border: 0 !important; background: transparent !important; box-shadow: none; color: #999; font-size: 100%; line-height: normal; border-radius: 0; width: 25px; }
    .chosen-container-multi .chosen-choices li.search-choice { position: relative; margin: 5px 5px 0 0; padding: 3px 20px 3px 5px; border: 1px solid #e8e8e8; max-width: 100%; border-radius: 2px; background-color: #eee; color: #333; line-height: 13px; cursor: default; }
    .chosen-container-multi .chosen-choices li.search-choice span { word-wrap: break-word; }
    .chosen-container-multi .chosen-choices li.search-choice .search-choice-close { position: absolute; top: 4px; right: 3px; display: block; width: 12px; height: 12px; font-size: 1.4em; }
    .chosen-container-multi .chosen-choices li.search-choice .search-choice-close:hover { color: #BF4949; }
    .chosen-container-multi .chosen-choices li.search-choice .search-choice-close:after { content: "×"; }
    .chosen-container-multi .chosen-choices li.search-choice-disabled { padding-right: 5px; border: 1px solid #ccc; background-color: #e4e4e4; color: #666; }
    .chosen-container-multi .chosen-choices li.search-choice-focus { background: #d4d4d4; }
    .chosen-container-multi .chosen-choices li.search-choice-focus .search-choice-close { background-position: -42px -10px; }
    .chosen-container-multi .chosen-results { margin: 0; padding: 0; }
    .chosen-container-multi .chosen-drop .result-selected { display: list-item; color: #ccc; cursor: default; }
    .chosen-container-active .chosen-single { border: 1px solid #adc2d8; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15); box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); }
    .chosen-container-active.chosen-with-drop .chosen-single { border: 1px solid #aaa; border-bottom-right-radius: 0; border-bottom-left-radius: 0; box-shadow: 0 1px 0 #fff inset; }
    .chosen-container-active.chosen-with-drop .chosen-single div { border-left: none; background: transparent; }
    .chosen-container-active.chosen-with-drop .chosen-single div b { background-position: -18px 2px; }
    .chosen-container-active .chosen-choices { border: 1px solid #adc2d8; box-shadow: 0 0 4px rgba(0, 0, 0, 0.15); }
    .chosen-container-active .chosen-choices li.search-field input[type="text"] { color: #222 !important; }
    .chosen-disabled { opacity: 0.5 !important; cursor: default; }
    .chosen-disabled .chosen-single { cursor: default; }
    .chosen-disabled .chosen-choices .search-choice .search-choice-close { cursor: default; }
    /* chosen styles end */

    /* custom sortable styles */
    .chosen-results .hidden { display: none !important; }
    .item-chosen-container { width: calc(100% - 2px); max-width: 31.65rem; }

    /* timepicker styles */
    .ui-timepicker-container { position: absolute; overflow: hidden; box-sizing: border-box; z-index: 10 !important; }
    .ui-timepicker-viewport { max-height: 10em; overflow-y: auto; overflow-x: hidden; }
    ul.ui-timepicker-viewport, ul.ui-timepicker-viewport li { padding: 0; margin: 0; list-style-type: none; }
    ul.ui-timepicker-viewport li:first-child { margin-top: .25em; }
    ul.ui-timepicker-viewport li a { padding: .25em .5em; display: block; cursor: pointer; color: #111; }
    ul.ui-timepicker-viewport li a:hover { background-color: #eee; }
    .ui-timepicker-standard { background-color: white; border: solid 1px #ccc; box-shadow: rgba(0, 0, 0, 0.15) 1px 1px 3px 0; }

    

    /* pickmeup styles*/
    .pickmeup { background: #fff; border: solid 1px #ccc; font-size: .9em; border-radius: 3px; display: inline-block; position: absolute; z-index: 20; box-shadow: rgba(0,0,0,.15) 1px 1px 10px 0; }
    .pickmeup * { -moz-box-sizing: border-box; box-sizing: border-box; }
    .pickmeup .pmu-instance { display: inline-block; height: 18.5em; padding: 1em; text-align: center; width: 23.25em; border-right: solid 1px #ddd; margin-left: .5em;}
    .pickmeup.pmu-hidden { display: none }
    .pickmeup.pmu-flat { position: relative }
    .pickmeup .pmu-instance .pmu-button { color: #464646; cursor: pointer; outline: 0; text-decoration: none; }
    .pickmeup .pmu-instance .pmu-today { color: #53a93f; font-weight: 800; }
    .pickmeup .pmu-instance .pmu-button:hover { background: #C8DEB2; }
    .pickmeup .pmu-instance nav .pmu-button:hover { background: #fff; color: #53a93f; }
    .pickmeup .pmu-instance .pmu-not-in-month { color: #c5c5c5; }
    .pickmeup .pmu-instance .pmu-disabled, .pickmeup .pmu-instance .pmu-disabled:hover { background:transparent; color: #e0e0e0; cursor: default; }
    .pickmeup .pmu-instance .pmu-selected { background: #53a93f; color: #fff !important; }
    .pickmeup .pmu-instance .pmu-not-in-month.pmu-selected { background: transparent; color: #665F54; }
    .pickmeup .pmu-instance nav { display: -ms-flexbox; display: -webkit-flex; display: flex; color: #565656; line-height: 2em; font-weight:600; }
    .pickmeup .pmu-instance nav *:first-child :hover { background: #C8DEB2; }
    .pickmeup .pmu-instance nav .pmu-prev, .pickmeup .pmu-instance nav .pmu-next { display: none; height: 2em; width: 1em; }
    .pickmeup .pmu-instance nav .pmu-month { width: 19em; font-size:1.1em; font-weight: 800; padding-bottom: .3em; }
    .pickmeup .pmu-instance .pmu-years *, .pickmeup .pmu-instance .pmu-months * { display: inline-block; line-height: 3.6em; width: 3.5em; }
    .pickmeup .pmu-instance .pmu-day-of-week { color: #999; cursor: default; }
    .pickmeup .pmu-instance .pmu-day-of-week *, .pickmeup .pmu-instance .pmu-days * { display: inline-block; line-height: 1.85em; width: 2.85em; margin:.075em; }
    .pickmeup .pmu-instance .pmu-day-of-week * { line-height: 1.8em; }
    .pickmeup .pmu-instance:first-child .pmu-prev, .pickmeup .pmu-instance:last-child .pmu-next { display: block; }
    .pickmeup .pmu-instance:first-child .pmu-month, .pickmeup .pmu-instance:last-child .pmu-month { width: 18em; }
    .pickmeup .pmu-instance:first-child:last-child .pmu-month { width: 17em; }
    .pickmeup:not(.pmu-view-days) .pmu-days, .pickmeup:not(.pmu-view-days) .pmu-day-of-week, .pickmeup:not(.pmu-view-months) .pmu-months, .pickmeup:not(.pmu-view-years) .pmu-years { display: none; }
    .pickmeup .pmu-instance .selected_but_disabled { background:#ccc; }
    .pickmeup .pmu-instance:last-child { border-right: none; }
    #datePickerWrapper .pickmeup { font-size:.95em; box-shadow:none; }
    .pickmeup .pmu-instance nav .pmu-prev, .pickmeup .pmu-instance nav .pmu-next { width: 3em; }

    /* CARD TOOLS */
    #cardTools { float: left; margin: .1em 0 .2em .5em; }

    #cardTools .trigger {  display: inline-block; margin-left: .5em; }
    #cardTools .trigger i { background-color: #53a93f; color: white; border-radius: 50%; display: inline-block; font-size: 1.2em; vertical-align: middle; line-height: 2rem; width: 2rem; text-align: center; }
    #cardTools .trigger span { display: inline-block; font-size: 1.2em; width: 2rem; line-height: 2rem; text-align: center; vertical-align: middle; color: black; margin-left: .25em; border-radius: 50%; }
    #cardTools .trigger span::after { content: '…'; font-weight: 700; transform: rotate(90deg); display: block; margin-left: .5em; }
    #cardTools .trigger:hover i {  }
    #cardTools .trigger i:hover { }
    #cardTools .trigger span:hover,
    #cardTools.active .trigger span { background-color: #f1f1f1; }

    #cardTools .cardToolList,
    #cardTools .cardToolList .groupButtons { display: none; position: absolute; background-color: white; box-shadow: 1px 2px 5px rgba(0,0,0,.25); margin: .5em 0; z-index: 10001; }
    #cardTools .cardToolList { margin-left:2.5em; }
    #cardTools .cardToolList button { margin: 0; width: 100%; min-width: 15em; position: relative; background-color: white; border: none; text-align: left; padding: 1em; outline: none; font-size: .95em; }
    #cardTools .cardToolList button:hover { color: black; background-color: #f1f1f1; }
    #cardTools .cardToolList > li { position: relative; }

    #cardTools .cardToolList .group > button::after { content: '…'; font-weight: 700; position: absolute; right: 1em; top: .75em; color: black; }
    #cardTools .cardToolList .groupButtons { z-index: 100; left: 100%; top: -.5em; }
    #cardTools.active .cardToolList,
    #cardTools .group.active .groupButtons { display: block; }
    #cardTools li.group.active > button { background-color: #f1f1f1; color: black; }
    #cardTools li.group.active > button::after { transform: rotate(90deg); top: 1em; right: .75em; }

    /* USER DELETE SIDEBAR */
    #sideBar .userRoleList > li { padding: 1rem 0; border-bottom: solid 1px #e1e1e1; }
    #sideBar .userRoleList strong { font-size: 1.1em; font-weight: 500; margin-bottom: .25rem; display: block; }
    #sideBar .userRoleList p { margin: 0; }
    #sideBar .userRoleList p + p { margin-top: 1rem; background-color: #fdf7da; border: solid 1px #ead775; color: #170f00; padding: .5rem; }

    /* USER AVATAR */
    #userAvatar { height: 88px; width: 100%; text-align: center; }
    #userAvatar a { border-bottom: none; font-size: .95em; height: 42px; background-color: #53a93f; width: 42px; display: inline-block; line-height: 42px; border-radius: 50%; margin: 21px auto; color: #ffffff; }
    #userNav { position: fixed; top: 0; bottom: 0; background: white; width: 0; z-index: 9; overflow: hidden; transition: left .3s ease-in-out; border-right: solid 1px #ddd; box-shadow: rgba(0,0,0,.1) 4px 0 8px 0; }
    #userNav a { display: block; padding: .45rem 1.2rem; color: #012538; text-decoration: none; }
    #userNav a span { display: inline-block; vertical-align: middle; }
    #userNav a i { display: inline-block; vertical-align: middle; }
    #userNav a:hover { background-color: #f8f8f8; }
    #userNav a.language.active span { font-weight: 600; }
    #userNav ul { padding: 1rem 0; }
    #userNav ul li { margin: 0; }
    #userNav p { padding: 0 1.5rem; }
    #sectionTree:not(.narrow) + #userNav,
    #mainNav + #userNav { width: 370px; left: -470px; }
    #sectionTree.narrow + #userNav { width: 280px; left: -380px; }
    body.withUserNav nav#userNav { left: 100px !important; }
    body.withUserNav main::before { content: ''; display: block; position: fixed; left: 0; right: 0; top: 0; bottom: 0; background-color: rgba(0,0,0,.5); z-index: 8; }
    #userNav form { padding: .25rem; }
    #userNav form select { width: 100%; min-width: unset; max-width: none; }
    
    #mainNav ul li a { padding: 1.1em 15px; }
    #sectionTree { position: absolute; top: 0; left: 100px; bottom: 0; z-index: 5; width: 370px; background: #fff; border-right: solid 1px #ddd; }
    main { position: absolute; top: 0; bottom: 0; left: 471px; right: 0; }

    /* MARKUP TOOLBAR */
    .markupToolbar { margin: 1em 0; }
    .markupToolbar select { margin-right: 1rem; min-width: unset; max-width: 20rem; }
    .markupToolbar .markupTool { font-weight: 700; padding: .4em .8em; margin: 0; }
    .markupToolbar .markupTool + .markupTool { margin-left: .25rem; }
    .markupToolbar .markupTool:disabled { pointer-events: none; }
    
    /* FINANCE */
    .finance .toolList #filterForm { margin-bottom: 0; }

    /* NOT CONFIGURED */
    #not-configured { text-align: center; margin-top: 2rem; }

    @keyframes rotate { 100% { -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg); } }

    @keyframes dash {
        0% { stroke-dasharray: 1,200; stroke-dashoffset: 0; }
        50% { stroke-dasharray: 89,200; stroke-dashoffset: -35; }
        100% { stroke-dasharray: 89,200; stroke-dashoffset: -124; }
    }

    @keyframes color {
        100%, 0% { stroke: #6AB147; }
        40% { stroke: #6AB147; }
        66% { stroke: #6AB147; }
        80%, 90% { stroke: #6AB147; }
    }
}

@media screen and (max-width:1750px) {
    ul.tabList li a { font-size: 1em; max-width: 10em; margin-right: .2em; }
    ul.dashboardLinkList.coursesComingUpList li a.listName { max-width: 50%; }
}


@media screen and (max-width:1600px) {
    html { font-size: 84%; }
    #mainNav ul li a { padding: 1.475em 15px; }
    ul.tabList li a { max-width: 7em; }
    ul.tabList li a:first-child { max-width: 10em; }
    ul.dashboardLinkList li .listSubject { top: -3px; }
    .mainContent.scrollContent.hasToolbar { top: 142px; }
}

@media screen and (max-width:1500px) {
    .header h1 { max-width: 75%; }
}

@media screen and (max-width:1400px) {
    html { font-size: 80%; }
    #mainNav { width: 90px; }
    #userInfo { left: 90px; }
    #sectionTree { width: 300px; left: 90px; }
    #sectionTree.narrow { width: 260px; }
    #sectionTree > ul { top: 68px; }
    #sectionTree > ul li a.item { min-width: 160px; }
    #sectionTree > ul li ul li a.item { max-width: 160px; }
    #sectionTree > ul li a.item i { vertical-align: text-bottom; position: relative; top: 2px; }
    #sectionTree > ul li a.more i { vertical-align: text-bottom; }

    .singleSectionMode main { left: 301px; }

    #categoryMenu, #rootMenu { left: 301px; }
    .narrow #categoryMenu { left: 261px; }

    main, .treeMenu { left: 391px; }
    main.narrowTree, .treeMenus.narrow .treeMenu { left: 351px; }
    main.noTree { left: 90px; }
    #logoLink { height: 70px; }
    #logoLink img { max-height: 100%; width: auto; }
    #mainNav ul li a { padding: .95em 15px; }
    .header { height: 67px; }
    .header.subHeader { height: 40px; padding: 0; }
    .header h1, ul.breadcrumbList { font-size: 1.1em; }
    .header h1 { top: 2.5em; }
    #dashboardSearchBox ul.formList { margin-top: 1.2em; }
    .scrollContent { top: 67px; }
    body.scrolledToTabContent ul.toolList { top: 67px; }
    .mainContent.scrollContent.hasToolbar { top: 118px; }
    #sideBar .sideBarContent { top: 67px; }
    ul.breadcrumbList { top: 2em; }
    div.card ul.cardList { width: 47%; }
    ul.tabList li a { max-width: 6em; padding: .5em .7em; }
    ul.dashboardLinkList { margin-left: 6px; }
    a.dashboardListAction { margin-left: 6px; }
    .header h1 i { font-size: 20px; }

    .item-chosen-container {  }

    #sectionTree:not(.narrow) + #userNav,
    #mainNav + #userNav { width: 300px; left: -390px; }
    #sectionTree.narrow + #userNav { width: 260px; left: -350px; }
    body.withUserNav nav#userNav { left: 90px !important; }
}

@media screen and (max-width:1280px) {
    .dashboard .mainColumn { width: 67%; }
    .dashboard .asideColumn { width: 33%; }
}

@media screen and (max-width:1260px) {
    .dashboard .mainColumn { width: 55%; }
    .dashboard .asideColumn { width: 33%; }
    .dashboard .mainColumn .column { width: 100%; }
    .studentDiplomaTable td.col.colName { max-width: 300px; }
}

@media screen and (max-width:1110px) {
    #sectionTree { display: none; }
    .singleSectionMode main { left: 0; }

    html.withMenu #sectionTree { display: block; }
    main, main.noTree, main.narrowTree { left: 91px; }
    main.dashboard { min-width: unset; overflow:auto; }
    .dataTable { font-size: .9em; }
    div.card .cardHeader h2 { font-size: 1.4em; margin-bottom: .5em; }
    ul.tabList li a { font-size: 1em; }
    .header.subHeader h1 { white-space: nowrap; max-width: 65%; overflow: hidden; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }
    ul.dashboardLinkList li span.enrollmentCount { font-size: 1.5em; }
    .dashboard .mainColumn { width: 58%; }
    .dashboard .asideColumn { width: 42%; }
    .studentDiplomaTable td.col.colName { max-width: 150px; }
}

@media screen and (max-width:768px) {
    .dataTable thead, .dataTable td { padding: .65em .5em; }
    .dataTable thead th:nth-child(n+5), .dataTable td:nth-child(n+5) { display: none; }
    fieldset { padding: 1em 4%; width: 91%; }
    button, .button { margin-bottom: 1em; }
    .formList li.navigation button { margin-left: 0; margin-right: 2em; }
    label { display: block; font-size: .9em; width: auto; margin-bottom: .25em; }
    label.after { display: inline-block; font-size: 1em; }
    ul.toolList li label { display: inline-block; padding-top: .75em; }
    input.checkBox { margin-left: 0; }
    select { max-width: 280px; min-width: unset; }
    input.textBox:not([data-locked="locked"]):not(.small), textarea.textBox, .item-chosen-container { max-width: 35em; }
    select { min-width: unset !important; }
    .formList li small.fieldInfo { margin-left:0; }
    .dashboard .mainColumn { width: 50%; }
    .dashboard .asideColumn { width: 50%; }

    .statsTable tr:first-child td.count::before { right: 0; }
    .statsTable { margin-left: 0 !important; margin-top: .5rem !important; }
    #statsFilterForm .dateButtonList { margin-top: -2.5em; }
    #statsFilterForm .navigation button { margin-left: 0; }

    body.withUserNav nav#userNav { top: 50px; }
}

@media screen and (max-width:767px) {
    body:not(.singleSectionMode) #mobileHeader { display: block; height: 50px; background: #313b45; border-bottom: solid 1px #4b545d; position: fixed; top: 0; left: 0; right: 0; z-index: 101; }
    #mobileHeader a { color: #c2cad2; display: inline-block; margin: 13px; }
    #mobileHeader a i { font-size: 2.1em; }
    main { left: 0 !important; top: 50px; min-width: unset; }
    .singleSectionMode main { top: 0; }
    #mainNav { display: none; top: 50px; overflow-y: auto; overflow-x: hidden; }
    .treeMenu, #sectionTree { top: 50px; max-width: calc(100% - 90px); left: 90px; }
    .treeMenu[data-trigger] { z-index: 10; }
    #sectionTree > ul li a.item { width: 140px; min-width: 0; }
    body.hasNav #mainNav { display: block; z-index: 100; }
    #userInfo { left: 0; }
    ul.breadcrumbList li { display: none; }
    ul.breadcrumbList li:nth-child(1), ul.breadcrumbList li:last-child { display: inline-block; }
    ul.breadcrumbList li a:last-child { max-width: 250px; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }
    .dataTable { margin: 0 4% 2em; }
    .dataTable thead th, .dataTable td { max-width: 50px; overflow: hidden; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }
    ul.toolList, main > ul.toolList { margin: 15px 0 .5em; max-width: 100%; overflow: auto; white-space: nowrap; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 0 4%; }
    ul.tabList { margin: 0 4%; }
    div.card { padding: 15px 4%; margin-bottom: 1em; }
    div.card ul.cardList { width: 97%; }
    body.dashboard { overflow: auto; }
    .dashboard main, .dashboard #aside, .dashboard .scrollContent, .dashboard #userInfo { position: static; width: auto; height: auto; }
    .dashboard main { margin-top: 50px;}
    .dashboard .scrollContent { overflow: visible; }
    .dashboard .header { height: 75px; }

    #dashboardSearchBox { float: none; margin: 0; padding-top: .3em; }
    #dashboardSearchBox ul.formList { text-align: center; margin-top: 0; }
    #dashboardSearchBox ul.formList li:first-child { margin-left: 0; }
    #dashboardSearchBox input { width: 12em !important; min-width: unset; }

    .dashboard #primaryAdministratorToggle { position: absolute; margin-left: auto; margin-top: auto; top: 4rem; left: 1.5rem; right: 1.5rem; text-align: center; }
    .dashboard #primaryAdministratorToggle label { display: inline-block; vertical-align: middle; margin-bottom: 0; }

    .dashboard main .header:first-child h1.firstHeader { display: none; }

    ul.dashboardLinkList li a { max-width: 70%; overflow: hidden; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }
    ul.dashboardLinkList li .comment { max-width: 95%; overflow: hidden; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }
    .dashboardBoxContent { max-height: none; height: auto !important; }
    div.card .cardHeader h2 { max-width: 80%; }
    #datePickerWrapper { max-width: 280px; }
    .formList.sideBySide li { display: block; }
    .dashboard .column { width: 100% !important; float: right; }
    .dashboard .mainColumn .column { float: left; }
    .loginpage header { margin-left: 0; }
    .pickmeup .pmu-instance { width: auto; border-right: none; }
    ul.toolList li form { display:none; } 
    .template2243 ul.toolList li.custom { display:none; }

    /* login */
    .loginpage .wrapper { max-width: 680px; width: 100%; text-align: center; }
    .loginpage header { }
    .loginpage header img { max-width: 80%; margin: 0 auto; }
    .loginpage .formList li label { text-align: center; margin-right: auto; }
    .loginpage .formList li.navigation { }
    .loginpage .formList li.navigation button { margin-left: 0; margin-right: 1.25em; }
    .loginpage .formList li.navigation a { white-space: nowrap; }
    .loginpage form div.status { margin-left: 0; }
    .loginpage form { max-width: 500px; margin: 0 auto; }
}

@media screen and (max-height: 1023px) {
    #mainNav ul li a { padding: .95em 15px; }
    #mainNav ul li a i { font-size: 2em; }
}


@media screen and (max-height: 768px){
    #mainNav ul li a { padding: .75em 15px; }
    #mainNav ul li a i { font-size: 1.6em; }
    #mainNav ul li a span { font-size: .7em; padding-top: .1em; }
}

@media print {
    html { font-size: 10px; }
    nav, #userInfo, ul.toolList, .noPrint { display: none !important; }
    main { left: 0 !important; min-width: unset; }
    .scrollContent { overflow: visible; padding-top: 0; }
    .header { background: #fff; height: auto; color: #222; }
    .dataTable { width: 100%; margin: 0 0 2em; }
    .dataTable .tablesorter-filter-row { display: none; }

    body.nameTagsPage { margin: 0 !important; padding: 0 !important; }
    body.nameTagsPage .header { display: none; }
    body.nameTagsPage main, body.nameTagsPage .scrollContent { position: static; }
    .nameTags { height: auto !important; margin: 0 !important; border: none !important; page-break-before: always; }
    .nameTags:first-child { page-break-before: avoid; }
    .nameTags div.nameTag { border: none !important; }
    .nameTags.type2 { page-break-before: avoid; zoom: normal !important; }
}