@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,700&subset=latin-ext');

body {
    background-color: #fbfbfb;
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    color: #4a4a4a;
    max-width: 1920px;
    margin: 0 auto;
}

.form-group {
    position: relative;
}

body.login {
    height: 100vh;
    background: #fff;
}

.login-box {
    width: 324px;
    height: 360px;
    top: calc(50% - 180px);
    position: absolute;
    left: calc(50% - 162px);
}

.login-box img {
    margin: 0 auto 30px;
}

.login-box .panel {
    border-radius: 0px;
}

.login-box .panel-default > .panel-heading {
    background: #FFF;
}

.login-box .panel-default > .panel-heading h3 {
    font-weight: bold;
}

a {
    color: #000;
    transition: all .3s ease;
}

a:focus, a:hover {
    color: #a4a4a4;
    text-decoration: none;
}

.white {
    color: #fff;
}

.green {
    color: #00ba00;
}

.bold {
    font-weight: bold;
}

.label-danger {
    border: 1px solid #fff
}

a.btn-certyf {
    background: #fff200;
    color: #000;
    padding: 5px 20px;
    margin: 15px 0;
    font-weight: bold;
    font-size: 20px;
}

a.btn-certyf:hover {
    background: #000;
    color: #fff;
    opacity: 1
}

.navbar-top-links a, .navbar-top-links a:hover {
    color: #fff;
}

.nav > li > a:focus, .nav > li > a:hover, .nav .open > a, .nav .open > a:focus, .nav .open > a:hover {
    background-color: transparent;
}

.dropdown-menu {
    border-radius: 0px;
    top: 95%;
}

.dropdown-menu .fa-user {
    color: #000;
}

.navbar-brand {
    padding: 6px 15px;
}

.nav.disabled,
.nav .disabled {
    opacity: .3;
}

.nav.disabled a,
.nav .disabled a {
    pointer-events: none;
}

.panel {
    background-color: #fff;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.panel img {
    max-width: 100%;
    height: auto !important;
}

.panel-body h3 {
    margin-bottom: 15px;
    font-size: 18px
}

#page-wrapper .alert {
    margin-top: 0;
    margin-bottom: 10px;
    border-radius: 0;
}

.panel-box {
    margin-bottom: 15px;
}

.btn-success, .btn-primary, .btn-success:focus, .btn-success.focus {
    border: 1px solid #521111;
    filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FFFFEC04', endColorstr='#FFFBCC05');
    color: #ffffff;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.btn-success:hover, .btn-primary:hover, .btn:hover, .btn:focus, .btn.focus {
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60);
    opacity: 0.6;
    background-color: transparent;
    text-decoration: none;
    color: #ffffff;
    border: 1px solid #7f0b21;
}

.btn.btn-success {
    background: green;
    border-color: green;
    color: #fff !important;
}

.btn.btn-success:hover,
.btn.btn-success:focus {
    color: green !important;
    border-color: green !important;
    background: #fff;
    outline: none !important;
    box-shadow: none !important;
}

.sidebar ul li {
    border-bottom: 1px solid #dddddd;
    background-color: #fff;
}


#page-wrapper {
    padding: 0px;
}

.navbar-static-top {
    border: none;
}

.gradient {
    background: #fff;
    margin-bottom: 30px;
    padding: 20px 0;
}

.gradient a {
    color: #000;
    text-decoration: underline !important;
}

.gradient a:hover {
    color: #a4a4a4;
}

.gradient a.goBack {
    color: #000;
}

.grey, thead tr th {
    background-color: #f5f5f5
}

h1, .h1 {
    font-weight: 400
}

h1, .h1, h2, .h2, h3, .h3 {
    margin-top: 5px;
    margin-bottom: 5px;
}

.page_title1 {
    font-size: 24px;
    color: #000;
    margin: 0;
}

.page_title2 {
    font-size: 18px;
    padding: 15px 0 0;
    color: #000;
}

.table-bordered-outside {
    border: 1px solid #ddd;
}

tr.collapse > td:first-child, tr.collapsing > td:first-child {
    padding-left: 26px;
}

.form-control {
    border-radius: 0;
}

tr.collapse:not(.in) .collapse-body, .collapseout .collapse-body {
    height: 0px;
    -webkit-transition: height 0.5s;
    transition: height 0.5s;
    overflow: hidden;
}

tr.collapse:not(.in) td, .collapseout td {
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    border-top: 0px solid #ccc;
}

.collapse.in .collapse-body, .collapsein .collapse-body {
    height: auto;
    -webkit-transition: height 0.5s;
    transition: height 0.5s;
}

tr.collapseing, tr.collapse {
    display: table-row;
}

.collapsein td {
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    padding-top: 8px;
    padding-bottom: 8px;
    background: rgba(0, 0, 0, 0.05);
}

.collapsed .glyphicon-triangle-bottom:before {
    content: "\e250";
}

.progress {
    text-align: center;
    background-color: #e2e2e2;
}

.padding80 {
    padding-left: 80px;
}

.link-s {
    text-decoration: underline;
    font-weight: bold
}

.paragraph {
    background: url(../img/paragraph.svg) no-repeat top left;
    padding: 0px 10px 10px 80px;
    min-height: 75px;
    margin-top: 5px;
}

.exclamation {
    background: url(../img/ex.svg) no-repeat top left;
    padding: 0px 10px 10px 80px;
    min-height: 75px;
}

.width70 {
    width: 72%
}

.answer_tip {
    font-style: italic;
    font-size: 12px;
    margin-top: 5px;
}


.bgred {
    background: #7f0b21 !important;
    color: #fff !important;
    padding: 0.5em 10px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.blockquote {
    background: #fee704;
    color: #000;
    padding: 0.5em 10px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    quotes: "\201C" "\201D" "\2018" "\2019";
}

.blockquote:before {
    color: #000;
    content: open-quote;
    font-size: 4em;
    line-height: 0.1em;
    margin-right: 0.25em;
    vertical-align: -0.4em;
}

.blockquote:after {
    color: #000;
    content: close-quote;
    font-size: 4em;
    line-height: 0.1em;
    margin-right: 0.25em;
    vertical-align: -0.4em;
}

.heading {
    width: 100%;
    padding: 0.5em 10px;
    text-align: left;
    border: 1px solid #58595b;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.blockquote p {
    display: inline;
}

.bgred-cont {
    font-size: 17px;
    text-align: center;
    padding: 20px;
}

.dividerhr td {
    padding-left: 20px;
    padding-right: 20px;
}

.progresshr td {
    padding-left: 5px;
    padding-right: 5px;
}

.dividerhr hr {
    border-width: 3px;
    border-color: black;
}

.blue {
    color: blue;
}


.circle1 {
    background: #000;
    width: 40px;
    height: 40px;
    -moz-border-radius: 40px;
    -webkit-border-radius: 40px;
    border-radius: 40px;
    padding: 1px 9px;
    line-height: 40px;
    font-size: 30px;
    color: white;
}

.circle2 {
    background: none;
    border: solid 1px #000;
    width: 30px;
    height: 30px;
    -moz-border-radius: 30px;
    -webkit-border-radius: 30px;
    border-radius: 30px;
    padding: 5px 10px;
    line-height: 30px;
    font-size: 17px;
}

.cos {
    background-color: #871027;
}

.cos:hover,
.cos:focus {
    background-color: #861026;
}

.bgyellow p {
    margin: 0;
}

.bgyellow ul, .bgyellow ol {
    margin-top: 10px;
    margin-bottom: 10px;
}

.messages .dropdown-menu {
    min-width: 500px;
    padding-bottom: 0;
}

.messages .dropdown-menu li:after, .messages .dropdown-menu .clearboth:after {
    content: "";
    display: table;
    clear: both;
}

.messages ul.dropdown-menu > li.topic-li {
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.messages ul.dropdown-menu > li.topic-li a {
    padding: 6px 20px;
}

.messages ul.dropdown-menu > li.topic-li .last-post {
    color: rgba(0, 0, 0, 0.5);
    padding-top: 5px;
    font-size: 90%;
}

.messages ul.dropdown-menu > li.topic-li .last-post span {
    color: rgba(0, 0, 0, 0.6);
}

.messages .dropdown-menu li.odd-bg {
    background-color: rgba(0, 0, 0, 0.05);
}

.messages ul.dropdown-menu > li.odd-bg:hover a {
    background-color: rgba(0, 0, 0, 0.05);
}

.messages .dropdown-menu li.content {
    padding: 3px 20px;
}

.messages .dropdown-menu li.text-right {
    text-align: right;
}

.messages .dropdown-menu li.title a, .messages .dropdown-menu li.content {
    background: #fff !important;
}

.messages .dropdown-menu li.title a {
    margin-bottom: 7px;
}

.messages .dropdown-menu li .btn {
    color: #fff;
    display: inline-block;
}

.messages .dropdown-menu li .btn.btn-info:hover, .messages .dropdown-menu li .btn.btn-info:focus {
    color: #fff;
    background-color: #5bc0de;
    border-color: #46b8da;
}

.posts {
    padding: 15px 0;
}

.post-item .post-details {
    padding-bottom: 5px;
    color: rgba(0, 0, 0, 0.5);
}

.post-item .post-details > span {
    font-weight: bold;
    color: rgba(0, 0, 0, 0.7);
}

.post-item .well {
    box-shadow: none;
}

.post-item.my-post .well {
    color: #fff;
    background: rgba(117, 14, 33, 0.8);
}

.post-item.creator-post .well {
    border: 1px solid rgba(117, 14, 33, 0.3);
    box-shadow: inset 0 0 10px rgba(117, 14, 33, 0.3);
}

#sidebar {
    background: #fbfbfb;
    min-height: 100vh;
    padding: 0 40px;
    position: relative;
    overflow: auto;
}

.login #sidebar::after {
    position: absolute;
    content: "";
    top: 150px;
    left: 80px;
    height: 1px;
    width: calc(100% - 80px);

}

#appContent {
    padding: 0 80px 30px 30px;
    margin-bottom: 0;
    background: #fff;
    min-height: 100vh;
}

#appLogo {
    margin: 40px 0;
    display: inline-block;
}

#clLogo {
    margin: 40px 0;
    background-image: url('../img/logo_client.png');
    background-position: 0px center;
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    height: 105px;
}

.login #appHeader {
    margin: 40px 0 60px;
}

#appHeader {
    margin: 0 0 50px;
    padding: 0 0 30px;
    border-bottom: 1px solid #e6e4f1;
    position: relative;
}

#appHeader a {
    color: #fff200;
}

#appHeader a:hover {
    text-decoration: none;
    color: #4a4a4a;
}

.login #appHeader h1 {
    margin: 0 0 0 20px;
}

#appHeader h1 {
    margin: 0;
    line-height: 50px;
    font-size: 30px;
    font-weight: 300;
    display: inline-block;
    vertical-align: middle;
}

#appHeader h3 {
    margin: 20px 0 0;
    font-weight: 300;
}

.circleIcon {
    width: 50px;
    height: 50px;
    background-color: #fff200;
    color: #000;
    text-align: center;
    line-height: 50px;
    border-radius: 50%;
    font-size: 20px;
    display: inline-block;
    vertical-align: middle;
}


.formWrapper {
    width: 100%;
    max-width: 100%;
    margin-bottom: 30px;
}

.login .formWrapper {
    width: 320px;
}

.formWrapper .form-control {
    border: 1px solid #efeef8;
    color: #4a4a4a;
    box-shadow: none;
}

#lesson-lector {
    vertical-align: middle;
    margin: 0 0 0 10px;
}

.lector-audio {
    margin: 0 0 30px;
    text-align: right;
}

.actions button a {
    color: #000 !important;
}

.actions a {
    color: #000;
}

.actions button:hover a {
    color: #fff200;
}

.actions button {
    display: none;
}

.actions button.buttons-colvis {
    display: block;
}

.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus {
    background-color: #fff200;
    color: #000;
}

.pagination > li > a, .pagination > li > span {
    color: #000;
}

.ah-search .col-xs-12,
.ah-search .col-lg-4 {
    padding-left: 0;
}

.ah-search input {
    height: 47px;
    box-shadow: none !important;
}

.ah-search input:focus {
    border-color: #fff200;
}

thead th {
    background: #fff200 !important;
    color: #000;
    font-weight: 400;
}

.dropdown-menu thead th {
    background: inherit !important;
    color: inherit;
    font-weight: inherit;
}

.btn {
    background-color: #fff200;
    border: 2px solid #fff200;
    color: #000;
    font-size: 14px;
    font-weight: 700;
    padding: 12px 20px;
    border-radius: 0;
    transition: all .3s ease;
}

.btn:hover,
.btn:focus {
    color: #000 !important;
    background-color: #fff !important;
    border: 2px solid #000 !important;
}

.formWrapper .btn,
.table-responsive + .btn {
    margin-top: 15px;
}

.post-item.my-post .well {
    background-color: #fff200;
    border-color: #fff200;
}

table i {
    color: #000;
    margin: 0 5px 0 0;
}

.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    background-color: #fff200;
    border-color: #fff200;
    color: #000;
}

#userBar {
    background: #fff;
    padding: 0 80px 30px 30px;
    border-left: 1px solid #fff;
}

#userBar li:last-of-type {
    margin-right: 0;
}

#userBar > ul > li > a {
    color: #4a4a4a;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 400;
}

#userBar li a i {
    color: #4a4a4a;
    margin-right: 10px;
}

.padding-0 {
    padding: 0;
}

#page-wrapper {
    margin: 0;
    border: 0;
    min-height: unset !important;
}

#page-wrapper img {
    max-width: 100%;
}

.messages .label-info {
    background-color: #fff200;
}

td:last-of-type {
    min-width: 110px;
}

.dropdown-menu td:last-of-type {
    min-width: unset;
}

.pagination > li:first-child > a, .pagination > li:first-child > span {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.pagination > li:last-child > a, .pagination > li:last-child > span {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.infoBar {
    margin-top: 10px;
}

.question-answer {
    margin: 50px 0 0;
}

.question-answer label p {
    display: inline;
}

.panel-default > .panel-heading {
    background: #fff200;
    color: #000;
}

.infos.pag, .infos {
    text-align: right;
}

.panel-red,
.panel-blue,
.panel-green,
.panel-yellow {
    border-color: #efeef8
}

.panel-red:not(.panel-red-chart) .panel-heading {
    border-color: #fff200;
    background-color: #fff200;
    color: #000;
}

#panels .panel-red .panel-heading {
    border-color: #000;
    background-color: #000;
    color: #fff;
}

.panel-green .panel-heading {
    border-color: #32b73b;
    background-color: #32b73b;
}

.panel-yellow .panel-heading {
    border-color: #f5a623;
    background-color: #f5a623;
}

.panel-blue .panel-heading {
    border-color: #00a4a9;
    background-color: #00a4a9;
    color: #fff;
}

.panel {
    border-radius: 8px;
    margin-bottom: 30px;
}

.panel .panel-heading {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    text-transform: uppercase;
    font-weight: 700;
    padding: 10px 20px;

}

.panel .panel-heading i {
    line-height: 77px;
}

.panel-body {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.panel {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

.panel .btn {
    color: #000;
}

.navbar-default .navbar-collapse {
    border: 0;
}

.sidebar {
    width: 100%;
    margin: 0;
    border: 0;
    background: transparent;
    position: relative;
}

.sidebar ul li {
    background: transparent;
    border-bottom: 1px solid #e8e6f4;
}

.sidebar ul li a {
    background: transparent;
    color: #4a4a4a;
    text-transform: uppercase;
    font-weight: 400;
    font-size: 15px;
}

.sidebar ul li a i:first-of-type {
    margin-right: 10px;
}

.sidebar ul li a.active,
.sidebar ul li a:hover {
    background: #fff200;
    color: #000;
}

.sidebar .nav-second-level li {
    border: 0;
}

.sidebar .nav-second-level li a {
    padding-left: 45px;
}

.sidebar .nav-third-level li a {
    padding-left: 65px;
}

.sidebar .nav-fourth-level li a {
    padding-left: 80px;
}

.goBack {
    font-size: 30px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 10px;
    line-height: 50px;
    color: #fff;
}

div.dataTables_wrapper div.dataTables_paginate {
    margin: 20px 0 !important;
}

table.dividerhr {
    display: none;
}

.table > thead > tr > td.info, .table > tbody > tr > td.info, .table > tfoot > tr > td.info, .table > thead > tr > th.info, .table > tbody > tr > th.info, .table > tfoot > tr > th.info, .table > thead > tr.info > td, .table > tbody > tr.info > td, .table > tbody > tr.info:hover > td, .table > tfoot > tr.info > td, .table > thead > tr.info > th, .table > tbody > tr.info > th, .table > tfoot > tr.info > th {
    background: #fff200;
    color: #000;
}

.table {
    font-size: 13px;
}

.ckeditor-html5-video video {
    max-width: 100%;
    height: auto;
}

@media (max-width: 1400px) {
    #sidebar,
    #appContent,
    #userBar {
        padding: 0 30px;
    }

    .login #sidebar::after {
        left: 30px;
        width: calc(100% - 30px);
    }

    .messages .dropdown-menu {
        min-width: 450px;
    }
}

@media (max-width: 1100px) {
    #panels .panel-wrapper {
        width: 100%;
    }
}

@media (max-width: 767px) {
    #sidebar {
        min-height: unset;
        padding: 15px;
        margin-bottom: 15px;
    }

    #sidebar::after {
        display: none;

    }

    #appLogo {
        margin: 0;
    }

    .login #appHeader {
        margin-top: 0;
    }

    #appContent,
    #userBar {
        padding: 0 15px;
    }

}

@media (max-width: 576px) {
    #panels .panel-wrapper {
        width: 100%;
    }

    #userBar > ul {
        text-align: left;
    }
}

.nav-tabs {
    border: 0;
    margin: 0 0 5px;
}

.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    color: #fff;
    border: 0;
    background: #fff200;
}

.nav-tabs > li > a {
    border-radius: 0;
    border: 0;
    pointer-events: none;
}

.nav-tabs > li > a:hover {
    border: 0;
}

.course-finished {
    color: green;
}

.course-in-progress {
    color: orange;
}

.course-not-started {
    color: red;
}

.status-true {
    color: green;
}

.status-false {
    color: red;
}

.panel-body h3.course-name {
    font-weight: 700;
    color: #000;
    text-transform: uppercase;
    margin: 10px 0 20px;
}

.panel-body .course ~ .course {
    margin: 30px 0 20px;
}

.department-link,
.panel-red a.department-link {
    color: #fff;
}

.panel-red a.department-link:hover {
    text-decoration: underline;
}

.department-user {
    margin: 0 0 20px;
}

#department-select {
    margin: 0 0 50px;
}

.form-group .answer-info {
    width: auto !important;
    white-space: inherit;
    text-align: left;
    display: block;
    line-height: normal;
    padding: 3px;
}

.exam-stat-answer:nth-of-type(2n) {
    clear: left;
}

.footer {
    width: 100%;
    clear: both;
    padding-top: 30px;
}

.footer .container-fluid {
    border-top: 1px solid #ccc;
    padding-top: 15px;
    padding-bottom: 15px;
}

.footer a {
    color: #aaa;
}

.footer a:hover {
    color: inherit;
}

.privacy-pol ol {
    list-style-type: none;
    counter-reset: item;
    margin: 0;
    padding: 0;
}

.privacy-pol ol > li {
    display: table;
    counter-increment: item;
    margin-bottom: 10px;
}

.privacy-pol ol > li ol {
    margin-top: 0.6em;
}

.privacy-pol ol > li:before {
    content: counters(item, ".") ". ";
    display: table-cell;
    padding-right: 10px;
}

.privacy-pol ol.top > li:before {
    font-weight: 700;
}

.privacy-pol li ol > li:before {
    content: counters(item, ".") ". ";
}

.privacy-pol ol li a {
    text-decoration: underline;
    color: inherit;
}

.marg-bott {
    margin-bottom: 10px;
    display: block;
}

.find-firm__wrapper {
    margin: 0 0 20px;
}

.find-firm__wrapper label {
    margin-right: 10px;
}

.show-answers {
    cursor: pointer;
}

.sidebar ul li a.menu-exam.active {
    background-color: transparent;
}

.sidebar ul li a.menu-exam.active:hover,
.sidebar ul li a.menu-exam:hover {
    background-color: #fff200;
}

.activity-button {
    background: transparent;
    border: 0;
    padding: 0;
}

#dataTableBuilder.table td:last-of-type {
    white-space: nowrap;
}

.table-inline-submit {
    padding: 0;
    display: inline-block;
    border: 0;
    background: transparent;
}

.inline-form {
    display: inline-block;
}

.modal-body {
    overflow-x: auto;
}

.modal-header {
    display: flex;
    justify-content: space-between;
}

.modal-header::after,
.modal-header::before {
    display: none;
}

@media (min-width: 992px) {
    .modal-lg {
        width: 80vw;
    }
}

.red,
table i.red {
    color: #f00;
}