div.ie_error {
    position: absolute;
    top: 50px;
    width: 30%;
    left: 35%;
    border: 1px solid #da5251;
    color: #da5251;
    background: #F6D8D8;
    text-align: center;
}

div.ie_error div {
    padding: 20px;
}

/* common */
.align-right {
    text-align: right;
}

.align-center {
    text-align: center;
}

.align-left {
    text-align: left;
}

.nowrap {
    white-space: nowrap;
}

.nomargin {
    margin: 0;
}

/* environemt */
div.environment {
    transform: rotate(-45deg);
    background: #F6D8D8;
    border: 3px solid #DA5251;
    line-height: 40px;
    color: #DA5251;
    position: fixed;
    top: 25px;
    left: -105px;
    padding: 0 100px;
    text-align: center;
    text-transform: uppercase;
    font-weight: bold;
    width: 100px;
    z-index: 1000;
}

/* login form */
body.loginpage form {
    max-width: 270px;
}

body.loginpage form .progress {
    background: #282828;
    height: 21px;
    display: none;
    margin-top: -9px;
}

body.loginpage .password-verdict {
    display: block;
    width: 270px;
}

/* calendar */
.fc th.fc-widget-header {
    padding: 0 5px 0 0;
}

.fc-agenda-slots td div {
    height: 25px;
}

.fc-event div.icons {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 12px;
    z-index: 9999;
}

.fc-event div.icons span {
    margin-right: 5px;
}

.fc-event-vert {
    overflow: hidden;
}

#calendar tr td.fc-state-highlight {
    background: #F6EDBA;
}

div.category_sample {
    display: inline-block;
    width: 15px;
    height: 15px;
    vertical-align: top;
    margin: 0 5px 0 0;
}

table.fc-agenda-allday td.fc-last {
    background: transparent;
}

div.category_sample.sample_1 {
    background: #FFFFFF;
    border: 1px solid #000000;
}

div.category_sample.sample_2 {
    background: #1A57B0;
    border: 1px solid #243B5A;
}

div.category_sample.sample_3 {
    background: #96E2C8;
    border: 1px solid #708E84;
}

div.category_sample.sample_4 {
    background: #75EE63;
    border: 1px solid #5C8356;
}

div.category_sample.sample_5 {
    background: #FFC494;
    border: 1px solid #A37C5B;
}

div.category_sample.sample_6 {
    background: #B1B401;
    border: 1px solid #8D8A43;
}

div.category_sample.sample_7 {
    background: #E26585;
    border: 1px solid #BF8071;
}

div.category_sample.sample_8 {
    background: #6842CB;
    border: 1px solid #211C32;
}

div.category_sample.sample_9 {
    background: #FF0000;
    border: 1px solid #211C32;
}

div.category_sample.sample_10 {
    background: #FCFF00;
    border: 1px solid #8C8E01;
}

div.category_sample.sample_11 {
    background: #000000;
    border: 1px solid #000000;
}

/* jgrowl color */
div.jGrowl div.jGrowl-notification, div.jGrowl div.jGrowl-closer {
    width: 275px;
}

div.jGrowl div.error {
    background-color: #F6D8D8;
    border-color: #E18D9A;
    color: #DA5251;
}

div.jGrowl div.success {
    background-color: #DFF0D8;
    border-color: #B4DA95;
    color: #468847;
}

div.jGrowl div.info {
    background-color: #d9edf7;
    border-color: #88C4E2;
    color: #3A87AD;
}

/* headers and boxes */
.widgettitle a.add a.import-enrollments {
    float: right;
}

/* table */
td.buttongroup,
th.buttongroup {
    width: 1%;
    white-space: nowrap;
}

td.buttongroup a {
    margin: 0 5px;
}

td.buttongroup a:hover {
    text-decoration: none;
}

/* change password */
.change_password {
    text-align: center;
    margin-bottom: 20px;
    color: #FFF;
}

.change_password img {
    background: #fff;
    padding: 5px;
    display: inline-block;
    margin-bottom: 10px;
}

/* box in top header */
.head-alerts {
    background-image: url(../images/icons/exclamation.png);
}

ul.alerts span.label {
    display: inline-block;
    width: 70px;
    text-align: center;
}

.headmenu > li {
    min-height: 110px;
}

/* main menu */
.leftmenu .nav-tabs.nav-stacked .dropdown ul li.active a {
    background: #fff;
}

/* button link fix */
a.btn, a.btn:link {
    color: #333333;
}

a.btn-info, a.btn-info:link,
a.btn-danger, a.btn-danger:link,
a.btn-success, a.btn-success:link,
a.btn-primary, a.btn-primary:link,
a.btn-warning, a.btn-warning:link,
a.btn-inverse, a.btn-inverse:link {
    color: #FFFFFF;
}

/* tables */
.table td {
    vertical-align: middle;
}

.table td.buttongroup a {
    margin-left: 10px;
    color: #333;
}

.table td.buttongroup a:first-child {
    margin-left: 0px;
}

.table td.buttongroup > span.icon-empty {
    margin-left: 10px;
}

.table td.buttongroup > span.icon-empty:first-child {
    margin-left: 0px;
}

.table tr:hover td {
    background: #EEE;
}

td.buttongroup a:hover {
    color: #333;
    text-decoration: none;
}

td.buttongroup {
    white-space: nowrap;
}

/* tinymce */
.tmce ul {
    padding-left: 20px !important;
    margin: 0 !important;
    border: 0 none !important;
}

.tmce ul li {
    padding: 0 !important;
    margin: 0 !important;
    border: 0 none !important;
}

/* datatable */
tr td {
    background: #FFFFFF;
}

.dataTables_wrapper th.sorting {
    background: #333 url(../images/calendar_sort_def.png) no-repeat right center;
    cursor: pointer;
}

.dataTables_wrapper th.sorting_asc {
    background: #333 url(../images/calendar_sort_asc.png) no-repeat right center;
    cursor: pointer;
}

.dataTables_wrapper th.sorting_desc {
    background: #333 url(../images/calendar_sort_desc.png) no-repeat right center;
    cursor: pointer;
}

.dataTables_wrapper th.nosort {
    background: #333;
    cursor: default;
}

.dataTables_wrapper tfoot {
    display: table-header-group;
}

.dataTables_wrapper tfoot th {
    background: #444 !important;
    border-color: #555 !important;
    vertical-align: middle;
}

.dataTables_wrapper tfoot input {
    padding: 5px 0;
    width: 98%;
    margin: 0;
    padding-left: 5px;
}

.dataTables_wrapper tfoot select {
    padding: 5px 0;
    width: 98%;
    margin: 0;
}

.filter_column.filter_date_range input {
    width: 75px;
    display: inline-block;
}

.filter_column.filter_date_range input:first-child {
    margin-right: 5px;
    margin-bottom: 5px;
    float: left;
}

.dataTables_paginate.paging_full_numbers span > span {
    padding: 5px 10px;
    border: 1px solid #ccc;
    border-left: 0;
    font-size: 11px;
    background: #eee;
}

.dataTables_paginate .paginate_button.current {
    background-color: #ccc;
}

.DTTT_container {
    position: absolute;
    right: 10px;
    top: 12px;
}

.DTTT_container > a {
    display: inline-block;
    line-height: 20px;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    font-size: 11px;
    padding: 4px 7px 3px 10px;
    background: #eee;
    text-shadow: none;
    border: 1px solid #bbb;
}

.DTTT_container > a:hover {
    text-decoration: none;
    color: #999999;
}

#with_table_tools_filter {
    right: 55px;
}

.dataTables_processing {
    display: block;
    padding: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    background: #fff url('../images/loading.gif') center center no-repeat;
    z-index: 999;
    opacity: 0.5;
    top: 0;
    text-align: center;
    color: #fff;
}

/* form */
.input-block-level {
    min-height: 32px;
}

.stdform p, .stdform div.par {
    margin: 5px 0;
}

input[type="file"] {
    padding: 0 3px;
    margin-bottom: 10px;
}

.chzn-container-multi .chzn-choices {
    border: 1px solid #bbb;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

input[type="radio"], input[type="checkbox"] {
    margin: 0;
}

.stdform.small label, .modal .stdform label {
    width: 100px;
}

.stdform.small .stdform span.field, .modal .stdform span.field {
    margin-left: 120px;
}

.stdform.small span.field, .stdform.small div.field,
.modal .stdform span.field, .modal .stdform div.field {
    margin-left: 120px;
}

.stdform.small span.formwrapper, .modal .stdform span.formwrapper {
    margin-left: 120px;
    min-height: 37px;
}

.stdform small.desc {
    margin-top: -5px;
    font-size: 12px;
}

@media screen and (max-width: 720px) {
    .modal {
        position: absolute;
    }

    .modal .modal-body {
        max-height: inherit;
    }

    .stdform.small label, .modal .stdform label {
        width: auto;
    }

    .stdform.small .stdform span.field, .modal .stdform span.field {
        margin-left: 0px;
    }

    .stdform.small span.field, .stdform.small div.field,
    .modal .stdform span.field, .modal .stdform div.field {
        margin-left: 0px;
    }

    .stdform.small span.formwrapper, .modal .stdform span.formwrapper {
        margin-left: 0px;
        min-height: 37px;
    }
}

.cl label, .modal .cl label {
    float: none;
    width: auto;
    padding: 5px 0;
}

/* parsley */
.parsley-error {
    border: 1px solid #E18D9A !important;
}

.parsley-errors-list li {
    list-style: none;
    margin-top: -10px;
}

.parsley-errors-list li {
    list-style: none;
    color: #DA5251;
}

/* modal */
.modal-header {
    background: #3B6C8E;
    color: #FFF;
}

.modal-header h3 {
    font-size: 16px;
}

.modal-body {
    overflow: visible;
}

.modal.large {
    width: 90%;
    margin-left: -45%;
}

.modal.medium {
    width: 900px;
    margin-left: -30%;
}

/* select 2 */
.select2-container .select2-choice {
    overflow: visible;
}

/* documents */
.search_documents input[type="text"] {
    padding: 8px 12px;
    height: 38px;
    margin: 0;
}

.search_documents .btn {
    line-height: 24px;
    margin: 0;
}

.search_documents .select2-container {
    margin: 0;
}

.search_documents .select2-container .select2-choice {
    height: 28px;
    padding: 8px 0 0 8px;
}

.search_documents .select2-container .select2-choice abbr {
    top: 12px;
}

.search_documents .select2-container .select2-choice .select2-arrow b {
    background-position: 0 6px;
}

.search_documents input[type="submit"] {
    padding: 8px 12px;
    height: auto;
    margin: 0;
}

table.document_detail {
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    margin-bottom: 20px;
}

table.document_detail tr td {
    background: #fff;
}

table.document_detail tr.main_document_header td {
    border-bottom: 1px solid #3B6C8E;
    background: #3B6C8E;
    color: #fff;
}

table.document_detail tr.document_header td {
    background: #333333;
    color: #fff;
}

/* progress bar */
.progress {
    border: 1px solid #DDD;
}

/* main background */
.rightpanel {
    background: #fff;
}

/* slider */
.ui-slider-horizontal .ui-slider-range {
    background: #3B6C8E;
}

/* course active customers */
#mainwrapper .theme_multiselect .select2-choices {
    min-height: 32px;
}

#mainwrapper .theme_multiselect .select2-selection__rendered {
    padding: 0;
    min-height: 32px;
}

#mainwrapper .theme_multiselect .select2-search-choice {
    padding: 5px 20px 5px 5px;
    margin: 0;
    border: 0;
    border-top: 1px solid #bbb;
    float: none;
    background: #eee;
}

#mainwrapper .theme_multiselect .select2-selection__choice {
    padding: 5px 20px 5px 5px;
    margin: 0;
    border: 0;
    border-top: 1px solid #bbb;
    float: none;
    background: #eee;
}

#mainwrapper .theme_multiselect .select2-selection__choice:first-child {
    margin-top: 32px;
}

#mainwrapper .theme_multiselect .select2-search-choice:first-child {
    margin-top: 32px;
}

#mainwrapper .theme_multiselect .select2-search-choice-close {
    right: 5px;
    top: 10px;
    left: auto;
}

#mainwrapper .theme_multiselect .select2-selection__choice__remove {
    right: 5px;
    top: 10px;
    left: auto;
}

#mainwrapper .theme_multiselect .select2-search-field {
    position: absolute;
    top: 0;
}

#mainwrapper .theme_multiselect .select2-search {
    position: absolute;
    top: 0;
    bottom: 0;
}

#mainwrapper .theme_multiselect ul.parsley-errors-list {
    text-align: right;
}

/*override select2 v4*/
.select2-container--default .select2-selection--multiple {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    padding-bottom: 0;
}

.select2-dropdown {
    border-radius: 0px;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    border-radius: 0px;
}

.select2-selection select2-selection--multiple {
    padding: 0;
}

/* tr td container background */
tr.red td, td.red {
    background-color: #F6D8D8 !important;
    color: #da5251 !important;
    border-color: #ccc !important
}

tr.blue td, td.blue {
    background-color: #D9EDF7 !important;
    color: #3a87ad !important;
    border-color: #ccc !important
}

tr.yellow td, td.yellow {
    background-color: #F6EDBA !important;
    color: #9c6c38 !important;
    border-color: #ccc !important
}

tr.green td, td.green {
    background-color: #DFF0D8 !important;
    color: #468847 !important;
    border-color: #ccc !important
}

/* customlist */
.customlist li {
    list-style: none;
    margin-bottom: 1px;
    display: block;
}

.customlist li a {
    color: #777;
    display: block;
    padding: 7px 10px;
    background: #eee;
    position: relative;
}

.customlist li a:hover {
    text-decoration: none;
    background: #ddd;
}

/* messages */
div#message_attachments {
    margin: 10px 0 25px 220px;
}

/* courses */

/* enrollments */
table.tutor_table tr td:nth-child(3), table.tutor_table tr th:nth-child(3) {
    display: none;
}

table.tutor_table tr td:nth-child(9), table.staff_table tr td:nth-child(9) {
    white-space: nowrap;
}

table.tutor_table tr td:nth-child(9) a, table.staff_table tr td:nth-child(9) a {
    color: #333;
}

table.tutor_table tr td:nth-child(9) span, table.staff_table tr td:nth-child(9) span {
    margin-left: 10px;
}

div.timing {
    height: 492px;
    overflow: auto;
}

div.progress.enrollments {
    height: 20px;
    background: #0866C6;
    position: relative;
}

div.progress.enrollments div {
    line-height: 20px;
}

div.progress.enrollments div span {
    display: block;
    position: absolute;
    width: 100%;
}

/* users */
table.user_table tr td:first-child {
    text-align: center;
}

table.user_table tr td:first-child img {
    max-width: 60px;
}

table.user_table tr td:nth-child(7) {
    text-align: center;
}

table.user_table tr td:nth-child(9) {
    white-space: nowrap;
    text-align: center;
}

table.user_table tr td:nth-child(9) span {
    margin-right: 10px;
    color: #333;
}

/* logs */
.profile-left .taglist a.current {
    background: #ddd
}

.profile-left .taglist li a span {
    top: 12px;
}

/* commonlists */
ul.commonlists {
    margin-top: 5%;
    margin-bottom: 4%;
}

ul.commonlists, ul.commonlists li {
    list-style-type: none;
}

ul.commonlists li {
    margin-top: 1px;
    display: block;
    position: relative;
}

ul.commonlists li > .export_checklist {
    position: absolute;
    height: 20px;
    display: inline-block;
    line-height: 20px;
    top: 0;
    right: 0;
    width: 25px;
    border-right: 1px solid #fff;
    border-left: 1px solid #fff;
    text-align: center;
}

ul.commonlists li a {
    display: block;
    padding: 10px;
    background: #eee;
    color: #555;
}

ul.commonlists li a.disabled {
    background: #3b6c8e;
    color: #fff;
}

ul.commonlists li a.disabled:hover {
    background: #1f6377;
    color: #fff;
}

ul.commonlists li a:hover {
    background: #ddd;
    text-decoration: none;
    color: #555;
}

ul.commonlists li .label {
    width: 90px;
    display: inline-block;
    margin-right: 10px;
}


/*audits*/
#delete_checklist,
#delete_section,
#delete_question,
.update_uncompliance,
.delete_uncompliance,
#delete_preset,
#delete_auditor,
#add_audit,
#delete_audit,
#export_audit,
#use_preset,
#auditor-violation-warning {
    display: none;
}

.modal-hide {
    display: none;
}

#import-audit {
    margin-top: 2%;
    margin-bottom: 2%;

}

.audit-field {
    margin-left: 2%;
    margin-right: 4%;
}

.form-group {
    margin-bottom: 2%;
}

/* form elements */
.radio input[type="radio"],
.radio-inline input[type="radio"],
.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"] input {
    margin: 4px 4px 0 0;
}

.checkbox label {
    line-height: 21px;
    font-size: 12px;
}

.form-group .control-label {
    margin-top: 9px;
}

/* uncompliances list */
ul.uncompliances, ul.uncompliances li {
    list-style-type: none;
}

ul.uncompliances li {
    margin-top: 1px;
    display: block;
    padding: 10px;
    background: #eee;
    color: #555;
    position: relative;
    padding-left: 160px;
}

ul.uncompliances li > span {
    position: absolute;
    height: 41px;
    display: inline-block;
    line-height: 41px;
    top: 0;
    left: 0;
    width: 150px;
    border-right: 1px solid #fff;
    text-align: center;
}

ul.uncompliances li a.update, ul.uncompliances li a.delete, a.enable, a.disable, ul.uncompliances li a.corrective_actions {
    font-size: 14px;
    height: 40px;
    width: 40px;
    text-align: center;
    line-height: 40px;
    color: #555;
    background: #eee;
    position: absolute;
    top: 0;
    right: 0;
    border-left: 1px solid #fff;
}

ul.uncompliances li a.update {
    right: 120px;
}

ul.uncompliances li a.delete {
    right: 80px;
}

ul.uncompliances li a.enable,
ul.uncompliances li a.disable {
    right: 40px;
}

ul.uncompliances li a:hover {
    background: #ddd;
    text-decoration: none;
}

ul.uncompliances li a.corrective_actions {
    cursor: default;
}

.dropdown-menu a span[class^="iconfa-"] {
    margin-right: 10px;
}

/* nestable */
.nestable .dd-list {
    padding-left: 41px;
}

.nestable > .dd-list {
    padding-left: 0;
}

.nestable .dd-list .dd-item {
    list-style-type: none;
}

.nestable .dd-list .dd-item .content {
    padding: 10px 10px 10px 52px;
    margin-top: 1px;
    color: #555;
    background: #eee;
}

.nestable .dd-list .dd-item .dd-item .dd-item .content {
    padding-left: 10px;
}

.nestable-audit .dd-list .dd-item button {
    float: left;
    display: inline-block;
    height: 41px;
    line-height: 41px;
    width: 41px;
    background: #eee url(../images/arrow-down.png) no-repeat center center;
    border: none;
    border-right: 1px solid #FFF;
    text-indent: 100px;
    overflow: hidden;
}

.nestable-audit .dd-list .dd-item > button[data-action="collapse"] {
    background: #eee url(../images/arrow-up.png) no-repeat center center;
}

.nestable .dd-list .dd-item .content a {
    float: right;
    background: transparent url(../images/uncheck.png) no-repeat center center;
    width: 21px;
    height: 21px;
}

.nestable .dd-list .dd-item .content a:hover {
    text-decoration: none;
}

.nestable .dd-list .dd-item .content.active {
    background: #DFF0D8;
}

.nestable .dd-list .dd-item .content.active a {
    background: transparent url(../images/check3.png) no-repeat center center;
}

/* header and boxes */
.widgettitle a.add {
    color: #fff;
    font-size: 22px;
    float: right;
    text-decoration: none;
}

.accordion-aladino.ui-accordion {
    border-color: #3b6c8e;
}

.accordion-aladino.ui-accordion .ui-accordion-header {
    background-color: #3b6c8e;
    border: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.accordion-aladino.ui-accordion .ui-accordion-header:first-child {
    border-top: 0;
}

.accordion-aladino.ui-accordion .ui-accordion-header a {
    color: #fff !important;
    text-shadow: none;
    font-size: 14px;
}

.accordion-aladino.ui-accordion .ui-accordion-header a:hover {
    background: rgba(255, 255, 255, 0.1);
}

.accordion-aladino.ui-accordion .ui-accordion-header.ui-state-active a {
    background: #3b6c8e;
    color: #fff !important;
}

.accordion-aladino.ui-accordion .ui-accordion-content {
    border-color: #3b6c8e;
}

/*cropbox*/
.imageBox {
    position: relative;
    height: 300px;
    width: 525px;
    border: 1px solid #aaa;
    background: #fff;
    overflow: hidden;
    background-repeat: no-repeat;
    cursor: move;
}

.imageBox .thumbBox {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 262px;
    height: 182px;
    margin-top: -90px;
    margin-left: -125px;
    box-sizing: border-box;
    border: 1px solid rgb(102, 102, 102);
    box-shadow: 0 0 0 1000px rgba(0, 0, 0, 0.5);
    background: none repeat scroll 0% 0% transparent;
}

.imageBox .spinner {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    text-align: center;
    line-height: 400px;
    background: rgba(0, 0, 0, 0.7);
}

.btn-zoom-container {
    margin-bottom: 20px;
}

.btnZoom:hover,
.btnZoom:active,
.btnZoom:after {
    text-decoration: none;
}

#btnZoomIn {
    margin-right: 5px;
}

#btnZoomOut {
    margin-left: 5px;
}

.well-slot {
    background: #7bc3f6;
}

.training-title {
    margin-bottom: 5%;
}

.training-row-tab {
    margin-bottom: 50px;
}

.course-img:hover,
.training-course-img:hover {
    -moz-box-shadow: 0 0 10px #ccc;
    -webkit-box-shadow: 0 0 10px #ccc;
    box-shadow: 0 0 10px #ccc;
    opacity: 0.7;
    filter: alpha(opacity=70); /* For IE8 and earlier */

    -webkit-transform: scale(1.03);
    -ms-transform: scale(1.03);
    transform: scale(1.03);
    z-index: 1;
}

.enrollment-percentage {
    padding-top: 6%;
}

.progress-courses,
.progress-training {
    height: 8px;
}


.progress-training {
    margin-top: 4%;
}

.training-course-bar {
    background: #0A246A !important;
}

.tabbedwidget-trainings {
    height: 500px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.training-content-panel {
    background-size: cover;
    background-position: top;
    height: 100%;
}

.thumbnail-container {
    margin-top: 25%;
}

.course-image-div {
    padding-right: 2%;
}

/*formats*/

/* nestable title */
.nestable-format.titles-format .dd-content-format, .dd-dragel-format.titles-format .dd-content-format {
    height: 110px;
}

.nestable-format.titles-format .dd-handle-format, .dd-dragel-format.titles-format .dd-handle-format {
    height: 95px;
}

.nestable-format.titles-format a.dd-content-btn-format, .dd-dragel-format.titles-format a.dd-content-btn-format {
    height: 106px;
    line-height: 106px;
}

/* nestable */
.dd-format {
    position: relative;
    display: block;
    margin: 0;
    padding: 0;
    font-size: 13px;
    line-height: 30px;
}

.dd-list-format {
    display: block;
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
}

.dd-list-format .dd-list-format {
    padding-left: 40px;
}

.dd-collapsed-format .dd-list-format {
    display: none;
}

.dd-item-format,
.dd-empty-format,
.dd-placeholder-format {
    display: block;
    position: relative;
    margin: 0;
    padding: 0;
    min-height: 30px;
    font-size: 13px;
    line-height: 30px;
}

.dd-handle-format {
    display: block;
    height: 25px;
    margin: 5px 0;
    padding: 5px 10px;
    color: #333;
    text-decoration: none;
    font-weight: bold;
    border: 1px solid #ccc;
    background: #fafafa;
}

.dd-handle-format:hover {
    color: #2ea8e5;
    background: #fff;
}

.dd-item-format > button {
    display: block;
    position: absolute;
    top: 2px;
    cursor: pointer;
    float: left;
    width: 36px;
    height: 36px;
    margin: 5px 0;
    padding: 0;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    border: 0;
    background: #777;
    line-height: 1;
    text-align: center;
    font-weight: bold;
    color: #FFF;
}

.dd-item-format > button:before {
    content: '\25bc';
    display: block;
    position: absolute;
    width: 100%;
    text-align: center;
    text-indent: 0;
}

.dd-item-format > button[data-action="collapse"]:before {
    content: '\25b2';
}

.dd-placeholder-format,
.dd-empty-format {
    margin: 5px 0;
    padding: 0;
    min-height: 40px;
    background: #f2fbff;
    border: 1px dashed #b6bcbf;
}

.dd-empty-format {
    border: 1px dashed #bbb;
    min-height: 100px;
    background-color: #e5e5e5;
}

.dd-dragel-format {
    position: absolute;
    pointer-events: none;
    z-index: 9999;
}

.dd-dragel-format > .dd-item-format .dd-handle-format {
    margin-top: 0;
}

.dd-content-format {
    display: block;
    height: 40px;
    line-height: 40px;
    margin: 5px 0;
    padding: 0 0 0 80px;
    color: #333;
    text-decoration: none;
    border: 1px solid #ccc;
    background: #FFF;
}

.dd-content-format:hover {
    background-color: #eee;
}

.dd-dragel-format > .dd-item-format > .dd-content-format {
    margin: 0px;
}

.dd-item-format > button {
    margin: 0 0 0 41px;
}

.dd-handle-format {
    position: absolute;
    margin: 0;
    left: 0;
    top: 2px;
    cursor: pointer;
    width: 15px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    border: 1px solid #555;
    background: url(../images/move.png) #777 no-repeat center center;
}

.dd-handle-format:hover {
    background: url(../images/move.png) #888 no-repeat center center;
    border: 1px solid #999;
}

a.dd-content-btn-format {
    display: inline-block;
    width: 36px;
    height: 36px;
    background: #777;
    color: #fff;
    text-align: center;
    line-height: 36px;
    float: right;
    margin: 1px 1px 0 0;
}

a.dd-content-btn-format:hover {
    text-decoration: none;
    background: #888;
}

.nodepth-format .dd-content-format, .nodepth-format.dd-dragel-format .dd-content-format {
    padding: 0 0 0 80px;
}

.instances-format .dd-content-format {
    padding: 0 0 0 40px;
    background: #ffffff
}

.instances-format .dd-item-format > button {
    margin: 0 0 0 2px;
}

/* chapter_version */
form.chapter_version-format span.iconfa-save {
    position: absolute;
    top: 12px;
    right: 25px;
    font-size: 16px;
    cursor: pointer;
    color: #777;
    display: none;
}

/* replacement */
form.replacement-format > div {
    position: relative;
}

form.replacement-format span.iconfa-save {
    position: absolute;
    top: 8px;
    right: 8px;
    font-size: 16px;
    cursor: pointer;
    color: #777;
    display: none;
}

label.label-title-format {
    margin-right: 10px;
}

.row-fluid-title {
    margin: 10px 0 10px 0;
}

.user-customer-choice {
    padding-top: 2%;
}

#course_x_training .select2-search-choice {
    display: none;
}

.dd-content-trainings {
    padding: 0 0 0 0px;
    height: 30px;
    line-height: 30px;
}

.dd-handle-trainings {
    height: 16px;
    width: 16px;
    padding-left: 2px;
}

a.dd-content-btn-trainings {
    line-height: 30px;
    height: 28px;
    width: 28px;
}

.nodepth-trainings .dd-content-trainings, .nodepth-trainings.dd-dragel-format .dd-content-trainings {
    padding: 0 0 0 40px;
}

.stored-courses-table thead th {
    background-color: #3B6C8E;
}

.accordion-trainings-header {
    background-color: #3B6C8E !important;
    border-color: #3B6C8E;
}

.ui-accordion-trainings-header {
    background-color: #3B6C8E !important;
}

.ui-accordion-trainings-header a {
    color: #ffffff !important;
    text-shadow: none;
}

.ui-accordion-trainings-header a:hover,
.ui-accordion-trainings-header a:active,
.ui-accordion-trainings-header a:visited {
    color: #3B6C8E !important;
}

.open-close {
    float: right;
    padding-top: 4px;
}

.dd-content-btn-format-head {
    margin-top: 3px !important;
    margin-right: 2px !important;
    background: transparent !important;
    color: #fff !important;
}

div#tutor-list-choice {
    margin-top: 10px;
}

p.radio-tutor-choose {
    margin-bottom: 10px;
}

.modal-lg {
    width: 700px;
}

.modal-lg .modal-body {
    max-height: 525px;
}

.check-user-can-repeat-course {
    padding-top: 4px;
}

.p-user-can-repeat-course {
    margin-bottom: 14px !important;
}

span.tokenized-chapter {
    background-color: #1A57B0;
    -moz-border-radius: 70px;
    -webkit-border-radius: 70px;
    border-radius: 70px;
    padding: 2%;
}


span.no-tokenized-chapter {
    background-color: #888;
    -moz-border-radius: 70px;
    -webkit-border-radius: 70px;
    border-radius: 70px;
    padding: 2%;
}

span.tokenized-section {
    -moz-border-radius: 70px;
    -webkit-border-radius: 70px;
    border-radius: 70px;
    background-color: #1A57B0;
}

span#search-calendar-date {
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
}

span#delete-contact-icon {
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
}

button.input-append-btn-s2 {
    height: 34px;
}

label.audit-label {
    margin-right: 10px;
}

div.controls {
    padding: 5px;
    margin-bottom: 10px;
}

div.control-div {
    float: none !important;
    margin-right: 5px;
}

.control-audit {
    margin-right: 5px;
    height: 22px !important;
}

div#waiting-modal {
    height: 250px;
}

img.loading-gif {
    position: relative;
    margin-top: 15%;
    margin-bottom: 5%;
    left: 45%;
}

.widgettitle a.import-enrollments {
    color: #fff;
    font-size: 24px;
    float: right;
    text-decoration: none;
    margin: 0 20px;
}

div#move-section-modal {
    height: 650px;
    max-height: 650px;
}

div#move-section-modal .modal-footer {
    margin-top: 100px !important;
}

table#table-move-section {
    padding-top: 50px !important;
}

.table-move-section-row {
    cursor: pointer;
}

span.btn-download-certificate,
span.btn-download-test {
    cursor: pointer;
}

.enrollments-title-icons {
    margin: 0 15px;
}

.meat-balance-code-input {
    height: 24px !important;
    margin-left: 5px;
    margin-right: 5px;
}

.form-balance-code .row {
    margin-bottom: 10px;
    padding-left: 3%;
}

.form-balance .row select {
    color: #ccc !important;
}

button.select-all-places {
    cursor: pointer;
    height: 32px !important;
}

.edit-contact-refer_to-btn,
.edit-contact-phone-btn,
.edit-contact-email-btn {
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
}

.remove-contact-btn {
    position: absolute;
    right: 26px;
    top: 0;
    cursor: pointer;
}

ol.test-question-list {
    margin: 10px 0;
}

ol.test-question-list li {
    list-style: none;
    border: 1px solid #ccc;
    padding: 5px;
}

a.btn-test-question {
    display: inline-block;
    background-color: #777;
    margin-left: 2px;
    padding: 3px 5px;
}

div.test-question-container {
    display: flex;
}

div.test-question-col {
    display: flex;
}

div.test-question-text-container {
    width: 90%;
}

div.modal-body-add-question,
div.modal-body-edit-question,
div.modal-body-add-course,
div.modal-body-add-place,
div.modal-body-add-supplying-item,
div.modal-body-add-enrollment-to-slot,
div.modal-body-add-session-to-plan,
div.modal-body-add-ingredient,
div.modal-body-add-ward,
div.modal-body-processing-sheet,
div.modal-body-add-lot-to-processing-sheet,
div.modal-body-add-revenue,
div.modal-body-edit-revenue,
div.modal-body-use-recipe-for-compound {
    overflow-y: auto;
    max-height: 400px;
}

table.table-question-detail {
    margin-top: 10px;
}

.file-selected {
    margin-top: 10px;
}

div.courses-menu-link-div {
    position: relative;
    border: 1px solid #ccc;
    padding-top: 10px;
    padding-bottom: 10px;
    margin: 1px;
}

p.course-menu-title {
    margin-top: 20px;
}

.color-preview {
    display: inline-block;
    width: 28px;
    height: 28px;
    position: relative;
    top: 8px;
    border: 2px solid #ccc;
}

.delete-menu-link-item {
    position: absolute;
    right: 0;
    top: 0;
    width: 20px;
    text-align: center;
    padding: 10px;
    display: inline;
    background-color: #777777;
}

.edit-menu-link-item {
    position: absolute;
    right: 40px;
    top: 0;
    width: 20px;
    text-align: center;
    padding: 10px;
    margin-right: 1px;
    display: inline;
    background-color: #777777;
    color: #fff !important;
}

div.menu-content {
    padding: 10px;
    display: block;
}

div.menu-buttons-content {
    display: block;
    width: 100%;
    padding-bottom: 50px;
}

div.menu-buttons-content button {
    position: absolute;
    right: 30px;
}

a.enrollment-link {
    margin-left: 5px;
    margin-right: 5px;
}

span.tag-element {
    display: inline-block;
    background-color: #3B6C8E;
    border: 1px solid #ccc;
    padding: 3px;
    color: #fff;
}

i.remove-tag {
    cursor: pointer;
}

#merge-user-link {
    margin-right: 20px;
}

/*new user training and user course layouts*/
.color-input,
.color-label {
    margin-top: 10px;
}

.trainings-container,
.courses-container {
    display: flex;
    flex-direction: column;
    margin-bottom: 2%;
    margin-right: 5%;
    margin-left: 5%;
}

.training-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: 5px;
    margin-right: 5%;
    margin-left: 5%;
}

.training-courses-header {
    margin-top: 2%;
    margin-bottom: 2%;
}

.training-course-description {
    flex-grow: 9;
    padding: 5%;
    flex-shrink: 0;
}

.training-course-image {
    flex-grow: 1;
    flex-shrink: 0;
}

.training-headline-container,
.training-course-headline-container {
    border-radius: 10px;
    margin: 2% 0;
}

.training-headline-container {
    box-shadow: 5px 8px 5px 2px #888888;

}

.training-headline a {
    font-size: 18px !important;
}

.training-course-img,
.course-img {
    margin-left: auto;
    margin-right: auto;
    display: block;
}

.training-course-container {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin: 0 2%;
}

.course-container {
    display: flex;
    flex-direction: row;
    align-items: center;
    border: 1px solid #CCCCCC;
    margin-top: 5%;
    margin-bottom: 5%;
    border-radius: 5px;
    padding: 2%;
    box-shadow: 5px 8px 5px 2px #888888;
}

.course-description-title {
    margin-bottom: 2%;
}

.course-description {
    flex-grow: 9;
    padding-left: 2%;
}

.course-image {
    flex-grow: 1;
    flex-shrink: 0;
    margin: 10px;
}

.course-description-text {
    margin-bottom: 2%;
}

.course-description-button {
    margin-top: 2%;
}

.training-button {
    margin-top: 2%;
}

.training-description,
.training-progress,
.training-button {
    text-align: center;
    width: 96%;
    margin-left: 2%;
    margin-right: 2%;
}

.course-link-headline {
    font-size: 16px !important;
}

.course-description h4 {
    font-size: 18px;
}

.btn-start-enrollment,
.btn-start-training,
.btn-info-training {
    border-radius: 5px;
}

.course-description-text p,
.enrollment-progress p,
.training-progress p {
    font-size: 14px;
}

div.note-container {
    display: flex;
    flex-direction: column;

}

div.note-item-container, .replypanel,
div.note-item-container-reply {
    border: 1px solid #ccc;
    display: flex;
    flex-direction: row;
    border-radius: 15px;
    box-shadow: 5px 8px 5px 2px #888888;
    cursor: pointer;
}

div.note-item-container {
    margin: 2%;
    background-color: #9fbbce;
}

div.replypanel {
    margin: 2%;
    background-color: #edadad;
}

div.note-item-container-reply {
    margin-left: 5%;
    margin-bottom: 2%;
    background-color: #3dc68d;
}

div.note-item-image-container {
    flex: 1;
    padding-top: 20px;
    padding-bottom: 20px;
}

div.note-item-author-container {
    margin-bottom: 5px;
}

div.note-item-content-container,
div.topic-content {
    flex: 8;
    display: flex;
    flex-direction: column;
    padding: 15px

}

p.checkbox-container {
    margin-top: 20px !important;
}


div.note-item-image-container img {
    border-radius: 50%;
    border: 1px solid #ccc;
}

div.note-item-action-container {
    margin-left: 2%;
    padding-top: 5px;
    flex: 1;
}

div.note-item-action-container a {
    margin-left: 5px;
    margin-right: 10px;
}

textarea#note-edit-textarea,
textarea#note-reply-textarea,
textarea#reply-edit-textarea {
    width: 99%;
    resize: none;
}

div.note-item-content-text-container {
    margin-bottom: 20px;
}

@media (min-width: 576px) {
    div.note-item-image-container img {
        height: 40px;
        width: 45px;
    }
}

@media (min-width: 768px) {
    div.note-item-image-container img {
        height: 50px;
        width: 55px;
    }
}

@media (min-width: 992px) {
    div.note-item-image-container img {
        height: 60px;
        width: 65px;
    }
}

@media (min-width: 1200px) {
    div.note-item-image-container img {
        height: 70px;
        width: 75px;
    }
}

.datepicker-controls {
    height: 24px !important;
}

.supplying-items-tab-header {
    background-color: #3b6c8e;
    color: #fff;
}

.show-password,
.show-repeat-password {
    position: absolute;
    top: 23%;
    right: 5%;
    cursor: pointer;
}

.password-container {
    position: relative;
}

@media (max-width: 767.98px) {
    .course-container {
        flex-wrap: wrap;
        justify-content: center;
    }

    .course-description-title,
    .course-description-text,
    .enrollment-progress
    {
        text-align: center;
        margin: 5% 0;
    }

    .course-description-button {
        text-align: center;
        margin: 10% 0;
    }

    .course-image {
        display: flex;
        margin: 5% 0;
        justify-content: center;
    }
    .course-img {
        width: 80%;
        margin: 0 auto;
    }
}

@media (max-width: 575.98px) {
    .logo, .leftpanel {
        margin-left: -575.98px;
    }
}

@media screen and (max-width: 360px) {
    .logo, .leftpanel {
        margin-left: -600px;
    }

    .course-img {
        width: 60%;
    }
}