@font-face {
    font-family: 'kruti-10';
    src: url('../fonts/k010-webfont.eot');
    src: url('../fonts/k010-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/k010-webfont.woff') format('woff'),
         url('../fonts/k010-webfont.ttf') format('truetype'),
         url('../fonts/k010-webfont.svg#kruti_dev_010regular') format('svg');
    font-weight: normal;
    font-style: normal;
}
.kruti-dev-10 p , .kruti-dev-10 div,.kruti-dev-10{
    font-family: kruti-10,symbol !important;
    font-size: 18px;
}
html{
    min-height: 100%;
    position: relative;
}
body {
    background: #ebeff2;
    height: auto;
    min-height: 100%;
}

body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
span,
li,
div,
td,
th,
small,
label,
button,
input,
select {
    font-family: 'Open Sans', sans-serif, symbol;
}

header {
    position: fixed;
    width: 100%;
    top: 0px;
    background: #72ede0;
    height: 50px;
    /* box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .2); */
    z-index: 100;
}

.wrapper {
    display: flex;
    width: 100%;
    height: 100%;
    padding-top: 75px;
}

.sidebar-wrapper {
    float: left;
    width: 250px;
    background: white;
    z-index: 1;
    /*min-height: 400px;*/
}

faculty-sidebar {
    position: fixed;
    height: 100%;
    top: 0px;
}
student-panel-footer{
    position: absolute;
    bottom: 0px;
    z-index: 0;
    background: #d9dada96;
    width: 100%;
    border-top: solid 1px #d8d8d8;
    padding: 2px 15px;
    text-align: right;
}

header .ek-logo-sec {
    display: inline-block;
    padding: 8px;
    font-size: 25px;
    font-family: sans-serif;
    font-weight: bold;
    /* color: #00796B; */
    /* width: calc(25%); */
    /* border-right: solid 1px #cdd1d3; */
    line-height: 30px;
    padding-left: 0px;
    margin-left: -15px;
}

header .ek-logo-sec .sbnm {
    font-weight: normal;
    font-size: 24px;
    color: #14202b
}

header .ek-logo-sec img {
    max-width: 100%;
    max-height: 32px;
}

header .app-sec {
    display: inline-block;
    padding: 11px;
    font-size: 20px;
    margin-left: 20px;
}
.header .drop-menu{
    position: absolute;
    font-size: 20px;
    width: calc(25% - 2px);
    left: -5px;
    z-index: 2;
}
.header .drop-menu>span{
    position: absolute;
    top: -40px;
    right: -25px;
}

.header .drop-menu ul{
    padding: 0px;
    list-style: none;
    font-size: 15px;
    background: #69d8ce;
    
    height: 100vh;
    padding-top: 20px;

}
.header .drop-menu ul li{
    border-bottom: solid 1px #31ccbe;
    margin-bottom: 10px;
    padding-bottom: 5px;
}
.header .drop-menu ul li a{
    padding: 5px 15px;
    display: inline-block;
    width: 100%;
}
.header .drop-menu ul li a>i{
    margin-right: 5px;
}
.header .drop-menu-layer{
    position: fixed;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    background: #80808030;
    z-index: 1;
}
.hdr-noticeboard-link{
    position: relative;
}
.hdr-noticeboard{
    position: absolute !important;
    right: -15px;
    background: white;
    top: 50px;
    width: 340px;
    border: solid 1px #ced1d5;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    height: 420px;
    box-shadow: 1px 4px 2px 0px #ced1d5;
}


@media (min-width: 1200px){
    .container {
        width: 1024px !important;
    }
}

@media (max-width: 767px) {
    header .app-sec {
        padding-left: 64px;
    }

   
}

header .right-sec {
    float: right;
    position: relative;
}

header .right-sec ul {
    margin: 0px;
}

header .right-sec ul li {
    list-style: none;
    margin-left: 5px;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    /* line-height: 50px; */
    margin-right: 5px;
    padding: 15px 0px;
}

header .right-sec ul li a {
    padding: 5px 10px;
    text-decoration: none;
    color: #3a3a3a;
}

header .right-sec ul li a:hover {
    background: #59d8cb;
}

header .right-sec>ul>li.user-opts>a {
    cursor: pointer;
    font-size: 30px;
}

header .right-sec>ul>li.last {
    margin-right: 5em;
    margin-left: 1em;
}

header .right-sec>ul>li.user-opts {
    width: 54px;
    text-align: center;
    /* background: #fbfbfb; */
    /* height: 30px; */
    position: absolute;
    right: 0px;
    top: 0px;
    height: 50px;
}

header .right-sec>ul>li.user-opts .ui-menu {
    background: white;
    box-shadow: rgb(214, 214, 214) 1px 1px 1px 0px;
}

header .right-sec>ul>li.user-opts:hover .h-dropdown {
    display: block;
}

.h-dropdown {
    display: none;
    position: absolute;
    right: -15px;
    background: #a6f1e9;
    /* padding: 15px 0px; */
    z-index: 10000;
    width: 160px;
    top: 50px;
    box-shadow: 2px 4px 5px 0px #17af9f87;
    /* 2px 3px 1px 1px #DEDEDD; */
}

.h-dropdown .dropdown-items {
    padding: 0px;
    margin: 0px;
}

.h-dropdown .dropdown-items li {
    display: inline-block;
    list-style: none;
    width: 100%;
    padding: 5px 5px 5px 15px;
    margin: 0px;
    text-align: left
}

.h-dropdown .dropdown-items li:hover {
    background: #dedede;
}

.sidebar {
    height: 100%;
    width: 250px;
    /* background: #ebeff2; */
    background: #ffffff;
    position: fixed;
    margin-top: 0px;
    /* overflow-y: auto; */
    /* padding-bottom: 90px; */
}

.sidebar .ek-sb-logo-sec {
    margin-top: -50px;
    padding: 8px 8px 8px 15px;
    background: #ffffff;
}

.sidebar .ek-sb-logo-sec a {
    line-height: 30px;
    display: inline-block;
}

.sidebar .ek-sb-logo-sec img {
    width: 174px;
    max-width: 174px;
    max-height: 32px;
}

.sidebar-toggle {
    position: relative;
    top: 0px;
    z-index: 101;
    font-size: 24px;
    padding: 8px 15px 9px;
    color: #444444;
    left: 250px;
    background: white;
    box-shadow: inset -1px 0px 0px 1px #e4e8eb;
}

.sidebar.OPENED .sidebar-toggle .glyphicon-menu-hamburger {
    display: none;
}

.sidebar.CLOSED .sidebar-toggle .glyphicon-remove {
    display: none;
}

.sidebar .org-logo-sec {
    text-align: center;
    padding-top: 10px;
}

.sidebar .org-logo-sec a {
    width: 100%;
    display: inline-block;
    min-height: 60px;
    max-height: 100px;
    overflow: hidden;
    /* vertical-align: text-top; */
    /*background: rgba(244, 67, 54, 0.21);*/
    padding: 5px;
}

.sidebar .org-logo-sec a img {
    width: 200px;
}

.sidebar .menu-heading h4 {
    font-size: 14px;
    color: #949494;
    padding-left: 15px;
    border-bottom: solid 1px #96949494;
    padding-bottom: 6px;
    margin-top: 20px;
}

.sidebar-menu {
    padding: 0px;
}

.sidebar-menu li {
    list-style: none;
    position: relative;
}

.sidebar-menu li a {
    display: inline-block;
    width: 100%;
    padding: 12px 16px;
    font-size: 14px;
    font-weight: 400;
    color: rgba(41, 41, 41, 0.87);
    line-height: 12px;
}

.sidebar-menu li:hover a {
    text-decoration: none;
    background: #e2e2e2;
}

.sidebar-menu li.active a {
    text-decoration: none;
    background: #dedede;
}

.sidebar-menu li a .link-icon {
    font-size: 15px;
    display: inline-block;
    margin-right: 15px;
}

.sidebar-menu li .icon-menu-action {
    position: absolute;
    right: 15px;
    top: 12px;
    font-size: 16px;
    color: grey;
}

.ek-tooltip {
    position: absolute;
    width: 100px;
    font-size: 12px;
    background: #424242;
    padding: 3px 5px;
    color: white;
    margin-left: 5px;
    border-radius: 2px;
    display: none;
}

.sidebar-menu li .icon-menu-action:hover {
    color: black;
}

.sidebar-menu li .icon-menu-action:hover .ek-tooltip {
    display: inline-block;
}

.activity-navbar {
    padding: 0px 0px 0px 0px;
    border-bottom: solid 1px #dedede;
    margin-bottom: 20px;
}

.activity-navbar ul {
    margin: 0px;
    padding: 0px;
}

.activity-navbar li {
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 2px;
}

.activity-navbar li a {
    text-decoration: none;
    padding: 5px 10px;
    display: inline-block;
}

.activity-navbar li a:hover {
    color: rgb(56, 146, 216);
}

.activity-navbar li a.active {
    box-shadow: 0px 3px 0px 0px #2196F3;
    color: rgb(56, 146, 216);
}

.activity-navbar li.link-action {
    float: right;
}

.activity-navbar li.link-action a {
    background: #8BC34A;
    color: white;
}

.post-card {
    background: white;
    box-shadow: 1px 1px 1px 1px #ececec;
    border-radius: 3px;
    padding: 15px;
    margin-bottom: 15px;
    border-top: solid transparent;
}

.post-card:hover {
    box-shadow: 1px 1px 1px 1px rgb(222, 222, 222);
    border-top: solid rgb(222, 222, 222);
}

.ForumQuestion .title {
    margin: 0px;
    margin: 0px 0px 15px 0px;
}

.ForumQuestion .title a {
    color: #4e4e4e;
    text-decoration: none;
}

.post-card .post-info,
.ForumQuestion .post-info,
.comment-feeds .post-info {
    margin-right: 5px;
    margin-left: 15px;
    font-size: 12px;
    color: #abafb1;
}

.panel.ForumQuestion {
    box-shadow: 0 5px 4px rgba(10, 10, 10, 0.18);
}

.comment-feeds {
    background: #ffffff;
    padding: 50px 15px 15px 15px;
    margin-top: -21px;
}

.comment-feeds .comment-add-box {
    padding: 15px;
    margin-left: -15px;
    margin-right: -15px;
    margin-bottom: -15px;
    background: #dadfe2;
}

.comment-box {
    display: flex;
    padding-bottom: 10px;
    box-shadow: 0px 3px 0px 0px #e0e0e0;
    margin-bottom: 30px;
}

.comment-box .user-img {
    width: 60px;
}

.comment-box .user-img img {
    min-width: 44px;
    min-height: 44px;
    background: #ececec;
    font-size: 10px;
    text-align: center;
    overflow: hidden;
    max-width: 44px;
    max-height: 44px;
}

.comment-box .user-cmnt {
    flex-basis: 100%;
}

.comment-add-box .form-group {
    overflow: hidden
}

@media (max-width: 767px) {
    .sidebar-wrapper {
        z-index: 102;
        width: 0px;
    }
    .sidebar-wrapper .sidebar {
        margin-top: 0px;
        transition: left 0.1s linear;
        /*-webkit-transition-delay: 0.1s;*/
        /* Safari */
        /*transition-delay: 0.1s;*/
        left: -250px;
        -webkit-transition: left 0.5s;
        /* Safari */
        transition: left 0.5s;
        top: 0px
    }
    .sidebar-wrapper .sidebar.CLOSED {
        left: -250px !important;
    }
    .sidebar-wrapper .sidebar.OPENED {
        left: 0px !important;
    }
    faculty-mainbody .main-content-wrapper {
        width: 100%;
    }
    faculty-mainbody .activity-heading {
        font-size: 20px;
    }
    faculty-mainbody .activity-breadcrumb li {
        font-size: 12px;
    }
    .wrapper .main-content-wrapper {
        width: 100%;
    }
}

.link-text {
    display: inline-block;
    padding: 1px;
    font-size: 14px;
    position: relative;
    vertical-align: bottom;
}

.main-content-wrapper {
    float: left;
    width: 100%;
    /* padding-left: 15px; */
    /* padding-right: 25px; */
}

.ek-datatable datatable-header {
    height: 50px;
    width: 100%;
    background: gainsboro;
    /*border: solid 2px #e4e3e3;*/
}

.ek-datatable datatable-body {
    /*border: solid 2px #e4e3e3;*/
}

.ek-datatable datatable-body-cell,
.ek-datatable datatable-header-cell {
    padding: 5px;
    border-left: solid 1px #e4e3e3;
    border-bottom: solid 1px #e4e3e3;
}

.ek-datatable .datatable-row-group datatable-body-cell:last-child,
.ek-datatable .datatable-row-group datatable-header-cell:last-child {
    border-right: solid 1px #e4e3e3;
}

.ek-datatable datatable-pager i {
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 12px;
}

.ek-datatable i.icon-right:before {
    content: "\e077";
}

.ek-datatable i.icon-left:before {
    content: "\e069";
}

.ek-datatable i.icon-prev:before {
    content: "\e070";
}

.ek-datatable i.icon-skip:before {
    content: "\e076";
}

.activity-header {
    display: block;
    margin-bottom: 5px;
    margin-top: 5px;
    width: 100%;
    border-bottom: solid 2px #e6e6e6;
}

.activity-heading {
    font-size: 27px;
    color: #757677;
    display: inline-block;
}

.activity-header-menu {
    float: right;
    margin-top: 20px;
}

.activity-header-menu ul li {
    float: left;
    list-style: none;
    margin: 2px;
    margin-left: 5px;
}

.activity-breadcrumb {
    padding-bottom: 1px;
}

.activity-breadcrumb .breadcrumb {
    padding: 0px;
    background: transparent;
}

.activity-content {
    margin-top: 15px;
}

.ek-btn {
    display: inline-block;
    padding: 5px 10px;
    background: #3F51B5;
    color: white !important;
    border-radius: 2px;
    text-decoration: none;
    cursor: pointer;
    border: none;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal;
}

.ek-btn:hover {
    color: white;
    text-decoration: none;
    background: #3F51B5;
}

.btn-create {
    background: #3F51B5;
}

.btn-create:hover {
    background: #303F9F;
}

.btn-list {
    background: #009688;
}

.btn-list:hover {
    background: #00796B;
}

.btn-view {
    background: #3F51B5;
}

.btn-edit,
.btn-add {
    background: #673AB7;
}

.ek-btn.btn-icon::before {
    font-family: 'Glyphicons Halflings';
    top: 2px;
    position: relative;
    /*margin-right: 5px;*/
    padding: 1px 2px;
}

.btn-icon.btn-add::before {
    content: "\002b";
}

.btn-edit:hover,
.btn-add:hover {
    background: #7B1FA2;
}

.btn-icon.btn-edit::before {
    content: "\e065"
}

.btn-save {
    background: #3F51B5;
}

.btn-delete {
    background: rgba(158, 48, 40, 0.97);
}

.btn-icon.btn-delete::before {
    content: "\e014"
}

.btn-delete:hover {
    background: rgba(121, 29, 23, 0.97);
}

.btn-cancel {
    background: #3F51B5;
}

.btn-back {
    background: #3F51B5;
}

.ek-loader-bar {
    background-color: #F44336;
    position: fixed;
    z-index: 1000;
    width: 100%;
    height: 2px;
}

.btn-mini {
    margin: 1px;
    padding: 4px 6px;
    font-size: 12px;
    line-height: 12px;
}

.ek-datatable .btn-mini {
    line-height: 16px;
}

.page-loader.hide {
    display: none !important;
}

.page-loader.show {
    display: block !important;
}

.activity-grp-link {
    display: block;
    width: 100%;
    min-height: 80px;
    background: white;
    padding: 5px;
    font-size: 18px;
    position: relative;
    color: grey;
    cursor: pointer;
    border-radius: 2px;
    margin-top: 5px;
    margin-bottom: 10px;
    overflow: hidden;
}

.activity-grp-link:hover {
    text-decoration: none;
    box-shadow: 1px 1px 4px 0px #9E9E9E;
}

.activity-grp-link .agl-icn {
    position: absolute;
    font-size: 60px;
    /* top: 10px; */
    opacity: 0.5;
    color: #8BC34A;
    top: 34px;
    right: -12px;
    display: inline-block;
}

.page-loader.hide {
    display: none !important;
}

.page-loader.show {
    display: block !important;
}

.page-loader .spinner {
    position: absolute;
    display: inline-block;
    top: calc(50% - 22px);
    left: calc(50% - 22px);
}

.page-loader .spinner-icon {
    width: 44px;
    height: 44px;
    box-sizing: border-box;
    border: solid 4px transparent;
    border-radius: 50%;
    -webkit-animation: eknotifier-spinner 400ms linear infinite;
    animation: eknotifier-spinner 800ms linear infinite;
}

.panel-loader {
    position: relative;
}

.panel-loader.show {
    position: relative
}

.panel-loader.show>div,
.panel-loader.show.table,
.panel-loader.show table {
    opacity: 0.7;
}

.panel-loader.Processing::after {
    content: "Processing...";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 100;
    background: rgba(255, 255, 255, 0.68);
    top: 0;
    left: 0px;
    text-align: center;
    padding-top: 10px;
    color: #2196F3;
    /* text-shadow: 2px 2px 2px #1b1b1b; */
    font-weight: bold;
}

.panel-loader.show::after {
    content: " ";
    position: absolute;
    left: 50%;
    top: 100px;
    z-index: 1;
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    border: 2px solid transparent;
    border-radius: 50%;
    border-top: 2px solid #3498db;
    width: 50px;
    height: 50px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 0.8s linear infinite;
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.panel-loader.deleted::after {
    content: "Deleted!";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 100;
    background: white;
    top: 0;
    left: 0px;
    text-align: center;
    padding-top: 10px;
    color: black;
    text-shadow: 2px 2px 2px #1b1b1b;
}


/*EK-Modal*/

.ek-modal {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 1000;
}

.ekm-content {
    width: 92%;
    max-width: 600px;
    margin: auto;
    background: white;
    box-shadow: 0px 0px 3px 1px #f1f1f1;
    z-index: 10001;
    position: relative;
    border-radius: 2px;
    top: 15%;
    display: flex;
    flex-direction: column;
}

.ekm-bg {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    right: 0px;
    z-index: 1000;
    opacity: 0.7;
    background: rgb(0, 0, 0);
}

.ekm-cancel-btn {
    position: absolute;
    right: -10px;
    font-size: 20px;
    line-height: 20px;
    background: white;
    border-radius: 25px;
    top: -10px;
    padding: 2px;
    width: 24px;
    height: 26px;
    cursor: pointer;
    color: #636363;
}

.ekm-cancel-btn:hover {
    color: black;
}

.ekm-header {
    padding: 10px;
    border-bottom: solid 1px #e2e2e2;
    margin-bottom: 10px;
}

.ekm-body {
    padding: 15px;
    margin-top: 5px;
    max-height: 80%;
    overflow-y: auto;
    border-bottom: solid 4px #e6e6e6;
    padding-bottom: 30px;
}

.ekm-footer {
    padding: 10px;
    background: rgb(230, 230, 230);
}


/*----Modal Style ends*/

.form-horizontal .ui-multiselect {
    width: 100%;
    height: 29px;
}

.panel-footer {
    background: #f4f8fb;
    border-top: 0px;
}

.panel-footer .cancel-link {
    margin-bottom: 7px;
    font-size: 12px;
}

.panel-footer .cancel-link a {
    cursor: pointer;
}

.table-day-slots tbody:nth-child(2n+1) {
    background: rgba(245, 245, 245, 0.53);
}

.period-slot {
    display: inline-block;
    position: relative;
    padding: 5px;
    cursor: default;
    margin: 5px;
}

.period-slot .btn-action {
    opacity: 0;
    position: absolute;
    font-size: 8px;
    padding: 4px 4px;
    line-height: 5px;
}

.period-slot:hover .btn-action {
    opacity: 1;
}

.period-slot .time-info {
    display: inline-block;
    font-size: 10px;
}

form .help-text-blck {
    font-size: 10px;
    padding: 5px;
    margin-top: 5px;
    margin: 0px;
    margin-top: 2px;
    margin-bottom: 5px;
    width: 100%;
    border: dashed 1px #dddddd;
    background: white;
    border-radius: 0px;
}

.ui-tabview {
    background: none;
}

.ui-tabview-panels {
    background: white;
}

.demo-cls {
    background: red;
}

.btns-right .panel-title {
    display: inline-block;
}


/*PrimeNG Theme Modigications*/

.ek-default .ui-buttonset .ui-button {
    background: #cacaca;
    border-color: #b1b1b1;
    color: black;
}

.ek-default .ui-widget-header .ui-button:enabled:hover,
.ek-default .ui-widget-header .ui-button:focus,
.ek-default .ui-widget-content .ui-button:enabled:hover,
.ek-default .ui-widget-content .ui-button:focus,
.ek-default .ui-button:enabled:hover,
.ek-default .ui-button:focus {
    border: 1px solid #616161;
    background: #757575;
}


/*----end--PrimeNG Theme Modigications*/

.empty-day {
    background-color: #ffe6e6;
    background-image: url('http://supernovathemes.com/wp-content/themes/supernovathemes/images/bg/b4.png');
}

.schedule-table-view table table {
    margin-bottom: 0px;
}

.schedule-table-view table table>tbody>tr>td {
    font-size: 12px;
}

.schedule-table-view table table>tbody>tr>td:nth-child(1),
.schedule-table-view table table>thead>tr>th:nth-child(1) {
    width: 5%;
}

.schedule-table-view table table>tbody>tr>td:nth-child(2),
.schedule-table-view table table>thead>tr>th:nth-child(2) {
    width: 30%;
}

.schedule-table-view table table>tbody>tr>td:nth-child(3),
.schedule-table-view table table>thead>tr>th:nth-child(3) {
    width: 35%;
}


/*ek-notifier-css*/

.ek-notifier {
    position: fixed;
    z-index: 9990;
    background: #3F51B5;
    height: 2px;
    /*width: 100%;*/
    transition: opacity 0.1s linear;
    /*-webkit-transition-delay: 0.1s;*/
    /* Safari */
    /*transition-delay: 0.1s;*/
    opacity: 1;
    -webkit-transition: width 0.5s;
    /* Safari */
    transition: width 0.5s;
}

.vhide {
    visibility: hidden;
}

.ek-alert {
    position: fixed;
    z-index: 9990;
    right: 10px;
    top: 120px;
}

.ek-alert .msg-box {
    background: #e2e2e2;
    padding: 10px;
    border-radius: 2px;
    color: black;
    font-size: 12px;
    box-shadow: 2px 2px 2px 2px #ffffff;
}

.ek-alert .msg-box.success {
    background: #4CAF50;
    color: white;
}

.ek-alert .msg-box.danger {
    background: #F44336;
    color: white;
}

.ek-alert .close-opt {
    display: inline-block;
    position: absolute;
    top: 0px;
    right: 0px;
    padding: 2px;
    color: #d2d2d2;
    font-size: 16px;
    cursor: pointer;
}

.spinner {
    display: block;
    position: fixed;
    z-index: 1032;
    top: 15px;
    left: 16%;
}

.ek-nav-spinner .spinner {
    z-index: 1031;
    top: 15px;
    left: 16%;
}

@keyframes eknotifier-spinner {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.spinner-icon {
    width: 18px;
    height: 18px;
    box-sizing: border-box;
    border: solid 2px transparent;
    border-radius: 50%;
    -webkit-animation: eknotifier-spinner 400ms linear infinite;
    animation: eknotifier-spinner 400ms linear infinite;
}


/*end-ek-notifier-css*/


/*<----ek-loginbox*/

.ek-loginbox {
    background: white;
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 998;
    top: 0px;
}

.ek-loginbox .lb-container {
    max-width: 580px;
    width: 92%;
    margin: auto
}


/*ek-loginbox end---->*/

.faculty-login {
    position: absolute;
    width: 100%;
    height: 100%;
}

.faculty-login .ek-loginbox {
    /* special css for faculty Login*/
    position: relative;
    display: flex;
}

.faculty-login>.row {
    height: 100%;
}

.faculty-login>.row>.col-md-5 {
    height: 100%;
}

.faculty-login .lft {
    text-align: center;
    overflow: hidden
}

@media (max-width: 767px) {
    .faculty-login .lft {
        height: 50%;
    }
    .faculty-login>.row>.col-md-5 {
        height: 50%;
    }
}

.faculty-login .lft img {
    width: 90%;
    max-width: 340px;
}

.faculty-login .lft .wlcm-text {
    margin-top: 100px;
}

.panel-title .label {
    padding: 0.3em .6em .3em;
}

.evtTEST {
    background: #9E9E9E;
    color: white;
}

.evtPENDING {
    background: #607D8B;
    color: white;
}

.evtAPPROVED {
    background: #CDDC39;
    color: white;
}

.evtCONFIRMED {
    background: #CDDC39;
    color: white;
}

.evtUNAPPROVED {
    background: #F44336;
    color: white;
}

.evtDECLINED {
    background: #F44336;
    color: white;
}

.evtCANCELED {
    background: #FF9800;
    color: white;
}

.evtRESCHEDULED {
    background: #795548;
    color: white;
}

.evtPASSED {
    background: #795548;
    color: white;
}

.evtRUNTIME {
    background: #795548;
    color: white;
}

.evtRUNNING {
    background: #795548;
    color: white;
}

.evtFINISHED {
    background: #4CAF50;
    color: white;
}

.panel {
    border: none;
    margin-bottom: 20px;
}

.panel-default>.panel-heading {
    background-color: #f4f8fb;
    border-bottom: none;
    color: #797979;
}

.panel .panel-body {
    padding: 15px 20px 20px 20px;
}

.panel .panel-body {
    padding: 20px;
}
.panel .panel-body img{
    max-width: 100%;
}

.panel.panel-primary .panel-heading {
    border-top-color: #4c5667 !important;
    color: #4c5667 !important;
}

.panel .panel-heading {
    background-color: #ffffff;
    border-top: 3px solid #DADFE2 !important;
    padding: 15px;
    margin-bottom: 15px;
    border-bottom: solid 1px #ebeff2 !important;
}

.panel .panel-heading .title {
    margin-bottom: 0px;
}
.panel .panel-title{
    font-size: 20px;
}
.tablef12 tr th {
    text-align: center
}
.table tr th {
    text-align: center
}
.table-1 tr td {
    text-align: center
}


.tablef12 tr td {
    font-size: 12px;
    text-align: center
}

td.evt-ttl-td {
    min-width: 135px;
}

.evt-ttl-td a {
    max-width: 164px;
    display: block;
    text-decoration: none;
}

.evt-ttl-td a span {
    display: block;
    text-align: center;
    padding: 2px 0px;
    width: 100%;
    border: solid 1px #607d8b;
    font-size: 12px;
    color: white;
}

.tdTEST.evt-ttl-td a span {
    background: #9E9E9E;
    border-color: #9E9E9E;
}

.tdPENDING.evt-ttl-td a span {
    background: #607D8B;
    border-color: #607D8B;
    color: white;
}

.tdAPPROVED.evt-ttl-td a span {
    background: #4CAF50;
    border-color: #4CAF50;
    color: white;
}

.tdCONFIRMED.evt-ttl-td a span {
    background: #4CAF50;
    border-color: #4CAF50;
    color: white;
}

.tdUNAPPROVED.evt-ttl-td a span {
    background: #F44336;
    border-color: #F44336;
    color: white;
}

.tdDECLINED.evt-ttl-td a span {
    background: #F44336;
    border-color: #F44336;
    color: white;
}

.tdCANCELED.evt-ttl-td a span {
    background: #FF9800;
    border-color: #FF9800;
    color: white;
}

.tdRESCHEDULED.evt-ttl-td a span {
    background: #795548;
    border-color: #795548;
    color: white;
}

.tdPASSED.evt-ttl-td a span {
    background: #795548;
    border-color: #795548;
    color: white;
}

.tdRUNTIME.evt-ttl-td a span {
    background: #795548;
    border-color: #795548;
    color: white;
}

.tdRUNNING.evt-ttl-td a span {
    background: #795548;
    border-color: #795548;
    color: white;
}

.tdFINISHED.evt-ttl-td a span {
    background: #795548;
    border-color: #795548;
    color: white;
}

.evt-ttl-td a span:nth-child(2) {
    color: #5a5a5a;
    background: transparent
}

.evt-ttl-td a span:nth-child(3) {
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    color: #5a5a5a;
    background: transparent
}

.event-item {
    display: block;
    text-decoration: none;
    color: black;
    cursor: pointer;
}

a.event-item:hover,
a.event-item:focus {
    background: rgb(239, 238, 238);
    text-decoration: none;
    color: black;
}

.event-item .evt-main {
    font-size: 14px;
    font-weight: bold;
}

.event-item .evt-sub {
    font-size: 12px;
}

.db-events {
    padding: 0px;
    margin: 0px;
    list-style: none;
}

.db-events li {
    padding-top: 5px;
    padding-bottom: 5px;
    border-bottom: solid 2px #eeeeee;
    margin-bottom: 15px;
}

.mt30 {
    margin-top: 30px;
}

.event-title,
.event-timing {
    padding-bottom: 5px;
    font-size: 15px;
    border-bottom: solid 2px whitesmoke;
}

.event-timing .event-slt:nth-child(2) {
    float: right;
}

.event-slt {
    display: inline-block;
    padding: 15px 5px 5px 5px;
    text-align: left;
    font-size: 12px;
}

.event-card .head {
    display: block;
    margin-left: -15px;
    margin-right: -15px;
    background: #e6e6e6;
    padding: 0px 15px;
    height: 20px;
}

.event-card .head label {
    position: relative;
    /* bottom: -10px; */
    background: #e6e6e6;
    padding: 2px 5px;
    font-size: 13px;
}

.event-card .val {
    font-size: 12px;
    padding: 0px 5px 8px 5px;
    display: inline-block;
}

.event-status .val {
    padding-top: 15px;
    padding-left: 20px;
}

.ar {
    text-align: right !important;
}

.al {
    text-align: left !important;
}

.ac {
    text-align: center !important;
}

.ui-dialog {
    max-width: 96%;
}

.dialogue-with-overlays .ui-dialog {
    overflow: visible;
}

.dialogue-with-overlays .ui-dialog .ui-dialog-content {
    /*height: 100%;*/
    overflow: inherit !important;
}

.form-control.ngp-date {
    padding: 0px;
}

.form-control.ngp-date .ui-calendar {
    width: 100%;
    height: 100%;
}

.form-control.ngp-date input {
    width: 100%;
    height: 100%;
}

p-footer {
    display: block;
    width: 100%;
}


/*MDI ICONS Additions*/

.mdi::before {
    font-size: 24px;
    line-height: 14px;
}

.btn .mdi::before {
    position: relative;
    top: 4px;
}

.btn-xs .mdi::before {
    font-size: 18px;
    top: 3px;
}

.btn-sm .mdi::before {
    font-size: 18px;
    top: 3px;
}

.dropdown-menu .mdi {
    width: 18px;
}

.dropdown-menu .mdi::before {
    position: relative;
    top: 4px;
    left: -8px;
}

.nav .mdi::before {
    position: relative;
    top: 4px;
}

.navbar .navbar-toggle .mdi::before {
    position: relative;
    top: 4px;
    color: #FFF;
}

.breadcrumb .mdi::before {
    position: relative;
    top: 4px;
}

.breadcrumb a:hover {
    text-decoration: none;
}

.breadcrumb a:hover span {
    text-decoration: underline;
}

.alert .mdi::before {
    position: relative;
    top: 4px;
    margin-right: 2px;
}

.input-group-addon .mdi::before {
    position: relative;
    top: 3px;
}

.navbar-brand .mdi::before {
    position: relative;
    top: 2px;
    margin-right: 2px;
}

.list-group-item .mdi::before {
    position: relative;
    top: 3px;
    left: -3px
}


/*----MDI Icons ends*/

.btn-block {
    width: 100%;
    background: #8BC34A;
    padding: 10px;
    display: block;
    cursor: pointer;
    color: white;
}

.alignR {
    text-align: right;
}

.alignC {
    text-align: center;
}

.link {
    cursor: pointer;
    color: #1976D2 !important;
}

.fs10 {
    font-size: 10px;
}

.label {
    background-color: #a2a1a1;
}

.label-circle {
    width: 5px;
    height: 5px;
    display: inline-block !important;
    padding: 5px;
    border-radius: 25px;
}

.label.label-pending,
.label-Pending,
.label-PENDING {
    background: #607D8B;
    color: white;
}

.label.label-completed,
.label-Completed,
.label-COMPLETED {
    background: green;
    color: white;
}

.label.label-processed,
.label-Processed,
.label-PROCESSED {
    background: #83c31f;
    color: white;
}

.label.label-shipped,
.label-Shipped,
.label-SHIPPED {
    background: #4CAF50;
    color: white;
}

.label.label-aborted,
.label-Aborted,
.label-ABORTED {
    background: #ffaa00;
    color: white;
}

.label.label-success,
.label-Success,
.label-SUCCESS {
    background: #5cb85c;
    color: white;
}

.label.label-placed,
.label-Placed,
.label-PLACED {
    background: #009688;
    color: white;
}

.label.label-failed,
.label-Failed,
.label-FAILED {
    background: #FF5722;
    color: white;
}

.pp-photo {
    width: 120px;
    height: 120px;
}

.sign-photo {
    width: 120px;
    height: 60px;
}


/*File Manager*/

.fmm-header {
    padding: 10px;
    border-bottom: solid 1px #e2e2e2;
    margin-bottom: 0px;
}

.fmm-body {
    max-height: 80%;
    /* overflow-y: auto; */
    border-bottom: solid 4px #e6e6e6;
    /*padding-bottom: 30px;*/
}

.fm-menu ul {
    border-right: solid 1px #e2e2e2;
    /* padding-top: 15px; */
    padding: 0px;
    font-weight: bold;
    height: 300px;
    overflow-y: auto;
    margin-bottom: 0px;
    padding-top: 10px;
}

.fm-menu ul li {
    list-style: none;
    padding: 5px;
    padding-left: 15px;
    border-bottom: solid 1px #e2e2e2;
    cursor: pointer;
}

.fm-menu ul li.active,
.fm-menu ul li:hover {
    background: #f1efef;
}

.fm-content {
    padding-top: 15px;
}

.fmimg-thumb {
    width: 84px;
    height: 84px;
    display: inline-block;
    border-radius: 2px;
    padding: 1px;
    margin: 5px;
    border: solid 1px #bfbfbf;
}

.fmimg-thumb img {
    width: 100%;
    height: 100%;
}

.fmimg-thumb.selected,
.fmimg-thumb:hover {
    background: blue;
    opacity: 0.8;
    border-color: blue;
}

.fileinput-selector {
    cursor: pointer;
    margin-bottom: 0px;
}

.fileinput-selector span {
    width: 100%;
    height: 100%;
    display: inline-block;
    /* word-wrap: break-word; */
    overflow: hidden;
    /* overflow-anchor: initial; */
    text-overflow: ellipsis;
    white-space: nowrap;
}


/*----File Manager*/

.mb5 {
    margin-bottom: 5px;
}

.mb10 {
    margin-bottom: 10px;
}

.mb30 {
    margin-bottom: 30px;
}

.std-prfl-bx {
    background: #ecf7d8;
    margin-top: -15px;
    margin-right: -25px;
}

.student-profile-card {
    background: #FFF8E1;
    padding: 15px;
    border-radius: 2px;
    box-shadow: 1px 1px 1px 1px #e0e0e0;
}

.std-prfl-bx .student-profile-card {
    box-shadow: none;
    background: transparent
}

.student-profile-card .pi {
    text-align: center
}

.student-profile-card .pi img {
    width: 100px;
    height: 100px;
    border-radius: 100px;
    max-width: 100%;
}

.student-profile-card .title {
    margin-top: 0px;
}

.std-prfl-stats {
    text-align: center;
}

.std-prfl-stats span {
    font-size: 16px;
    top: -5px;
    position: relative;
}

.std-prfl-stats b {
    font-size: 24px;
}

.profile-content .pimg {
    text-align: center
}

.profile-content .pimg img {
    max-width: 100%;
    padding: 5px;
    width: 100%;
    max-height: 200px;
}

.profile-content .details-rows {
    padding: 15px;
}

.profile-content .details-rows .row {
    margin-bottom: 10px;
}

.dp-tbl {
    display: table;
    width: 100%;
}

.dash-ads img {
    max-height: 130px;
}

.section {
    margin-bottom: 30px;
}

@media (max-width: 767px) {
    .alignC-xs {
        text-align: center;
    }
    .spc-container>.row>.col-md-5,
    .spc-container>.row>.col-md-3 {
        margin-bottom: 15px;
        border-bottom: solid 1px #bede7f;
        padding-bottom: 5px;
    }
    #dash-ads .slider {
        margin-bottom: 15px;
    }

    header .right-sec ul li{
        text-align: center;
        left: 0;
    }

    .h-dropdown {
        left: 0;
        width: 100vw;
    }

    .h-dropdown .dropdown-items{
        /* display:flex; */
    }
}

.ui-galleria-panel-wrapper {
    height: auto !important;
}

.ui-galleria-panel-wrapper li.ui-galleria-panel {
    position: relative;
    height: auto !important;
}

.ui-galleria-panel-wrapper li.ui-galleria-panel img {
    width: 100% !important;
}

.table-bordered thead {
    background: #f1efef;
}

form .ng-invalid.ng-touched.form-control,
form input.ng-invalid.ng-touched {
    border: 1px solid #de2525;
    -webkit-box-shadow: inset 0 1px 1px rgba(255, 118, 118, 0.6);
    box-shadow: inset 0 1px 1px rgba(255, 118, 118, 0.6);
}

form.show-error .ng-invalid.ng-untouched.form-control,
form.show-error input.ng-invalid.ng-untouched {
    border: 1px solid #de2525;
    -webkit-box-shadow: inset 0 1px 1px rgba(255, 118, 118, 0.6);
    box-shadow: inset 0 1px 1px rgba(255, 118, 118, 0.6);
}
#testMentTabView .ui-widget-content a {
    color: #ffff;
}
a.btn-link{
    color: rgb(5, 4, 4)
}
.btn.btn-xs2{
    padding: 3px 7px;
    font-size: 11px;
}
#testMentTabView .ui-accordion-header {
    margin-bottom: 10px;
}

/* course BOx */
.vids{
    padding:15px;
}
.vid-bx{
    height: 200px;
    border: solid 1px #bfbdbd;
    border-radius: 2px;
    margin-bottom: 20px;
}
.vid-thumb{
    height: 120px;
    text-align: center;
    background: #bbf1ff7a;
    cursor: pointer;
}
.vid-bx.notAvlbl .vid-thumb{
    background: #eaeaea;
}
.vid-thumb .fa-play{
    display: inline-block;
    width: 50px;
    height: 50px;
    border: solid 2px #61afec;
    text-align: center;
    border-radius: 25px;
    padding-top: 14px;
    font-size: 20px;
    color: #61afec;
    /* margin: auto; */
    margin-top: 35px;
}
.vid-bx.notAvlbl .vid-thumb .fa-play{

    border: solid 2px #848282;

    color: #757474;
}
.vid-info{
    padding: 0 10px;
}
.vid-info h6{
    font-size: 16px;
    font-weight: bold;
}
iframe{
    border: 0px;
}
/* ends course BOx */

/* --------------lokesh------------------- */
.margin-bottom-10 {
    margin-bottom: 10px;
}

.margin-top-20 {
    margin-top: 20px;
}
.margin-left-10{
    margin-left : 10px;
}

.ek-label {
    color: #b7b7b7;
    font-size: 12px;
    font-weight: normal;
    margin-bottom: 0px;
}

.ui-fieldset,
.ui-fieldset .ui-fieldset-legend {
    padding: .6em 1em;
    margin-bottom: 20px;
}
legend {
    font-size: 18px;
}
.ui-state-default {
    border: 1px solid #d6d6d6;
    /* box-shadow: 2px 5px 20px 0px #888888; */
    background: #ececec;
    color: #555555;
}

.card {
    position: relative;
    margin-bottom: 15px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
    transition: 0.3s;
    border-radius: 5px;
}

.card:hover .overlay {
    width: 100%;
    left: 0;
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2);
}

.card-img {
    border-radius: 5px 5px 0 0;
    display: block;
    width: 100%;
    height: 180px;
}
.card-img img{
    max-width: 100%;
}
.card-title {
    width: 90%;
}
.card-container {
    padding: 2px 16px;
}


.card .overlay {
    position: absolute;
    bottom: 0;
    left: 100%;
    right: 0;
    background-color: #143b4894;
    border-radius: 5px 5px 5px 5px;
    overflow: hidden;
    width: 0;
    height: 100%;
    transition: .5s ease;
}

.card .text {
    cursor: pointer;
    color: white;
    position: absolute;
    top: 10%;
    left: 10%;
    -webkit-transform: translate(10%, 10%);
    -ms-transform: translate(10%, 10%);
    transform: translate(0%, 0%);
    white-space: unset;
}

.ek-full-screen-window {
    position: fixed;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    z-index: 1000;
    background: white;
    overflow: auto;
}

.ek-full-screen-window .close-opt {
    color: #b3b2b2;
    position: absolute;
    right: 15px;
    top: 15px;
    cursor: pointer;
    padding: 2px 4px;
}

.ek-full-screen-window .close-opt:hover {
    color: #7d7d7d;
}

.ek-full-screen-window .eaa-app-grp h4 {
    border-bottom: solid 2px #dddddd;
    padding-bottom: 8px;
    margin-top: 30px;
    margin-bottom: 15px;
}

.ipanel {
    border: none;
    margin-bottom: 20px;
}

/* .ipanel .ipanel-body {
    padding: 20px;
} */
.ipanel .ipanel-heading {
    background-color: #00aef1;
    border-top: 3px solid #DADFE2 !important;
    padding: 15px;
    /* margin-bottom: 15px; */
    /* border-bottom: solid 1px #ebeff2 !important; */
}

.ipanel .ipanel-heading .title {
    margin-bottom: 0px;
}

.ipanel-sub-heading {
    background: #79d8e8;
}

.ipanel .ipanel-footer {
    background: #7e8ea9;
    border-top: 0px;
    height: 25px;
}
#testMentTabView .ui-widget-content a {
    color: black;
}
#testMentTabView .ui-state-active a {
    color: white !important;
}
#testMentTabView .ui-tabview-nav {
    display: flex;
    overflow: auto;
}
#testMentTabView .ui-tabview .ui-tabview-nav>li.ui-state-active {
    background: #007ad9;
    font-weight: normal;
    color: #fff;
}

#testMentTabView .ui-tabview .ui-tabview-nav li a:hover {
    background: #0268b6;
}

#testMentTabView .ui-tabview .ui-tabview-nav li:not(.ui-state-active):not(.ui-state-disabled):hover a {
    color: white;
}

.ek-card-profile {
    width : 80%;
    height: 130px;
    border: 1px solid #0000001c;
    border-radius: 10px;
    box-shadow: 0 0 10px 2px #0000001c;
    /* background: linear-gradient(to left,#2bc0ec,#0788f5); */
}

.ek-card-level {
    height: 130px;
    border: 1px solid #0000001c;
    border-radius: 10px;
    margin-top: 14px;
    box-shadow: 0 0 10px 2px #0000001c;
    /* background: linear-gradient(to left,#2bc0ec,#0788f5); */
}

.ek-card-label {
    font-size: 30px;
    font-weight: bold;
    text-align: center;
    margin: 20px -13px;
    color: white;
    border-radius: 5px;
}

.ek-card-title, .level-title {
    margin: 2%;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
}

.ek-card:hover .ek-card-label {
    box-shadow: 0 0px 5px 5px #00000021;
}

.ek-report {
    border: 1px solid #0000001c;
    border-radius: 10px;
    margin-top: 10px;
    box-shadow: 0 0 10px 2px #0000001c;
}

.report-title {
    font-size: 20px;
    font-weight: bold;
    text-align: center;
}

.report-text {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
}

.report-table {
    margin: 20px 20px;
    text-align: center;
    width: 100%;
}
.report-table b{
    color: #a7a7a7;
}

.report-table td>b {
    color: grey;
}

.report.stitle {
    font-weight: bold;
    font-size: 18px;
}
.report-header{
    margin: 20px 0px;
}
.report-header >div{
    margin-bottom: 2vh;
}
.report-question {
    width: 100%;
}

.report-question tr {
    border-top: 1px solid #00000026;
    border-bottom: 1px solid #00000026;
    text-align: center;
    font-size: 16px;
    /* font-weight: bold; */
}

.report-question tr>th {
    text-align: center;
    /* color: grey; */
}

.level-table {
    margin: 10px;
    margin-left: 25px;
    width: 80%;
}

.level-table td {
    color: grey;
    text-align: center;
}

.level-table td>div {
    font-size: 24px;
    color: black;
}
.profile-image {
    width: 70px;
    height: 70px;
    border-radius: 50%;
}

.topper-title {
    padding-top: 25px;
    padding-left: 25px;
    font-weight: bold
}

.brooch {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    background-color: #777777e6;
    border-radius: 10px;
}
.brooch-primary {
    background-color: #007ad9;
}
.brooch-success {
    background-color: #5cb85c;
}

.brooch-danger {
    background-color: #FF5722;
}
.brooch-info {
    background-color: #3F51B5;
}
.brooch-warning {
    background-color: #eea236;
}
.brooch-list {
    background-color : #009688;;
}

.col-border-right {
    border-right: 1px solid #e6e6e6;
}

/* .leader-board {
    width: 100%;
    margin: 20px;
} */

.leader-board tr {
    text-align: center;
    font-weight: bold;
}

.leader-board tr>th {
    text-align: center;
    color: grey;
}

.leader-board .img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
}
.test-card{
    border: 1px solid #bfc8cc;
    border-radius: 5px;
    margin-top: 7px;
    padding: 10px 20px;
    margin-bottom: 15px;

}
.test-card:hover{
    /* box-shadow: 0px 0px 5px -1px grey; */
    /* cursor: pointer; */
    border: 1px solid #014954ad;
}
.test-card .title{
    font-size: 18px;
}
.test-card .tc-opt{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.circle{
    padding: 50% 0%;
}
.circle-home{
    padding: 35% 0%;
}
.circle, .circle-home{
    width: 55px;
    height: 55px;
    background: #e91e63c9;
    border-radius: 50%;
    color: white;
    margin-top: 6px;
    text-align: center;
    font-weight: bold;
    font-size: 15px;
}


.test-card .content{
    text-align: center;
    margin-top: 5px;
}
.test-card .content > label{
   color:  #808080cf;
}
.test-arrow{
    margin-top: 20px;
    margin-left: 5px;
    color: grey;
}
.chart-report{
    margin-top: 2%;
    font-size: 18px;
    font-weight: bold;
}
.chart-report > div{
    border-bottom: 3px solid #00000061;
    color: white;
    text-align: center;
    border-radius: 50px 0px;
    margin-left: 10%;
}
.chart-report .incorrect{
    /* margin-left: 7%; */
    background: rgb(228, 74, 63);
}
.chart-report .attempted{
    /* margin-left: 10%; */
    background: rgba(54, 162, 235, 1);
}
.chart-report .correct{
    /* margin-left: 12%; */
    background: hsl(122, 41%, 49%);
}
.chart-report .unattempt{
    /* margin-left: 10%; */
    background: rgb(255, 152, 0);
}
.chart-percentage{
    position: absolute;
    margin: 20% 45%;
    font-size: 20px;
    font-weight: bold;
}
.test-scroll{
   width: 100%; height: 285px; overflow-y: scroll;
}
.emptyTest{
    margin: 15px;
    text-align: center;
    font-size: 18px;
    font-weight: bold;
}
.rec-test{
    width: 100%;
    text-align: center;
}
.rec-test .head{
    text-align: center;
    color:grey;
}
.product-info{
    font-size: 18px;
    text-align: center;
}

.showMore {
  font-size: 14px;
  display: block;
  text-decoration: underline;
  cursor: pointer;
}
.showMore + input {
 display:none;
}
.showMore + input + * {
  max-height: 0;
  /*and eventually delay an overflow:auto; */
  overflow:hidden;
  transition: max-height 0.5s, overflow 0s;
}
.showMore + input:checked + * {
  /* here comes the compromise, set a max-height that would for your usual contents*/
   max-height: 5em;
  overflow:auto;
  transition: max-height 0.5s, overflow 0.5s 0.5s;
}

.test-type{
    border-radius: 120px;
    margin-left: 2%;
    cursor: pointer;
    text-align: center;
    padding: 1px 10px 1px 10px;
    color: white;
    font-weight: bold;
    font-size: smaller;

    /* border-radius: 50%;
    margin-left: 2%;
    cursor: pointer;
    box-shadow: 0px 0px 6px 2px #0000003d;
    width: 25px;
    text-align: center;
    color: white;
    font-weight: bold;
    font-size: larger;
    height: 25px; */
}
.bg-practice{
    background-color: #f0ad4e;
 }
.bg-live{
    background-color: green;
}
.chart-container{
    position: relative;
     height:43vh;
     width:40vw;
}
.barchart-container{
    position: relative;
     height:43vh;
}
.sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 290px;
  }
  .chart-title{
    font-size: 1.5em; color: grey;
  }
  .chart{
    margin: 5% 0%;
  }
  .q-content b{
    float: left;
    margin-right: 10px;
    }
    .q-content p div{
        font-family : sans-serif, symbol;
    }
/* ------------------MathJax ---------------- */
.MJXc-display{
    display: initial !important;
    text-align: inherit !important;
}
/* ------------------ // MathJax ---------------- */
.ts-content{
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
}
.ts-content .ts-card{
    border: solid 1px #d9e3e6;
    border-radius: 4px;
}
.ts-content .ts-card .thumb{
    width: 100%;
    height: 120px;
    background: #e9faff;
    text-align: center;
}
.ts-content .ts-card .thumb img{
    max-width: 100%;
    max-height: 100%;
}
.ts-content .ts-card .thumb i{
    opacity: 0.7;
    padding-top: 30px;
    font-size: 64px;
    color: #c2dee4;
}
.ts-content .ts-card .ttl a{
    padding: 5px 15px;
    display: inline-block;
}
.ts-content .ts-card .opts{
    padding:15px
}
.test-student{
    border-top: 1px solid #a5a0a099;
    padding: 3vh 0px;
}
.test-btn{
    display: flex;
    flex-wrap: nowrap;
    margin-top : 10px;
}
.chart-space{
    height : 44vh;
}
@media only screen and (max-width: 650px) {
    legend{
        font-size: 14px !important;
        font-weight: bold;
    }
    .sticky{
        position: inherit;
    top: 0;
    }
    .report-header >div{
        margin-bottom: 2vh;
        margin-left: 5vw;
        margin-right: -9vw;
    }
    .circle, .circle-home{
        width: 20vw;
        height: 10vh;
        margin-left: 10vw;
        padding: 5vw 0;
    }
    .chart-container{
        height: auto;
        width: auto;
    }
    .chart-percentage{
        margin: 0% 75%;
    }
    .chart-space{
        height: 24vh;
    }
    .chart-report{
        margin-right: 5%;
    }
    .menu-sec{
        max-height: 700px;
    }
    /* .ui-tabview.ui-tabview-top>.ui-tabview-nav li{
        width: 100% !important;
    }
    #testMentTabView .ui-tabview .ui-tabview-nav li a:hover{
        width: 100%;
    } */



}
/* COURSE Creator Student panel */
.course-card-container{
    display: flex;
    flex-flow: wrap;
}
.course-card-item{
    flex-direction: row;
    padding: 5px;
    min-width: 24.2%;
    margin-right: 9px;
    max-width: 24.2%;
    flex: 1;
    margin-bottom: 10px;
}
.course-card{
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
    max-width: 300px;
    margin: auto;
    text-align: center;
    font-family: arial;
    position: relative;

}
.course-card-body {
    width: 100%;
    float: left;
    background: #f7f9fb;
    padding: 5px;
    box-shadow: #ece8e8 1px 2px 6px 1px;
}

.course-card-title {
    padding: 5px;
}

.course-card-title p {
    font-size: 1.4rem !important;
    word-break: break-all;
}
.course-price{
    float: left;
    font-size: 1.5em;
}
.course-buy-btn{
    float: right;
}
.course-card-img{
    border-radius: 5px 5px 0 0;
    display: block;
    width: 100%;
    height: 120px;
}
.right-side-menu{
    position: relative;
}
.right-side-menu ul.course-dropdown-main-menu{
    margin: 0 auto;
    min-width: 200px;
}

.right-side-menu ul.course-dropdown-main-menu>li{
    position: relative;
    list-style: none;
}

.right-side-menu ul.course-dropdown-main-menu>li>a{
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #000;
    white-space: nowrap;
    background: #fff;
    border-bottom: 1px #000 solid;
    text-decoration: none
}
.right-side-menu ul.course-dropdown-main-menu>li>a:hover{
    background: #346ba0;
    color:#fff;
}

ul.course-dropdown-main-menu>li.course-dropdown-submenu>ul.course-dropdown-menu{
    min-width: 150px;
    float: left;
    display: none;
    background: #346ba0;
}

/* ul.course-dropdown-main-menu>li.course-dropdown-submenu>a{} */
li.course-dropdown-submenu>ul.course-dropdown-menu>li{
list-style: none;
}

li.course-dropdown-submenu>ul.course-dropdown-menu>li>a{
    color: #fff;

}

li.course-dropdown-submenu>ul.course-dropdown-menu>li>a:hover{

}

/* Online Course (Course Creator) Starts*/
.window-header{
    box-shadow:0px 0px 3px 0px #cdd1d3;
    height: 50px;
}
.activity-content.full-window {
    position: fixed;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    background: white;
    z-index: 1000;
    margin: 0px;
}
.wh-logo{
    display: inline-block;
    padding: 1px;
    font-size: 25px;
    font-family: sans-serif;
    font-weight: bold;
    /* color: #00796B; */
    width: 250px;
    border-right: solid 1px #cdd1d3;
    line-height: 30px;
    height: 50px;
}
.wh-course-back{
    display: inline-block;
    margin-left: -4px;
}
.wh-course-back a{
    display: inline-block;
    background: #cdd1d3;
    /* padding: 16px 5px; */
    height: 25px;
    width: 25px;
    border-radius: 25px;
    text-align: center;
    line-height: 25px;
    position: relative;
    left: 10px;
}
.wh-logo img{
    max-width: 100%;
    max-height: 100%;
}
.wh-course-title{
    width: 300px;
    display: inline-block;
    font-size: 18px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow-x: hidden;
    position: relative;
    top: 7px;
    padding-left: 15px;
}
.wh-course-more{
    display: inline-block;
    width: calc(100% - 577px);
    text-align: right;
    padding: 15px;
}
.window-body{
    display:flex;
}

.window-body .window-leftbar{
    width:250px;
    border-right: solid 1px #cdd1d3;
    background:#f5f5f5
}
.window-leftbar .leftbar-toggle{
    position: absolute;
    right: -36px;
    font-size: 24px;
    padding: 6px 5px 2px 5px;
    line-height: 32px;
    border: solid 1px #cdd1d3;
    background: white;
    opacity: 0.9;
}
.window-leftbar .head-title{
    background: #e4e4e4;
    padding: 10px;
    /* font-weight: bold; */
    font-size: 16px;
}
.window-leftbar .subject-opt{
    padding: 15px;
}
.window-leftbar .chapter{
    /* border-left: solid 4px #f5f5f5; */
    border-bottom: solid 1px #cdd1d3;
}
.window-leftbar .chapter-title{
    padding: 10px 15px;
    font-size: 15px;

}
.window-leftbar .chapter-lessons{
    background-color:#f2f3f2;
    border-left: 4px solid rgb(205, 209, 211);
}
.window-leftbar .lesson{
    padding: 5px 15px;
    /* margin-bottom: 2px; */
    cursor: pointer;
    border-bottom: solid 1px #cdd1d3;
}
.window-leftbar .lesson:hover{
    background: #fbfbfb;
}
.window-leftbar .lesson:last-child{
    border-bottom: transparent;
}

.ek-collapse-body{
    background: #fff;
    overflow: hidden;
    color: #000;
    overflow: hidden;
    height: '*';
    opacity: 1
    /* transition: all .5s ease-in-out;
    height: auto;
    max-height: "*"; */

}

.ek-collapse-head{
    display: flex;
    justify-content: space-between;
    cursor:pointer;
    border-top: solid 1px #cdd1d3;
    margin-left: -4px;
}
.ek-collapse-head>i{
    line-height: 21px;
}
.ek-collapse-head>p{
    margin-bottom: 0px;
}
.ek-collapse-head>p b{
    font-size: 14px;
}
.ek-collapse-head>p span{
    font-size: 10px;
    position: relative;
    top: -4px;
}
/* .chapters{
    overflow: auto;
    height: 586px;
} */
.chapter .lesson-data>p{
    margin:0px
}
.chapter .lesson-data>p:nth-child(2) span{
    padding: 2px 5px;
    font-size: 10px;
    margin-right: 5px;
}
/* .lesson:before {
    content:"";
    position: absolute;
    right: 11px;
    top: -10px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 10px 10px 10px;
    border-color: transparent transparent #fae0bb transparent;
    z-index:9999;
}
.lesson:after {
    content:"";
    position: absolute;
    right: 4px;
    top: -22px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 17px 17px 17px;
    border-color: transparent transparent #ffffff transparent;
    z-index:9998;
} */
.main-content-sec{
    padding: 0px;
    height: calc(100vh - 50px);
    overflow-y: auto;
    width: 77%;
    padding:0px;
}
.window-content{
    width: calc(100% - 250px);
    padding:0px;
}
.window-content > .row{
    height:100%;
    margin:0px;
}
.window-content .right-sec{
    border-right: solid 1px #cccccc;
    height: 100%;
    padding-left:0px;
    /* float:right; */
    padding-right: 0px;
    width:23%;
    box-shadow: 1px 1px 4px -2px #ffffff;
    z-index:2;
}
.window-content .right-sec ul{
    padding: 0px;
}
.window-content .right-sec ul li{
    list-style: none;
    padding: 10px 15px;
    border-bottom: solid 1px #cccccc;
    border-left: solid 1px white;

}
.window-content .right-sec ul li:first-child{

    margin-top: 15px;
    border-top: solid 1px #cccccc;
}
.window-content .right-sec ul li.active{
    margin-right: -2px;
    background: white;
    border-left: solid 1px whitesmoke;
    background-image: linear-gradient(to right, whitesmoke , white);
}

.activeClass{
    background: #fff;
    margin-right: -2px;
}
.activeChapter{
    background: #f5f5f5 !important;
}
.course-card-img img{
    height: 120px;
    width: 100%;
}
.lesson-theory img{
    max-width: 100%;
}
.course-curriculum{
    height: calc(100vh - 170px);
    overflow: auto;
    overscroll-behavior-y: auto;
    padding-bottom: 50px;
}
.course-curriculum::-webkit-scrollbar{
    width:4px;
}
.main-content-sec .lesson-theory{
    padding:0px;
}
.main-content-sec .lesson-forum{
    padding:20px;
}
.main-content-sec .lesson-quiz{
    padding:20px;
}
.lesson-theory .video-iframe{
    background:black;
}
.lesson-opts{
    display: block;
    border-top: solid 1px #cdd1d3;
    position: absolute;
    bottom: 33px;
    text-align: center;
    width: 100%;
    padding: 8px 5px;
}
.lesson-opts-xs{
    display:none;
}
/* Online Course (Course Creator) Ends*/
@media (max-width: 768px){
    .window-content{
        width: 100%;
    }
    .window-content .right-sec {
        height: auto;
    }
    .window-body {
        /* display: flex; */
        flex-flow: column;
    }
    /* ul.option-content{
        padding-left: 10px;
    } */
    .window-body .window-leftbar {
        width: 250px;
        position: absolute;
        border-right: solid 1px #cdd1d3;
        z-index: 1111;
        background:#fefefe;
        transition: cubic-bezier(0.075, 0.82, 0.165, 1);
        margin-left: -249px;
        transition: margin-left 0.1s linear;
        /*-webkit-transition-delay: 0.1s;*/
        /* Safari */
        /*transition-delay: 0.1s;*/
        -webkit-transition: left 0.5s;
        /* Safari */
        transition: margin-left 0.5s;
    }
    .window-body .window-leftbar.open{
        margin-left: 0px;
    }
    .window-body .window-leftbar .glyphicon-remove{
        display: none;
    }
    .window-body .window-leftbar.open .glyphicon-th-list{
        display: none;
    }
    .window-body .window-leftbar.open .glyphicon-remove{
        display: inline-block;
    }
    .right-sec{
        margin-top: 1px;
        width:100% !important;
    }
    .right-sec ul li{
        width: 32.5%;
        margin: 0px !important;
        display: inline-block;
        border: solid 1px #cccccc !important;
        cursor: pointer;
    }
    .right-sec li{
        text-align: right
    }
    .right-sec li.active{
        border-bottom: solid 1px white !important;
        bottom: -1px;
        position: relative;
        background-image: linear-gradient(to bottom, whitesmoke , #ffffff);

    }
    .main-content-sec{
        height: calc(100vh - 100px);
        overflow-y: auto;
        width:100% !important;
    }
    .main-content-sec .video-iframe{
        width: 100%;
        height:280px;
    }
    .window-content .right-sec ul{
        border-bottom: solid 1px gainsboro;
        margin-bottom: 0px;
    }
    .course-curriculum{
        height: 75h;
        overflow: auto;
        overscroll-behavior-y: auto;
        padding-bottom: 40px;
    }
    .lesson-opts{
        display: none;
    }
    .lesson-opts-xs{
        display:block;
        text-align: center;
    }
    .last{
        display: none !important;
    }
    .sub-header{
        width: 100%;
    }


    .header .drop-menu>span {
        position: absolute;
        top: 10px;
        left: 50px;;
    }
    .header .drop-menu {
        width: calc(50% - 2px);
    }
    .header .drop-menu ul{
        padding-top: 0;
        margin-top: 50px;
    }
    header .right-sec>ul>li.user-opts {
        width: 54px;
        text-align: center;
        position: absolute;
        right: 6px;
        top: -51px;
        height: 40px;
    }
    header .right-sec ul li{
        left: auto !important;
        border: none !important;
    }
    header .right-sec>ul>li.user-opts > .h-dropdown {
        left: auto;
        width: 100vw;
    }

    .wrapper{
        padding-top: 50px;
    }

}
.forum-q-set {
    border-left: solid 3px #e8e8e8;
    margin-bottom: 15px;
}
.forum-q {
    background: #f9f9f9;
}
.forum-q-title {
    padding: 5px 15px;
    font-size: 16px;
}
.forum-q-desc {
    padding: 5px 15px;
    font-size: 14px;
}
.forum-q-desc img {
    max-width: 100%;
}
.forum-q-opts {
    font-size: 10px;
    padding: 5px 15px;
    background: #efe8e8;
}
.forum-replies {
    background: #dedede;
    padding: 5px;
}
.forum-reply {
    background: #f3f1f1;
    margin-bottom: 10px;

}
.forum-q-opts>a{
    cursor: pointer;
    text-decoration: none;
}
.forum-reply-title{
    font-size: 15px;
    padding-left: 10px;
    padding-top: 10px;
}
.forum-reply-opts {
    font-size: 11px;
    background: #eaeaea;
    padding: 5px 10px;
}
.forum-reply-desc {
    font-size: 15px;
    padding: 10px;
}
.lesson-forum{
    height: 100vh;
    overflow: auto;
    padding-bottom: 16px;

}
.forum-thread {
    padding-bottom: 100px;
}
.doubt-btn{
    padding-bottom: 10px;
    text-align: right;
}

@media (max-width:450px){
    .sub-header{
        width: 100%;
    }
    .course-card-item{
        max-width: 100%!important;
        flex: auto;
    }
    .menu-sec{
        height: 650px;
    }

    .circle,.circle-home{
        width: 14vw;
        height: 8vh;
        margin-left: 12vw;
        padding: 4vw 0;
    }

    #dash-ots-products .ui-tabview-left>.ui-tabview-nav{
        width: 100% !important;
    }
    #dash-ots-products .ui-tabview-left>.ui-tabview-panels{
        width: 100% !important;
    }

    .expired-layer::before {
        content: ' Expired ';
        text-align: center;
        position: absolute;
        left: 0;
        width: 100%;
        height: 200px !important;
        background: #7b7c7d;
        opacity: 0.9;
        padding-top: 90px !important;
        font-weight: bold;
        font-size: 1.4em;
        color: #fff;
    }
}

.Dashboard-box{
    background: white;
    border: 0.5px solid #8080805c;
    border-radius: 10px;
    padding: 10px;
    font-weight: bold;
    text-align: center;
}
.Dashboard-box .remark{
    font-size: 38px;
}
.Dashboard-box .title{
    font-weight: bold;
    font-size: 20px;
}
.Dashboard-box .icon{
    position: absolute;
    font-size: 46px;
    color: #5fbeaa;
}
.pointer:hover{
    cursor: pointer;
    border: 0;
}

.blink-button {
    border-radius: 10px;
    border: none;
    color: #FFFFFF !important;
    cursor: pointer;
    display: inline-block;
    font-size: 16px;
    padding: 5px 10px;
    font-weight: bold;
    text-align: center;
    background-color: #007ad9;
    text-decoration: none;
    animation: glowing 2000ms infinite;
  }
  @keyframes glowing {
    0% { transform: scale(1) }
    50% { transform: scale(1.1) }
    100% { transform: scale(1) }
  }
/* .watermark{
    background: linear-gradient(rgba(255,255,255,.8), rgba(255,255,255,.8));
    background-repeat: no-repeat;
    background-position: center;
}
.watermark:before{
    -webkit-transform: rotate(-30deg);
    transform: rotate(-30deg);
} */

.menu-sec{
    overflow-y: auto;
    padding-bottom: 50px;
    height: 100%;
}
/* width */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
    border: 1px solid #dedede;
  }

  /* Track */
  scroll::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px #8c1212;
    border-radius: 10px;
  }

  /* Handle */
  ::-webkit-scrollbar-thumb {
    background: #dedede;
    border-radius: 10px;
  }

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
background: #efefef;
}
.menu-sec ::-webkit-scrollbar{
    width:4px;
}

#dash-schedule{
    background: #ffffff;
    /* padding: 13px; */
}
.event-card-container{
    display: flex;
    flex-flow: wrap;
}
.event-card-item{
    flex-direction: row;
    padding: 5px;
    min-width: 24.2%;
    margin-right: 9px;
    max-width: 24.2%;
    flex: 1;
    margin-bottom: 10px;
    margin-top: 20px;
}
.event-card{
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
     width: 300px;
    /*margin: auto;
    text-align: center;
    font-family: arial; */
    margin: 5px;
    text-align: center;
    font-family: arial;
    align-items: center;
    justify-content: center;
    background: #ebeff240;
    padding-bottom: 10px;
    padding-top: 10px;
    margin-top: 20px;
}
.event-card-body {
    width: 100%;
    float: left;
    background: #f7f9fb;
    padding: 5px;
    box-shadow: #ece8e8 1px 2px 6px 1px;
}

.event-card-title {
    padding: 5px;
}

.event-card-title p {
    font-size: 1.8rem !important;
}


.event-badge{
    padding: 5px;
    padding-left: 10px;
    padding-right: 10px;
    margin: 5px;
    float: left;

}

.event-days{
    margin-top: 10px;
    margin-bottom: 10px;
}

.schedule-nf{
    border-top:1px solid #dfdfdf ;text-align: center;margin-top: 10px;padding-top: 20px;
}
.newsSpan{
    float: right;
    font-size: 11px;
    background: #c5c5c5;
    padding: 0px 5px;
    /* width: 66px; */
    height: 17px;
    border-radius: 2px;
    min-width: 60px;
    /* max-width: 60px; */
}

header .hdr-noticeboard{
    overflow-y: auto;
}
.notification-list, header .hdr-noticeboard .notification-list{
    list-style: circle;
    padding: 0;
    margin: 0 auto;
    padding-left: 10px;
}
.notification-list li, header .hdr-noticeboard .notification-list li{
    border-bottom: solid 1px #efefef;
    margin-bottom: 10px;
    padding-bottom: 3px;
    padding: 5px 10px 5px 5px;
    width: 100%;
    display: list-item;
    margin-right: 0px;
    margin-left: 0px;
}
.notification-list .nf-meta, header .hdr-noticeboard .notification-list .nf-meta{
    text-align: right;
    font-size: 12px;
}
.notification-list li a, header .hdr-noticeboard .notification-list li a{
    color: #00aef1 !important;
    padding: 0px;
}
/* #dash-ots-tests .circle{
    padding-top: 25%;
} */

.wrong-anwer{
    background-color: #F44336;
    color: #fff;
    padding: 5px;
}
.correct-answer{
    background-color: #4CAF50;
    color: #fff;
    padding: 5px;
}
.question{
    border-bottom: 1px solid #dedede;
    padding: 10px 0px;
}
.question-answer p{
    padding:5px;
}

.link{
  color: #00aef1;
}
ul.option-content{
    padding:0 !important;
}
.option-content>li{
    display: flex;
    flex-flow: row;
}
.option-content>li>label {
    margin-left: 5px;
}
.question-info{
    display: flex;
}
 .question-info>.qNo{
    margin-right: 5px;
}
#dash-ots-products .ui-tabview-left>.ui-tabview-nav{
    width: 18%;
}
#dash-ots-products .ui-tabview-left>.ui-tabview-panels{
    width: 82%;
}

#dash-ots-products .card .card-footer{
    width: 100%;
    display: flex;
    justify-content: center;
    padding-top: 12px;
    padding-bottom: 10px;
}

@media print{
    *{
        display: none!important;
    }
}

.pt-100{
    padding-top: 25vh;
}

.expired-layer::before{
    content: ' Expired ';
    text-align: center;
    position: absolute;
    left: 0;
    width: 100%;
    height: 200px;
    background:#7b7c7d;
    opacity: 0.9;
    padding-top: 90px;
    font-weight: bold;
    font-size: 1.4em;
    color: #fff;
}




.m-5{
    margin: 5px !important;
}
.m-10{
    margin: 10px !important;
}
.m-15{
    margin: 15px;
}
.ml-0{
    margin-left: 0px !important;
}

.mr-0{
    margin-right: 0px !important;
}

.mt-0{
    margin-top: 0px !important;
}

.mb-0{
    margin-bottom: 0px !important;
}
.ml-5{
    margin-left: 5px !important;
}

.mr-5{
    margin-right: 5px !important;
}

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

.mb-5{
    margin-bottom: 5px !important;
}
.ml-10{
    margin-left: 10px !important;
}

.mr-10{
    margin-right: 10px !important;
}

.mt-10{
    margin-top: 10px !important;
}

.mb-10{
    margin-bottom: 10px !important;
}
.ml-15{
    margin-left: 15px !important;
}

.mr-15{
    margin-right: 15px !important;
}

.mt-15{
    margin-top: 15px !important;
}

.mb-15{
    margin-bottom: 15px !important;
}

/* Padding */
.p-5{
    padding: 5px !important;
}
.p-10{
    padding: 10px !important;
}
.p-15{
    padding: 15px;
}
.pl-0{
    padding-left: 0px !important;
}

.pr-0{
    padding-right: 0px !important;
}

.pt-0{
    padding-top: 0px !important;
}

.pb-0{
    padding-bottom: 0px !important;
}
.pl-5{
    padding-left: 5px !important;
}

.pr-5{
    padding-right: 5px !important;
}

.pt-5{
    padding-top: 5px !important;
}

.pb-5{
    padding-bottom: 5px !important;
}
.pl-10{
    padding-left: 10px !important;
}

.pr-10{
    padding-right: 10px !important;
}

.pt-10{
    padding-top: 10px !important;
}

.pb-10{
    padding-bottom: 10px !important;
}
.pl-15{
    padding-left: 15px !important;
}

.pr-15{
    padding-right: 15px !important;
}

.pt-15{
    padding-top: 15px !important;
}

.pb-15{
    padding-bottom: 15px !important;
}


.pl-20{
    padding-left: 20px !important;
}

.pr-20{
    padding-right: 20px !important;
}

.pt-20{
    padding-top: 20px !important;
}

.pb-20{
    padding-bottom: 20px !important;
}

.pl-25{
    padding-left: 25px !important;
}

.pr-25{
    padding-right: 25px !important;
}

.pt-25{
    padding-top: 25px !important;
}

.pb-25{
    padding-bottom: 25px !important;
}

.lesson-assignment{
    padding: 10px;
}



/*  */

.lession-feedback {
    padding: 5px 0px 5px 10px;
}
.lesson-feedback-qs-data {
    display: flex;
    flex-flow: column;
    padding: 5px 15px 5px 15px;
    border-bottom: 1px solid #dfdfdf;
}

.lesson-feedback-options {
    display: flex;
    flex-flow: column;
}
/* .lesson-feedback-options>.option {
    display: flex;
    flex-flow: column;
} */

.lesson-feedback-options>.option>input {
    margin-right: 10px;
}
.lesson-feedback-qs {
    font-size: 16px;
    font-weight: 600;
}

.lesson-feedback-footer {
    padding-top: 10px;
    text-align: left;
    padding-left: 10px;
}

.lesson-feedback-submitted{
    text-align: center;
    /* padding: 20px; */
    background: #72ede0;
    font-size: 2.3rem;
    color: #000;
    font-weight: bold;
}
.card {
    overflow:hidden;
}
.card-body{
    margin-left: 10px;
}
.card-body .rotate {
    z-index: 8;
    float: right;
    height: 100%;
}

.card-body .rotate i {
    color: rgba(20, 20, 20, 0.15);
    position: absolute;
    /* left: 0; */
    left: auto;
    right: 15px;
    bottom: 0;
    display: block;
    /* -webkit-transform: rotate(-44deg);
    -moz-transform: rotate(-44deg);
    -o-transform: rotate(-44deg);
    -ms-transform: rotate(-44deg); */
    /* transform: rotate(-44deg); */
}
.display-4{
    font-size: 3.5rem;
    font-weight: 300;
    line-height: 1.2;
}
.batch-feeds .media{
    background: #ebeff2;
    padding: 10px;
}

.batch-feeds .media  .media-left .media-object{
    max-width: 100px !important;
}

article-list .ui-sidebar-full,note-list .ui-sidebar-full{
    overflow: auto;

}

article-list .panel .panel-body,note-list .panel .panel-body{
    box-shadow:0px 4px 6px 3px #dddddddd;
}

article-list .panel .panel-heading .panel-title span.panel-title-side-span,note-list .panel .panel-heading .panel-title span.panel-title-side-span{
    font-size: 13px;
    font-weight: 600;
}

article-list .panel a,note-list .panel a{
    cursor: pointer !important;
}

.quiz-card-container{
 display: flex;
 flex-direction: column;
 padding: 10px;
 border-radius: 10px;
}
.quiz-card-head{

}
.quiz-card-body{

}
.quiz-card-footer{

}

.quiz-card-bighead-bg{
 background: #c94b4b;  /* fallback for old browsers */
 background: -webkit-linear-gradient(to right, #4b134f, #c94b4b);  /* Chrome 10-25, Safari 5.1-6 */
 background: linear-gradient(to right, #4b134f, #c94b4b); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
 color: #fff;
}

.quiz-card-orange-bg{
    background: #000046;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #1CB5E0, #000046);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #1CB5E0, #000046); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    color: #fff;
}


/* Article Card */
.batch-feeds .article-card{

    border-radius: 7px;
    display: flex;
    flex-direction: column;
    box-shadow: 0px 4px 6px 3px #dddddddd;
}


.article-card-header{
    height: 169px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 7px 7px 0px 0px;
}

.article-card-body{
    padding: 5px;
}
.article-card-body p{
    font-size: 12px;
}
.article-card-body>p{
    font-weight: 600;
}

.article-card-title{
    font-weight: 600;
}

.article-card-footer{
    padding: 10px;
    color: #fff;
    cursor: pointer;
    border-top: 1px solid;
    border-radius: 0px 0px 7px 7px;
}

.article-content >*{
    font-size: 12px;
}

.article-sky-blue-bg{
    background: #2c3e50;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #3498db, #2c3e50);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #3498db, #2c3e50); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.article-royal-blue-bg{
    background: #0f0c29;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #24243e, #302b63, #0f0c29);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #24243e, #302b63, #0f0c29); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}


.article-card-container{
    display: flex;
    flex-direction: row;
    justify-content: start;
    flex-flow: wrap;
}

.article-card-container-inner{
    /* width: 25%; */
    margin-left: 10px;
    margin-bottom: 10px;
}
.ek-card-2 {
    border: 1px solid #0000001c;
    border-radius: 10px;
    padding: 15px;
    margin-bottom: 10px;
    box-shadow: 0 0 10px 2px #0000001c;
    /* background: linear-gradient(to left,#2bc0ec,#0788f5); */
}
.ek-card-2 .label {
    font-size: 30px;
    font-weight: bold;
    text-align: center;
    margin: 20px -13px;
    color: white;
    border-radius: 5px;
}
.ek-card-2 .title{
    margin: 2%;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
}
.ek-card-2 .content{
    font-weight: bold;
    font-size: 12px;
    text-align: center;
}
.video-player{
    width: 100%;
    float: left;
    position: relative;
}

.video-player .video-watermark{
    position: absolute;
    background: #000;
    color: #fff;
    padding: 5px;
    opacity: 0.3;
    top: 50%;
    left: 39%;
}




.ebook-media {
    max-width: 150px;
    height: 200px;
}
.ebook-media img{
    height: 200px;
}

.ebook-card {
    display: flex;
    flex-direction: row;
    background: #fdfdfd;
    box-shadow: 0px 3px 5px 0px #dfdfdf;
    color: rgb(63, 56, 56);
    height:200px;
    border-radius: 5px;
}

h2.ebook-card-head {
    margin: 0;
    font-size: 20px;
    margin-bottom: 7px;
}

.ebook-card-details {
    /* width: 70%; */
    padding-left: 10px;
    padding: 6px;
    display: flex;
    flex-direction: column;
}
a.ebook-card-action-button {
    background: #f1b62a;
    width: fit-content;
    padding: 6px 20px;
    border-radius: 5px;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
    position: absolute;
    bottom: 10px;
}

.ebook-tab-head{cursor: pointer;}

.ebook-pane-body{
    animation: accordionIn 1s ease-in-out;
}

@-webkit-keyframes accordionIn {
    0% {
           opacity: 0;
           -webkit-transform:scale(0.8);

   }

  100% {
           opacity:1;
           -webkit-transform:scale(1);
  }
}
.product{
    width: 95%;
    position: relative;
    max-width: 800px;
    margin: auto;
    background: #fff;
    box-shadow: 6px 11px 10px rgba(34, 35, 58, 0.2);
    padding: 25px;
    border-radius: 25px;
    /* height: 400px; */
    transition: all .3s;
    margin-top: 60px;
    border-top: 4px solid #fe713933;
}
/* .product {
    width: 95%;
  position: relative;
    max-width: 800px;
    margin: auto;
    background: #fff;
    box-shadow: 0px 14px 40px rgba(34, 35, 58, 0.2);
    padding: 25px;
    border-radius: 25px;
    height: 400px;
    transition: all .3s;
  margin-top: 70px;
  border-top: 4px solid #ff00002b;

  @media screen and (max-width: 992px) {
    max-width: 680px;
        height: 400px;
  }

  @media screen and (max-width: 768px) {
    min-height: 500px;
    height: auto;
    margin: 180px auto;
  }


  @media screen and (max-height: 500px) and (min-width: 992px) {
        height: 350px;
  }
} */
.product-img {
    margin-top: -70px;
}
.product-img .image {
    opacity: 1;
    /* transition-delay: .3s; */
    box-shadow: 0px 5px 15px rgba(34, 35, 58, 0.2);
    width: 13em;
    height: 16vh;
    border-radius: 11%;
}

.product .content {
    opacity: 1;
    transform: none;
}

.product .code {
    color: #7b7992;
    margin-bottom: 10px;
    display: block;
    font-weight: 500;
}

.product .title {
    font-size: 16px;
    font-weight: 700;
    color: #0d0925;
    margin: 15px 0px;
}

.product .text {
    color: #4e4a67;
    margin-bottom: 20px;
    line-height: 1.5em;
}

.product .button {
    display: inline-flex;
    background-image: linear-gradient(147deg, #fe8a39 0%, #fd3838 74%);
    padding: 15px 35px;
    border-radius: 50px;
    color: #fff !important;
    box-shadow: 0px 8px 10px rgba(252, 56, 56, 0.4);
    text-decoration: none;
    font-weight: 500;
        justify-content: center;
    text-align: center;
    letter-spacing: 1px;
    cursor: pointer;
    /* @media screen and (max-width: 576px) { */
        width: 100%;
    /* } */
}
.product-err-img{
    background: url('../images/no-product.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50% 100%;
}
.schedule-img{
    background: url('../images/no-schedule.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50% 100%;
}
.data-img{
    background: url('../images/no-data.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50% 100%;
}
.no-data-man-img{
    background: url('../images/no-data-man.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50% 100%;
}
.no-pie-report-img{
    background: url('../images/no-pie-report.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50% 100%;
}
.video-maker-img{
    background: url('../images/video-maker.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50% 100%;
}
.ek-card-3{
    width: 95%;
    position: relative;
    max-width: 800px;
    margin: auto;
    background: #fff;
    /* box-shadow: 0px 0px 20px 4px rgba(34, 35, 58, 0.2); */
    padding: 15px;
    /* border-radius: 25px; */
    /* height: 400px; */
    transition: all .3s;
    margin-top: 40px;
    /* border-radius: 11% 0% 0% 0%; */
    border: 5px solid #e8e8e8c7;
}

.ek-card-3 .image-container{
    margin-top: -45px;
    margin-left: -45px;
}

.ek-card-3 .image-container .image {
    opacity: 1;
    box-shadow: 2px 5px 8px rgba(34, 35, 58, 0.2);
    width: 10em;
    height: 6em;
    border-radius: 11%;
}

.ek-card-3 .content {
    opacity: 1;
    transform: none;
}

.ek-card-3 .content .code {
    color: #88888a;
    margin-bottom: 10px;
    display: block;
    font-weight: 700;
}
.ek-card-3 .content .text {
    color: #7b7992;
    display: block;
    font-weight: 500;
}

.ek-card-3 .content .title {
    font-weight: 700;
    margin: 15px 0px 5px 0px;
}
.ek-card-3:hover{
    border-right :5px solid #3963a2fc;
    box-shadow: 6px 6px 8px 1px rgba(34, 35, 58, 0.2);
    cursor: pointer;
}
.ek-card-3 .tag{
    width: 55px;
    height: 40px;
    background-color: #3963a2fc;
    position: absolute;
    right: -5px;
    color: white;
    padding: 5px 13px;
    margin-top: 35px;
    border-radius: 47% 0% 0% 47%;
    text-align: center;
    font-weight: 600;
    line-height: 1;
}

.ek-card-4 {
    border: 1px solid #0000001c;
    border-radius: 10px;
    padding: 15px;
    margin-bottom: 10%;
    box-shadow: 0 0 10px 2px #0000001c;
}

.ek-card-4 .title{
    margin-bottom: 5%;
    font-size: 18px;
    font-weight: bold;
}
.ek-card-4 .content{
    margin-bottom: 5%;
    font-weight: 600;
    text-align: center;
}
.ek-card-4 .tag{
    position: absolute;
    min-width: 35px;
    right: 10%;
    background-color: #5cb85c;
    margin: 0 auto;
    padding: 3px;
    color: white;
    top: 0;
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    border-radius: 0% 0% 25% 25%;
}
.ek-card-4 .date {
    color: #a2a2a5eb;
    font-weight: 600;
    margin-bottom: 2%;
    font-size: 13px;
}
.flex-wrap{
    display: flex;
    flex-wrap: wrap;
}

.ek-card-4 .sections .title{
    color: gray;
    font-size: 12px;
    font-weight: 600;
}
.ek-card-4 .sections .value{
    font-weight: bold;
}
.ek-card-4 .sections{
    margin-bottom: 2%;
}
.ts-img{
    border-radius: 5px;
    width: 150px;
    height: 75px;
}
.a-test:hover{
    cursor: pointer !important;
    color: #23527c !important;
}
.a-test{
    color: #337ab7 !important;
    text-decoration: none !important;
}
.p-content >div{
    line-height:2;
}

.ebook-card-details p {
    font-size: 12px;
}
.data-not-found{
    background: url('/ots-std/images/data-not-found.jpg') no-repeat center center;
    width: 100%;
    height: 100vh;
    background-size: contain;
    background-color: #fff;
}



/* apple-them-spcl */
.pd-15{
}
.hm-side-bx{
    border:solid 1px rgb(205, 209, 211);
    border-radius: 4px;
}
.hm-side-bx img{
    max-width: 100%;
}
.hm-ex-links ul{
    margin-top: 15px;
    list-style: none;
    padding: 0px;
}
.hm-ex-links ul li{
    margin-bottom: 10px;
}
.key-cards .key-card{
    background: white;
    padding: 15px;
    font-size: 18px;
    border-radius: 8px;
    margin-top: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-decoration: none;
    color: #fff!important;
    /* width: calc(100% - 10px);
    height: 80px;
    border-radius: 10px; */
    /* margin: 5px; */
    background-image: linear-gradient(to left, #667eea 0%, #764ba2 100%);
    /* padding: 10px; */
    position: relative;
    width:160px;
    height: 80;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
    box-shadow: 2px 2px 2px #d6d6d6;
}
.key-cards .key-card:hover{
    color: #007cd4;
    box-shadow: 2px 2px 2px 0px #e0e0e0;
}
.key-cards .key-card:hover i{
    border-color: #949b9e;
}
.key-card i{
    width: 50px;
    height: 50px;
    border: solid 3px #fff;
    border-radius: 50px;
    text-align: center;
    line-height: 46px;
    color: #fff!important;

    /* position: absolute;
    right: 15px;
    top: 20px; */
}
.profile-pic{
    text-align: center;
    padding:15px;
}
.profile-pic img{
    max-width:80%;
}

.bg-outline-grey.link {
    border: 1px solid #efe9e9;
    border-radius: 4px;
    color: #717986 !important;
}

.w-30{
    width: 30px;
}
/* 
.assignment-card-container{
    display: flex;
    flex-flow: wrap;
}

.assignment-card-container .assignment-card{
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
    max-width: 300px;
    margin: auto;
    text-align: center;
    font-family: arial;
    position: relative;
}

.assignment-card-container >.assignment-card> .assignment-card-body {
    width: 100%;
    float: left;
    background: #f7f9fb;
    padding: 5px;
    box-shadow: #ece8e8 1px 2px 6px 1px;
}

.assignment-card-item{
    flex-direction: row;
    padding: 5px;
    min-width: 24.2%;
    margin-right: 9px;
    max-width: 24.2%;
    flex: 1;
    margin-bottom: 10px;
}
 
.assignment-card .assignment-card-head>h3{

} */


.assigment-card{
    background: #f8f8f8;
    border-radius: 5px;
}
.assigment-card>h3{
    padding: 0;
    margin: 0;
    font-size: 1.5em;
}

.assigment-card>p{
    font-size: 11px;
}


.ek-tabs{
    position: relative;
}

ul.ek-tab-list{
    list-style: none;
    padding: 0;
    margin: 0 auto;
    padding-bottom: 10px;
    border-bottom: 1px solid #e8e8e8;
    position: relative;
    margin-bottom: 2px;

}

ul.ek-tab-list>li{
    display: inline-block;
    /* border: 1px solid #e8e8e8; */
    border-radius: 3px;
}
ul.ek-tab-list>li>a{
    padding: 10px 15px;
    line-height: 2;
    border: 1px solid #e8e8e8;
    border-radius: 3px;
    text-decoration: none;
    color: #0ac8e0;
    font-weight: 600;
}
ul.ek-tab-list>li:hover a{
    background: #0ac8e0;

    color: #fff!important;
}

a.active-tab {
    background: #0ac8e0;
    color: #fff!important;
}

.bg-white {
    background: #fff;
    width: 100%;
    padding: 15px;
    box-shadow: 1px 5px 5px 4px #d1cdcde8;
}
.key-card-bg{
    position: absolute;
    left: 0px;
}
.bg-vital-ocean{
    /* background: linear-gradient(90deg, #1CB5E0 0%, #000851 100%) !important;
    color: #fff !important; */
}

.bg-kale-salad{
    color: #fff !important;
    background: linear-gradient(90deg, #00C9FF 0%, #92FE9D 100%) !important;
}
.bg-disco-club{
    color: #fff !important;
    background: linear-gradient(90deg, #FC466B 0%, #3F5EFB 100%) !important;
}

.bg-shady-lane{
    background: linear-gradient(90deg, #3F2B96 0%, #A8C0FF 100%) !important;
    color: #fff !important;
}

.bg-retro-wegan{
    background: linear-gradient(90deg, #FDBB2D 0%, #22C1C3 100%)!important;
    color: #fff !important;
}

.bg-fresco-crush{
    background: linear-gradient(90deg, #FDBB2D 0%, #3A1C71 100%) !important;
    color: #fff !important;
}
    
.key-cards .key-card.video-course {
background-image: linear-gradient(120deg, #74a4f3 0%, #8ccdec 100%);
 }
 
.key-cards .key-card.online-test {
background-image: linear-gradient(to right, #f78ca0 0%, #f9748f 19%, #fd868c 60%, #fe9a8b 100%);
 }
 
.key-cards .key-card.discussion {
background-image: linear-gradient(to left, #ffb678 0%, #f18d41 100%);
 }
 
.key-cards .key-card.daily-quiz {
background-image: linear-gradient(to left, #8093e0 0%, #b761f1 100%);
 }
 
.key-cards .key-card.booster {
background-image: linear-gradient(to left, #5de0dc 0%, #33B5B1 100%);
 }
 
.key-cards .key-card.forum {
background-image: linear-gradient(to left, #4ee47a 0%, #2abd55 100%);
 }
 .key-card span {
    font-size: 15px;
}
.key-card span b {
    font-size: 18px;
}



/*pdf-card  */


.pdf-card {
    padding: 3px;
    box-shadow: 3px 2px 3px 1px #9FA8DA;
    border-radius: 3px;
    width: 70%;
    float: left;
    margin-top: 10px;
    margin-bottom: 10px;
}

.pdf-card a{
    text-decoration: none !important;
}
.live-content .live-zoom-bx{
    color: white;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    height: 260px;
    background-color: #808080;
}
.live-content .live-zoom-bx img{
    width: 120px;
}
.live-content .live-zoom-bx span{
    font-size: 20px;
}
.live-content .live-info{
    padding:30px;
}
.live-content .live-info>p{
    display: flex;
    justify-content: space-between;
}
.live-content .live-info>p.alignC{
    margin-top: 30px;
    display: block;
}

.shadow{
    box-shadow: 3px 2px 3px 1px #dcdde1;
}


.bg-light-blue,.rating-row {
    background-color: #e9e9ff;

}

.rating-row .ui-rating{
    margin-top: 8px;
}


.lesson-feedback-options .option.rating-option {
    margin-right: 10px;
}

.lesson-feedback-options-row{
    flex-flow: row;
}
.badge-success{
    background: #4CAF50;
    color: white;
}
.badge-primary{
    background-color: #337ab7;
    color: white;
}
.instruction_area span{
    background: url("../images/questions-sprite.png") no-repeat scroll 0 0 transparent;
    color: #FFFFFF;
    cursor: pointer;
    float: left;
    font-weight: bold;
    height: 38px;
    line-height: 42px;
 	 margin: 3px;
    text-align: center;
    width: 34px;
}
.instruction_area span.answered {
    background-position: -5px -48px;
}
.instruction_area span.review {
    background-position: -72px -48px;
}
 .instruction_area span.review_answered {
    background-position: -169px -47px;
} 
.instruction_area span.review_answered {
	background-position: -6px -81px;
}
.instruction_area span.review_marked {
	background-position: -169px -49px;
}
.instruction_area span.not_answered {
    background-position: -39px -48px;
}
.instruction_area span.not_visited {
    background-position: -105px -49px;
    color: #474747;
}