html,
body {
    height: 100%;
}

.wrap {
    min-height: 100%;
    height: auto;
    margin: 0 auto -60px;
    padding: 0 0 60px;
}

.wrap > .container {
    padding: 70px 15px 20px;
}

.footer {
    height: 60px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    padding-top: 20px;
}

.jumbotron {
    text-align: center;
    background-color: transparent;
}

.jumbotron .btn {
    font-size: 21px;
    padding: 14px 24px;
}

.not-set {
    color: #c55;
    font-style: italic;
}

/* add sorting icons to gridview sort links */
a.asc:after, a.desc:after {
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    padding-left: 5px;
}

a.asc:after {
    content: /*"\e113"*/ "\e151";
}

a.desc:after {
    content: /*"\e114"*/ "\e152";
}

.sort-numerical a.asc:after {
    content: "\e153";
}

.sort-numerical a.desc:after {
    content: "\e154";
}

.sort-ordinal a.asc:after {
    content: "\e155";
}

.sort-ordinal a.desc:after {
    content: "\e156";
}

.grid-view th {
    white-space: nowrap;
}

.hint-block {
    display: block;
    margin-top: 5px;
    color: #999;
}

.error-summary {
    color: #a94442;
    background: #fdf7f7;
    border-left: 3px solid #eed3d7;
    padding: 10px 20px;
    margin: 0 0 15px 0;
}

.login-change-bg, .login-change-bg:hover, .login-change-bg:active, .login-change-bg:visited {
    color: #fff !important;
}

#login-bg {
    width: 100%;
    height: 100%;
    z-index: 1;
    position: fixed;
    top: 0;
    left: 0;
    opacity: 1;
    background-size: cover;
}

#login-bg-light {
    width: 100%;
    height: 100%;
    z-index: 1;
    top: 0;
    left: 0;
    opacity: 1;
    background-size: cover;
}

#login-page.us {
    background-image: url(/images/bg/bg1.jpg);
    background-size: cover;
    opacity: 1;
}

.skin-red #login-bg {
    background-color: #000;
    opacity: 0.3;
}

.skin-red #login-bg-color {
    background-color: #fff;
}

table.dataTable tbody tr td {
    vertical-align: middle;
}

.skin-red div.box {
    border-top-color: #dd4b39;
}

.btn, .alert, .panel {
    border-radius: 0px !important;
    -moz-border-radius: 0px !important;
    -webkit-border-radius: 0px !important;
    border-radius: 0px !important;
}

.skin-red li.active a {
    border-left-color: #dd4b39;
}

.sidebar-menu > li > div {
    display: block;
    padding: 12px 5px 12px 15px;
    border-left: solid 3px transparent;
    color: #78878e;
}

.sidebar-menu > li > div > .fa, .sidebar-menu > li > div > .glyphicon, .sidebar-menu > li > div > .ion {
    width: 20px;
}

.sidebar-menu > li.current-element > a {
    margin-right: 0 !important;
    padding-right: 1px;
}

.skin-red .sidebar-menu > li.current-element > a {
    background-color: #dd4b39;
    color: #fff !important;
}

.nav-tabs > li > a {
    border-radius: 0 !important;
}

ul.nav.nav-tabs li.active a {
    border-left-color: #ddd !important;
}

.tab-content {
    border-left: solid 1px #ddd;
    border-bottom: solid 1px #ddd;
    border-right: solid 1px #ddd;
    padding: 3px;
}

.skin-red .nav-stacked > li.active > a, .skin-red .nav-stacked > li.active > a:hover {
    border-left-color: #dd4b39;
}

table.dataTable thead .sorting::after {
    font-family: "FontAwesome";
    content: "\f0dc";
}

table.dataTable thead .sorting_desc::after {
    content: "\f0d7" !important;
}

table.dataTable thead .sorting_asc::after {
    content: "\f0d8" !important;
}

.apla {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
}

.wrapper, .main-sidebar, .left-side {
    background-color: rgba(34, 45, 50, 0.9) !important;
}

.select2-container--krajee .select2-selection {
    border-radius: 0;
}

.dropdown-menu, .cbx {
    border-radius: 0;
}

.popover-medium {
    max-width: 600px;
}

.skin-red .btn-theme {
    background-color: #d73925;
    border-color: #c72915;
    color: #fff;
}

.skin-red .btn-theme.hover, .skin-red .btn-theme:hover, .skin-red .btn-theme:active {
    background-color: #dd4b39;
    border-color: #cd3b29;
}

div.info-box {
    border-radius: 3px;
    border: 0;
}

div.info-box div.info-box-content div.info-box-header {
    font-size: 16px;
}

div.info-box div.info-box-content div.info-box-desc {
    font-size: 12px;
}

.info-box-enter {
    position: absolute;
    right: 19px;
    bottom: 16px;
    font-size: 16px;
}

/*.skin-red div.info-box span.info-box-icon {
    background-color: #d73925;
}*/

.skin-red div.info-box {
    background-color: #dd4b39;
    color: #fff;
}

.visible-black {
    display: none;
}

.hide-black {
    display: inline-block;
}

.skin-red .nav-tabs > li > a {
    color: #333;
    border-radius: 0;
    border-right-color: transparent !important;
    border-left-color: transparent !important;
    border-top-color: transparent !important;
}

.skin-red .nav-tabs > li.active > a, .skin-red .nav-tabs > li.active > a:hover, .skin-red .nav-tabs > li.active > a:active, .skin-red .nav-tabs > li.active > a:visited {
    background-color: #d73925;
    color: #fff;

}

.tabs-above.tab-bordered .tab-content {
    border-radius: 0;
}

.nav-tabs > li > a.error {
    box-shadow: 0 0 16px 0 #dd4b39;
}

#popup .modal-header, #survey-monkey .modal-header, #popup .modal-header, #survey-monkey-reservations .modal-header {
    display: none;
}

#popup .modal-content, #survey-monkey .modal-content, #survey-monkey-reservations .modal-content {
    background-color: transparent;
    box-shadow: none;
}

.alert.alert-default {
    border-color: #ccc;
}

.navbar-nav > .user-menu > .dropdown-menu > li.user-header {
    height: 139px;
}

blockquote {
    font-size: 14px;
}

#language-picker > li > a {
    color: #777;
}

.blink {
    animation: blinker 2s linear infinite;
}

@keyframes blinker {
    0% {
        opacity: 1;
    }
    49% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

.nav-messages, .side-menu-messages {
    display: none;
}

/*************************************************************************************/

#login-page {
    background-position: center;
    background-position: top;
    padding: 0px;
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 0;
}

.skin-red #login-page {
    background-image: url(/images/bg/bg2.jpg);
}

.skin-purple #login-page {
    background-image: url('/images/bg/purple.jpg');
}

.skin-blue #login-page {
    background-image: url('/images/bg/blue.jpg');
}

.skin-green #login-page {
    background-image: url('/images/bg/green.jpg');
}

.skin-yellow #login-page {
    background-image: url('/images/bg/yellow.jpg');
}

.skin-black #login-page {
    background-image: url('/images/bg/black.jpg');
    opacity: 1;
}

.skin-yellow section.content-header h1,
.skin-purple section.content-header h1,
.skin-black section.content-header h1 {
    color: #ccc;
}

.skin-yellow section.content-header ul.breadcrumb li a,
.skin-purple section.content-header ul.breadcrumb li a,
.skin-black section.content-header ul.breadcrumb li a {
    color: #aaa;
}

.skin-black section.content-header ul.breadcrumb li.active,
.skin-purple section.content-header ul.breadcrumb li.active,
.skin-yellow section.content-header ul.breadcrumb li.active {
    color: #999;
}

.skin-black section.content-header .breadcrumb > li + li::before,
.skin-purple section.content-header .breadcrumb > li + li::before,
.skin-yellow section.content-header .breadcrumb > li + li::before {
    color: #ccc;
}

.skin-blue section.content-header h1,
.skin-green section.content-header h1 {
    color: #333;
}

.skin-blue section.content-header ul.breadcrumb li a,
.skin-green section.content-header ul.breadcrumb li a {
    color: #444;
}

.skin-blue section.content-header ul.breadcrumb li.active,
.skin-green section.content-header ul.breadcrumb li.active {
    color: #555;
}

.skin-blue section.content-header .breadcrumb > li + li::before,
.skin-green section.content-header .breadcrumb > li + li::before {
    color: #666;
}

.skin-blue div.box {
    border-top-color: #3c8dbc;
}

.skin-green div.box {
    border-top-color: #00a65a;
}

.skin-yellow div.box {
    border-top-color: #f39c12;
}

.skin-purple div.box {
    border-top-color: #605ca8;
}

.skin-black div.box {
    border-top-color: #d2d6de;
}

.skin-blue li.active a {
    border-left-color: #3c8dbc;
}

.skin-green li.active a {
    border-left-color: #00a65a;
}

.skin-yellow li.active a {
    border-left-color: #f39c12;
}

.skin-purple li.active a {
    border-left-color: #605ca8;
}

.skin-black li.active a {
    border-left-color: #d2d6de;
}

.skin-black .sidebar-menu > li > div {
    color: #aaa !important;
}

.skin-blue .sidebar-menu > li.current-element > a {
    background-color: #3c8dbc !important;
    color: #fff !important;
}

.skin-green .sidebar-menu > li.current-element > a {
    background-color: #00a65a;
    color: #fff !important;
}

.skin-yellow .sidebar-menu > li.current-element > a {
    background-color: #f39c12;
    color: #fff !important;
}

.skin-purple .sidebar-menu > li.current-element > a {
    background-color: #605ca8;
    color: #fff !important;
}

.skin-black .sidebar-menu > li.current-element > a {
    background-color: #d2d6de;
    color: #333 !important;
}

.nav-pills > li.active > a, .skin-yellow .nav-pills > li.active > a:hover, .skin-yellow .nav-pills > li.active > a:focus {
    background-color: transparent !important;
    color: inherit !important;
    font-weight: normal !important;
}

.skin-blue .nav-stacked > li.active > a, .skin-blue .nav-stacked > li.active > a:hover {
    border-left-color: #3c8dbc;
}

.skin-green .nav-stacked > li.active > a, .skin-green .nav-stacked > li.active > a:hover {
    border-left-color: #00a65a;
}

.skin-yellow .nav-stacked > li.active > a, .skin-yellow .nav-stacked > li.active > a:hover {
    border-left-color: #f39c12;
}

.skin-purple .nav-stacked > li.active > a, .skin-purple .nav-stacked > li.active > a:hover {
    border-left-color: #605ca8;
}

.skin-black .nav-stacked > li.active > a, .skin-black .nav-stacked > li.active > a:hover {
    border-left-color: #d2d6de;
}

.skin-purple .btn-theme {
    background-color: #555299;
    border-color: #605ca8;
    color: #fff;
}

.skin-purple .btn-theme.hover, .skin-purple .btn-theme:hover, .skin-purple .btn-theme:active {
    background-color: #6562a9;
    border-color: #555299;
}

.skin-blue .btn-theme {
    background-color: #367fa9;
    border-color: #266f99;
    color: #fff;
}

.skin-blue .btn-theme.hover, .skin-blue .btn-theme:hover, .skin-blue .btn-theme:active {
    background-color: #3c8dbc;
    border-color: #367fa9;
}

.skin-yellow .btn-theme {
    background-color: #f39c12;
    border-color: #c06e00;
    color: #fff;
}

.skin-yellow .btn-theme.hover, .skin-yellow .btn-theme:hover, .skin-yellow .btn-theme:active {
    background-color: #ffac22;
    border-color: #c37c02;
}

.skin-green .btn-theme {
    background-color: #008d4c;
    border-color: #007d3c;
    color: #fff;
}

.skin-green .btn-theme.hover, .skin-green .btn-theme:hover, .skin-green .btn-theme:active {
    background-color: #00a65a;
    border-color: #00964a;
}

.skin-black .btn-theme {
    background-color: #fff;
    border-color: #ddd;
    color: #333;
}

.skin-black .btn-theme.hover, .skin-black .btn-theme:hover, .skin-black .btn-theme:active {
    background-color: #fff;
    border-color: #ddd;
    color: #999;
}

.skin-yellow div.info-box span.info-box-icon {
    background-color: #e08e0b;
}

.skin-yellow div.info-box {
    background-color: #f39c12;
    color: #fff;

}

.skin-blue div.info-box span.info-box-icon {
    background-color: #367fa9;
}

.skin-blue div.info-box {
    background-color: #3c8dbc;
    color: #fff;
}

.skin-purple div.info-box span.info-box-icon {
    background-color: #555299;
}

.skin-purple div.info-box {
    background-color: #605ca8;
    color: #fff;
}

.skin-green div.info-box span.info-box-icon {
    background-color: #008d4c;
}

.skin-green div.info-box {
    background-color: #00a65a;
    color: #fff;
}

.skin-black div.info-box span.info-box-icon {
    background-color: #333;
    color: #fff;
}

.skin-black div.info-box {
    background-color: #ccc;
    color: #333;
}

.skin-blue .main-header a img {
    fill: #ff0000;
}

.skin-black .visible-black {
    display: inline-block;
}

.hide-black {
    display: inline-block;
}

.skin-black .hide-black {
    display: none;
}

.skin-yellow .nav-tabs > li > a, .skin-black .nav-tabs > li > a, .skin-blue .nav-tabs > li > a, .skin-green .nav-tabs > li > a, .skin-purple .nav-tabs > li > a {
    color: #333;
    border-radius: 0;
    border-right-color: transparent !important;
    border-left-color: transparent !important;
    border-top-color: transparent !important;
}


.skin-black .nav-tabs > li.active > a, .skin-black .nav-tabs > li.active > a:hover, .skin-black .nav-tabs > li.active > a:active, .skin-black .nav-tabs > li.active > a:visited {
    background-color: #333;
    color: #fff;
}

.skin-blue .nav-tabs > li.active > a, .skin-blue .nav-tabs > li.active > a:hover, .skin-blue .nav-tabs > li.active > a:active, .skin-blue .nav-tabs > li.active > a:visited {
    background-color: #3c8dbc;
    color: #fff;
}

.skin-green .nav-tabs > li.active > a, .skin-green .nav-tabs > li.active > a:hover, .skin-green .nav-tabs > li.active > a:active, .skin-green .nav-tabs > li.active > a:visited {
    background-color: #00a65a;
    color: #fff;
}

.skin-purple .nav-tabs > li.active > a, .skin-purple .nav-tabs > li.active > a:hover, .skin-purple .nav-tabs > li.active > a:active, .skin-purple .nav-tabs > li.active > a:visited {
    background-color: #605ca8;
    color: #fff;
}

.skin-yellow .nav-tabs > li.active > a, .skin-yellow .nav-tabs > li.active > a:hover, .skin-yellow .nav-tabs > li.active > a:active, .skin-yellow .nav-tabs > li.active > a:visited {
    background-color: #f39c12;
    color: #fff;
    border-radius: 0;
}

.skin-purple .main-header .navbar .dropdown-menu li a, .skin-yellow .main-header .navbar .dropdown-menu li a, .skin-blue .main-header .navbar .dropdown-menu li a, .skin-red .main-header .navbar .dropdown-menu li a, .skin-green .main-header .navbar .dropdown-menu li a {
    color: inherit;
}

.fc-time-grid-event {
    cursor: pointer;
}

@media screen and (max-width: 767px) {
    .fc-all-button {
        margin-left: -0.75em !important;
    }

    .fc-all-button, .fc-ws-button, .fc-ca-button, .fc-cc-button {
        margin-top: 5px !important;
        margin-bottom: 5px !important;
    }

}

.progress-bar-theme {
    background-color: #dd4b39;
}

.skin-black .progress-bar-theme {
    background-color: #333;
}

.skin-blue .progress-bar-theme {
    background-color: #3c8dbc;
}

.skin-yellow .progress-bar-theme {
    background-color: #f39c12;
}

.skin-green .progress-bar-theme {
    background-color: #00a65a;
}

.skin-purple .progress-bar-theme {
    background-color: #605ca8;
}

.color-theme {
    color: #dd4b39;
}

.skin-black .color-theme {
    color: #333;
}

.skin-blue .color-theme {
    color: #3c8dbc;
}

.skin-yellow .color-theme {
    color: #f39c12;
}

.skin-green .color-theme {
    color: #00a65a;
}

.skin-purple .color-theme {
    color: #605ca8;
}


div.didactic-box {
    border: solid 1px pink;
    display: inline-block;
    height: 20px;
    margin-right: 2px;
    margin-left: 2px;
}

@media screen and (max-width: 767px) {
    div.didactic-box {
        width: 8px;
        margin-right: 1px;
        margin-left: 1px;
    }
}

@media (min-width: 768px) {
    div.didactic-box {
        width: 14px;
    }
}

@media (min-width: 992px) {
    div.didactic-box {
        width: 20px;
    }
}

@media (min-width: 1200px) {
    div.didactic-box {
        width: 20px;
    }
}

.didactic-box, .progress-bar2 .dot, .skin-red .progress-bar2 .bar {
    border: solid 1px #dd4b39;
}

.skin-black .didactic-box, .skin-black .progress-bar2 .dot, .skin-black .progress-bar2 .bar {
    border: solid 1px #333;
}

.skin-blue .didactic-box, .skin-blue .progress-bar2 .dot, .skin-blue .progress-bar2 .bar {
    border: solid 1px #3c8dbc;
}

.skin-yellow .didactic-box, .skin-yellow .progress-bar2 .dot, .skin-yellow .progress-bar2 .bar {
    border: solid 1px #f39c12;
}

.skin-green .didactic-box, .skin-green .progress-bar2 .dot, .skin-green .progress-bar2 .bar {
    border: solid 1px #00a65a;
}

.skin-purple .didactic-box, .skin-purple .progress-bar2 .dot, .skin-purple .progress-bar2 .bar {
    border: solid 1px #605ca8;
}

.didactic-box.active, .progress-bar2 .active {
    background-color: #dd4b39;
}

.skin-black .didactic-box.active, .skin-black .progress-bar2 .active {
    background-color: #333;
}

.skin-blue .didactic-box.active, .skin-blue .progress-bar2 .active {
    background-color: #3c8dbc;
}

.skin-yellow .didactic-box.active, .skin-yellow .progress-bar2 .active {
    background-color: #f39c12;
}

.skin-green .didactic-box.active, .skin-green .progress-bar2 .active {
    background-color: #00a65a;
}

.skin-purple .didactic-box.active, .skin-purple .progress-bar2 .active {
    background-color: #605ca8;
}


div.didactic-box-text {
    display: inline-block;
    width: 30px;
}


/* The progress bar */
.progress-bar2 {
    width: 100%;
    height: 14px;
    display: flex;
    margin: 0;
    align-items: center;
    /* Color */
}

.progress-bar2 .dot {
    max-width: 20px;
    height: 20px;
    flex-grow: 1;
    border-radius: 50%;
    overflow: hidden;

}

.progress-bar2 .bar {

    flex-grow: 1;
    height: 4px;
    border-top: solid 1px;
    border-bottom: solid 1px;
    border-left: 0 !important;
    border-right: 0 !important;
}

/* Give some paddings */
.progress-bar2 {
    box-sizing: border-box;
}

.progress-bar2 .dot.text {
    text-align: center;
    border: 0;
    background: none;
}

.progress-bar2 .bar.text {
    background: none;
    border: 0;
}

.progress-bar2.text {
    margin-bottom: 5px;
}

.select2-container .select2-selection--single .select2-selection__rendered {
    margin-top: 0;
}

.popover {
    max-width: 100%;
}

#userform-plain_access > label {
    margin-right: 20px;
}

#faqcategorynameform-plain_course_code > label {
    margin-right: 20px;
}

.special-title:hover {
    cursor: pointer;
}

td.order:hover {
    cursor: pointer;
}

table.detail-view th {
    width: 20%;
}


table.detail-view td {
    width: 80%;
}

.blob.red {
   /* background: rgba(255, 82, 82, 1);*/
    box-shadow: 0 0 0 0 rgba(82, 255, 82, 1);
    animation: pulse-red 2s;
}

@keyframes pulse-red {
    0% {
        /*transform: scale(0.95);*/
        box-shadow: 0 0 0 0 rgba(0, 181, 26, 0.7);
    }

    70% {
        /*transform: scale(1);*/
        box-shadow: 0 0 0 10px rgba(255, 82, 82, 0);
    }

    100% {
       /* transform: scale(0.95);*/
        box-shadow: 0 0 0 0 rgba(255, 82, 82, 0);
    }
}

.uppercase{
    text-transform: uppercase;
}