.page-title {
    font-family: BYekan !important;
    font-size: 30px;
}

body {
    font-family: BYekan !important;
    font-size: 14px;
}

* > i.fa {
    font-family: FontAwesome !important;
}

a:hover {
    color: #0e8dd4;
}

.fa {
    font-family: FontAwesome !important;
}

.justify-center {
    justify-content: center;
}


.mce-ico {
    font-family: tinymce, Arial !important;
}

.float-right {
    float: right;
}

/*** Alert ***/
.azma-alert .alert {
    font-weight: bold;
    margin: 0 0 27px 0;
    padding: 0;
    display: flex;
    justify-content: space-between;
    border: transparent;
}

.azma-alert .alert button {
    text-align: center;
}

.change-password-result .alert {
    padding: 15px;
}

.alert-info {
    background-color: #dadbdf;
    color: black;
    border: none;
}

.azma-alert .alert-default {
    background-color: #dadbdf;
    color: black;
    border: 1px solid #8b898a;
}

.azma-alert .alert-default-title {
    padding: 18px 0 17px 0;
    background-color: #8b898a;
    color: white;
    font-size: 13px;

}

.azma-alert .alert-info-title {
    padding: 17px 0 17px 0;
    background-color: #8b898a;
    color: white;
    font-size: 13px;
    border: 1px solid #8b898a;
    height: auto;
    align-items: center;
}

.azma-alert .alert-warning-title {
    padding: 19px 0 17px 0;
    background-color: #f2c873;
    color: white;
    font-size: 13px;
    border: transparent;
    align-items: center;
}

.azma-alert .alert-danger-title {
    padding: 18px 0 17px 0;
    background-color: #d39292;
    color: white;
    font-size: 13px;
}

.azma-alert .alert-success-title {
    padding: 18px 0 17px 0;
    background-color: #a4d491;
    color: white;
    font-size: 13px;
}

.close {
    margin-left: 10px;
}

.guide {
    font-size: 14px;
    font-weight: normal;
}

.azma-alert .alert-default-body {
    padding: 8px 10px 10px 0;
    color: #555;
    border: 1px solid #000000;
    vertical-align: middle;
    display: flex;
    align-items: center;
    border-right: none;
    background-color: #e6e6e6;
}

.azma-alert .normal {
    border-right: 1px solid #000000;
}

.azma-alert .alert-link {
    color: #0e8ed5 !important;
}

.azma-alert .debtor {
    margin: 0 10px 0 10px;
}

.message-notification .dashboard-stat {
    background-color: #8b898a;
    border-top: 5px solid #0e8dd4;
}

.message-notification .dashboard-stat .details {
    position: unset;
}

.message-notification .dashboard-stat .details .desc {
    text-align: center;
    vertical-align: middle;
    line-height: 55px;
}

.message-notification .dashboard-stat .visual i {
    font-size: 50px;
    line-height: 50px;
    color: #fff;
}

.message-notification .dashboard-stat .visual {
    display: block;
    float: left;
    /*padding-left: 10px;*/
    padding: 0 0 0 10px;
    text-align: center;
    vertical-align: middle;
    line-height: 0px;
    height: 0;
    font-size: 32px;
    margin-left: 15px;
}

.message-notification .dashboard-stat .more {
    background-color: #dcdcdc;
    color: #000000;
    text-align: center;
    vertical-align: middle;
    line-height: 25px;
}

.message-notification .dashboard-stat .more .m-icon-swapleft {
    color: #868686;
    text-align: center;
    vertical-align: middle !important;
    line-height: 30px;
    font-size: 32px;
    float: left;
    margin-left: 35px;
    transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -o-transform: rotate(180deg);
}

/*Media*/
.media-holder {
    margin-top: 50px;
}

.azma-panel .azma-video {
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.75);
}

.video-player {
    display: flex;
    flex-direction: row;
}

.video-title {
    margin-top: 0;
    color: #4c4c4c;
    font-size: 22px;
    font-family: BYekan !important;
    margin-bottom: 15px;
}

.media-description {
    color: #4c4c4c;
    width: 100%;
    overflow: auto;
}

.audio {
    color: #555;
    margin-top: 70px;
    padding: 30px 50px 50px 50px;
    background-color: #ffe6e9;
    -webkit-box-shadow: 0 5px 8px -6px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 5px 8px -6px rgba(0, 0, 0, .2);
    box-shadow: 0 5px 8px -6px rgba(0, 0, 0, .2);
}

.audio-player {
    width: 100%;
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.75);
}

.azma-video {
    height: 100%;
}

.download-pdf a {
    color: #000000;
}

.download-pdf a:hover {
    color: #0e8dd4;
}

/*** User Info ***/
.azma-panel .azma-info {
    margin-top: 50px;
}

fieldset.scheduler-border {
    border: 3px solid #0e8dd4 !important;
    padding: 0 20px 40px 20px !important;
    margin: 0 0 1.5em 0 !important;
    border-radius: 5px;
}

fieldset.calendar {
    border: 3px solid #0e8dd4 !important;
    padding: 0 35px 35px 35px !important;
    margin: 0 7px 1.5em 0 !important;
    border-radius: 5px;
    width: 49%;
}

.legend.scheduler-border {
    margin: -13px auto 16px;
    text-align: center;
}

.legend.scheduler-border span {
    font-size: 15px;
    font-weight: bold;
    padding: 0 20px 0 26px; /* To give a bit of padding on the left and right */
    line-height: 23px;
    display: inline-block;
    background: #FFF; /*url(../../images/icon/square.png) no-repeat -1px center;*/
    position: relative;
}

.legend.scheduler-border span:after {
    content: "";
    width: 11px;
    height: 11px;
    position: absolute;
    left: -1px;
    top: 6px;
    background: #0e8dd4;
    transform: rotate(45deg);
}

.azma-content-info {
    padding: 20px 30px;
    margin-top: 8px;
    /*border: 1px solid #f3f3f3;*/
    /* border-radius: 5px !important; */
    background-color: #f3f3f3;
}

.flex-container {
    display: flex;
    flex-flow: row wrap;
}

.side {
    font-size: 1rem;
    font-weight: bold;
}

/* Main column */
.main {
    text-align: center;
    padding: 14px 0;
}

.azma-content-image {
    padding-bottom: 5px;
    text-align: center;
}

.azma-content-image img {
    width: 100%;
    height: 274px;
}

.azma-content-user-info {
    padding: 0;
    margin-top: 5px;
}

.azma-content-user-info:first-child {
    margin-top: 0;
}

.azma-content-user-info-title {
    background-color: #dad8d9;
    color: #717171;
    padding: 14px;
    margin-right: 0;
    flex-basis: 35%;
    font-size: 16px;
}

.azma-content-user-info-body {
    color: #555;
    background-color: white;
    flex-basis: 65%;
}

/*Current Semester*/
.current-semester-info {
    padding: 5px;
}

.current-semester-content-info {
    background-color: #dad8d9;
    margin-left: 0;
    padding: 0;
    margin-top: 5px;
}

.current-semester-content-info-title {
    background-color: #dad8d9;
    color: #717171;
    padding: 14px 5px;
    margin-right: 0;
    flex-basis: 35%;
    font-size: 16px;
}

.current-semester-content-info-body {
    color: #555;
    background-color: #f3f3f3;
    flex-basis: 65%;
}

/*Notice*/
.notice {
    margin-top: 50px;
    padding: 15px;
    background-color: #fafafa;
    border-right: 25px solid #7f7f84;
    margin-bottom: 10px;
    -webkit-box-shadow: 0 5px 8px -6px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 5px 8px -6px rgba(0, 0, 0, .2);
    box-shadow: 0 5px 8px -6px rgba(0, 0, 0, .2);
    color: #555;
}

.notice-danger {
    border-right-color: #0e8dd4;
}

.notice-warning {
    border-right-color: #e19004;
}

.notice-info {
    border-right-color: #0092da;
}

.notice-success {
    border-right-color: #2ca42e;
}

.notification-header {
    font-size: 16px;
    font-weight: 300;
    background-color: #eeeeee;
    padding: 5px 0;
    margin-bottom: 5px;
}

.notification-header .close {
    float: left;
}

.notification-footer {
    font-size: 10px;
    margin-top: 20px;
}

.notice-link {
    font-family: BYekan !important;
    font-weight: normal;
    font-style: normal;
    margin-top: 10px;
    background-color: #0e8dd4;
    padding: 10px 40px;
}

.notice-link-danger:hover,
.notice-link-danger:active,
.notice-link-danger:focus {
    background-color: #145396;
}

.notice-link-success {
    font-family: BYekan !important;
    font-weight: normal;
    font-style: normal;
    margin-top: 10px;
    background-color: #3c763d;
    padding: 10px 70px;
}

.notice-link-success:hover,
.notice-link-success:active,
.notice-link-success:focus {
    background-color: #2b552b !important;
}

/*Announcements*/
.azma-content-announcements {
    background-color: #dff5ff;
    padding: 0;
    margin: 15px 0 0 0;
    border: 0 white;
    border-radius: 5px !important;
    color: #555;
}

.announcement-link {
    color: #555;
}

.announcements-title {
    padding: 20px 10px 0 0;
    margin-right: 0;
    border-radius: 0 6px 6px 0 !important;
}

.announcements-body {
    padding: 20px;
    background-color: #f3f3f3;
    border-radius: 5px 0 0 5px !important;
}

.announcement-audio {
    width: 100%;
}

.azma-content-announcements:hover {
    -webkit-box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.10);
    -moz-box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.10);
    box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.10);
    border-radius: 5px !important;
    background-color: #0e8dd4;
    cursor: pointer;
    color: white;
}

.azma-content-announcements:hover .announcements-title {
    color: white;

}

.azma-content-announcements:hover .announcements-body {
    background-color: white;
    border-radius: 5px 0 0 5px !important;
    color: #555;
}

.certificate-title {
    height: 15px;
    border-bottom: 1px solid #c1c1c1;
    text-align: center;
    margin-top: 70px;
}

.certificate-title span {
    font-size: 20px;
    background-color: #ffffff;
    padding: 0 10px;
}

.certificate-tracking-code {
    background-color: #f3f3f3;
    padding: 0;
    margin: 70px 0;
    border: 0 white;
    border-radius: 5px !important;
    color: #555;

}

.certificate-tracking-code div input {
    border-radius: 0 6px 6px 0 !important;
    height: 100%;
    background-color: #f3f3f3;
}

.certificate-tracking-code .certificate-tracking-code-title {
    padding: 20px;
    background-color: #0e8dd4;
    border-radius: 5px 0 0 5px !important;
    color: #ffffff;
}

.certificate-tracking-code .certificate-tracking-code-title:focus,
.certificate-tracking-code .certificate-tracking-code-title:hover {
    background-color: #ed2c3c;
    color: White;
}

div.tracking-organization-image {
    border: 10px solid #ffffff;
    margin-bottom: 10px;
    border-radius: 5px !important;
}

div.tracking-organization-image:hover {
    border-color: #e6e6e6;
}

div.tracking-organization-image img {
    width: 100%;
    height: 100px;
}

div.tracking-organization-desc {
    padding: 15px;
    text-align: center;
    background-color: #ffffff;
}

.tracking-organization {
    padding: 0 6px;
    float: right;
    width: 24.99999%;
}

.tracking-organization-image a {
    color: #000000;
}

.send-certification {
    margin: 50px 0;
}

.send-certification a {
    background-color: #4c4c4c;
    color: white;
    padding: 10px 20px;
    font-size: 15px;
    /*margin-bottom: 20px;*/
}

.send-certification button {
    background-color: #333333 !important;
    color: #ffffff;
}

.send-certification button:hover {
    background-color: #333333 !important;
}

.announcement-article {
    /*display: flex;*/
    /*flex-direction: column;*/
    align-items: center;
    justify-content: center;
    background-color: #ffffff;
    padding: 20px;
    border-radius: 15px !important;
    -webkit-box-shadow: 0px 0px 5px -1px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px 0px 5px -1px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 0px 5px -1px rgba(0, 0, 0, 0.75);
    margin-bottom: 20px;
}

.announcement-article .head {
    display: flex;
    justify-content: space-between;
}

.announcement-article .head h4 {
    font-family: BYekan !important;
}

.announcement-article .head h5 {
    padding-top: 15px;
    color: grey;
}

.announcement-article a {
    color: #0e8dd4;
}

.announcement-article a:hover {
    color: #145396;
}

/*Change Password Page*/
.change-password {
    padding: 0 10px;
}

.input-flex {
    display: flex;
    width: 100%;
}

.change-pass-label {
    font-family: BYekan !important;
    background-color: #4c4c4c;
    color: white;
    min-width: 25px;
    text-align: center;
    padding: 0.7em;
    flex: 50%;
}

.change-pass-input {
    flex: 1;
    border: 1px solid #e3e3e3;
    display: flex;
    align-items: center;
}

/*Reserve*/
.reserve {
    padding: 0 15px;
    margin-top: 20px;
}

.reserve-label {
    font-family: BYekan !important;
    background-color: #4c4c4c;
    color: white;
    min-width: 25px;
    text-align: center;
    padding: 0;
    line-height: 40px;
    flex: 50%;
    /*margin-left: 10px;*/
    vertical-align: middle;
    white-space: nowrap !important;
}

.reserve .form-control .select2-choice {
    background-color: #ffffff;
    color: #bcbfbf;
}

.select2-container .form-control .select2-container-active .select2-choice .select2-chosen {
    color: red !important;
}

.reserve .form-control.select2-container {
    padding: unset;
    margin-bottom: 5px;
}

/*Profile*/
.user-profile {
    background-color: #e6e6e6;
    margin-top: 10px;
    padding: 40px;
}

.profile-label::before {
    background: url("/images/icon/require.png") no-repeat center center;
    content: '';
    position: absolute;
    height: 1em;
    width: 1em;
    right: 2em;
    margin-top: 1px;
    vertical-align: middle;
}

.profile-label {
    padding: 20px 32px 20px 20px;
    color: #145396;
    font-size: 15px;
}

.user-profile .tab-content {
    background-color: white;
    padding: 30px 12px 30px 20px;
    margin: -10px 1px 0 0;
}

.user-profile-datepicker {
    background: #eee url(/assets/img/icon-calendar.png?1) no-repeat 12px center;
    padding-left: 32px !important;
}

.nav-tabs-res {
    display: flex;
    width: 85%;
}

.nav-tabs-res li {
    display: flex;
    flex: 1;

}

.nav-tabs-res li a {
    flex: 1
}

.nav-tabs > li.title > a {
    color: #3d3d3d;
}

.nav-tabs, .nav-pills {
    text-align: center;
}

.nav-tabs > li.title.active > a,
.nav-tabs > li.title.active > a:hover,
.nav-tabs > li.title.active > a:focus {
    font-weight: bolder;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    color: #0e8dd4;
    border-top: 3px solid #0e8dd4;
}

.calendar > li.title > a {
    color: #3d3d3d;
}

.calendar > li.title.active > a,
.calendar > li.title.active > a:hover,
.calendar > li.title.active > a:focus {
    font-weight: bolder;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    color: #0e8dd4;
    border-top: 3px solid #0e8dd4;
}

.profile-user-info {
    margin-top: 10px;
    margin-right: 10px;
}

.profile-user-info .user-label {
    font-family: BYekan !important;
    background-color: #a5a5a5;
    border: 1px solid #a5a5a5;
    color: white;
    text-align: center;
    height: 40px;
    font-weight: bold;
    margin-bottom: 10px;
    vertical-align: middle;
    box-sizing: border-box;
    min-width: 25px;
    padding: 0.7em;
    flex: 60%;
    font-size: 13px;
}

.required-label {
    background: url("/images/icon/require.png") no-repeat center center;
    position: absolute;
    height: 9px;
    width: 9px;
    right: 0;
    margin-top: 14px;
    vertical-align: middle;

}

.user-status-label {
    height: 39px !important;
}

.user-status .btn-group label {
    padding: 10px 9px 12px 9px;
    background-color: #ebebeb;
    width: 50%;
}

.user-status div.btn-group {
    position: relative;
    display: block;
    vertical-align: middle;
    padding: 0 !important;
    margin-bottom: 10px;
}

.user-status div.btn-group .btn {
    font-size: 11px;
}

.btn-default.active, .btn-default:active, .btn-default:focus, .btn-default:hover, .open .dropdown-toggle.btn-defaul {
    background-color: #bfbfbf !important;
    color: #ffffff;
}

.has-error [data-toggle="buttons"] {
    padding: 0 !important;
    box-shadow: 0 0 0 1px #145396;
}

.input-flex .address-info {
    font-size: 10px;
}

.profile-user-info .input {
    padding: 8px 18px;
    margin-right: 0;
    background-color: #ebebeb;
    box-sizing: border-box;
    flex: 1;
    display: flex;
    align-items: center;
    min-height: 40px;
}

label.notrequired:before { /* Chrome, Firefox, Opera, Safari 10.1+ */
    content: "";
    color: black;
    padding-left: 5px;
    vertical-align: middle;
    margin: auto;
    font-size: 15px;
    font-weight: bold;
    font-family: "Times New Roman", Times, serif;
}

.no-margin {
    margin: 0 !important;
}

.no-padding {
    padding: 0 !important;
}

.padding-unset {
    padding: unset !important;
}

.btn-group, .btn-group-vertical {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    /*padding: 3px;*/
}

/*Uesr Image*/
.user-image {
    margin-bottom: 10px;
    padding-right: 20px;
}

.user-image p {
    text-align: center;
    font-size: 15px;
    color: #797979;
}

.user-image .btn-file {
    background-color: #797979 !important;
    font-weight: bold;
}

.user-image .fileinput {
    background-color: #797979 !important;
    border: 5px solid #797979;
}

.user-image .fileinput:hover {
    background-color: #4c4c4c !important;
    border: 5px solid #4c4c4c;
    -webkit-box-shadow: 10px 10px 5px -10px rgba(0, 0, 0, 0.50);
    -moz-box-shadow: 10px 10px 5px -10px rgba(0, 0, 0, 0.50);
    box-shadow: 10px 10px 5px -10px rgba(0, 0, 0, 0.50);
}

.user-image .fileinput:hover .btn-file {
    background-color: #4c4c4c !important;
}

.user-image button {
    padding: 10px 40px;
    font-weight: bold;
}

.form-control .select2-choice {
    border: 1px solid #bcbcbc;
    background-color: #ebebeb;
    filter: none;
    height: 40px;
    padding: 3px 12px 0 0;
    box-sizing: border-box;
}

/*User Message*/
.inbox .inbox-nav li.compose-btn a {
    background-color: #d4d4d4;
    color: #4c4c4c;
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 0;
    padding: 7px;
    text-align: center !important;
}

.inbox .inbox-nav li.compose-btn a strong {
    font-size: 11px;
}

.inbox-nav a {
    /*font-size: 11px !important;*/
}

.inbox .inbox-nav li.compose-btn a:hover {
    background-color: #eee !important;
}

.inbox .inbox-nav li:hover a {
    background: #eee !important;

}

.inbox .inbox-nav li.active a, .inbox .inbox-nav li.active:hover a {
    color: #4c4c4c;
    background: white !important;
    text-align: center;
}

.input-group-btn:last-child > .btn, .input-group-btn:last-child > .btn-group {
    background-color: #4c4c4c !important;
}

.input-group-btn:last-child > .btn, .input-group-btn:last-child > .btn-group i {
    background-color: #4c4c4c !important;
}

.btn.grey:hover, .btn.grey:focus, .btn.grey:active, .btn.grey.active, .btn.grey.disabled, .btn.grey[disabled] {
    background-color: #4c4c4c !important;
    color: #fff !important;
    outline: none !important;
}

.inbox ul.inbox-nav i {
    color: #fff;
    padding: 1px 0;
    font-size: 20px;
    cursor: pointer;
    background: #4c4c4c !important;
}

.inbox ul.inbox-nav li {
    padding: 0;
    margin-bottom: 9px;
    /*margin-right: 1px;*/
}

.inbox .table th {
    background: #4c4c4c;
    border: solid 1px #fff;
    color: white;
}

.star-icon {
    color: gold;
}

.inbox-compose-btn {
    background: #4c4c4c;
}

.view-message {
    background: #e6e6e6;
    height: 40px;
    line-height: 35px;
}
.view-message:hover .mark-as {
    border: 1px solid #cc3c31;
}
.view-message a {
    display: flex;
    flex-direction: row;
}

.btn-info {
    color: #fff;
    background-color: #4c4c4c;
    border-color: #4c4c4c;
}
.message-table tr td {
    cursor: default !important;
}

.btn-info:hover {
    color: #fff;
    background-color: #bcbcbc;
    border-color: #bcbcbc;
}

table.table {
    width: 100%;
}

.inbox .table-striped tbody > tr:nth-child(even) {
    background-color: #e6e6e6;

}

.inbox .table-striped tbody > tr:nth-child(odd) {
    background-color: #f9f9f9;

}

.inbox .table-striped tbody tr td {
    border: 1px solid #afabac;

}

.user-checkbox {
    height: 20px;
}

.inbox .pagination-control {
    text-align: center;
}

.inbox .pagination-control a {
    background-color: transparent;
}

.inbox .pagination-control a:hover,
.inbox .pagination-control a span:hover {
    background-color: transparent;
    color: #0e8dd4;
}

.inbox-paginate {
    vertical-align: middle;
    padding-top: 40px;
}

.inbox-paginate ul li span,
.inbox-paginate ul li a {
    font-family: Arial, Tahoma;
}

.inbox-paginate .pagination > li > a, .inbox-paginate .pagination > li > span {
    position: relative;
    float: right;
    padding: 6px 12px;
    margin-right: -1px;
    line-height: 1.42857143;
    color: #626061;
    text-decoration: none;
    background-color: #fff;
    border: none;
}

.inbox-paginate .pagination > .active > a, .inbox-paginate .pagination > .active > a:focus,
.inbox-paginate .pagination > .active > a:hover, .inbox-paginate .pagination > .active > span,
.inbox-paginate .pagination > .active > span:focus, .inbox-paginate .pagination > .active > span:hover {
    color: #0e8dd4;
    background-color: transparent;
    border: 1px solid #0e8dd4;
    border-radius: 50% !important;
}

.inbox-paginate .pagination > li > a,
.inbox-paginate .pagination > li > span {
    float: left;
}

.inbox-paginate .pagination > li:first-child,
.inbox-paginate .pagination > li:last-child {
    display: none;
}

.search {
    color: #ffffff;
}

.pagination-text {
    color: black;
    font-weight: bold;
}

.help-block, p.help-block {
    font-family: Tahoma, Arial;
    font-size: 11px;
    color: #145396;
}

.inbox-compose-btn button {
    background-color: #e6e6e6;
    margin: 5px 0 5px 5px;
    padding: 5px;
    color: #4c4c4c;
    width: 100%;
}

.inbox-compose-btn button:hover {
    background-color: #145396;
}

.inbox-compose-btn .send-btn {
    background-color: #0e8dd4;
    color: #ffffff;
}

.inbox-compose-btn .send-btn:hover {
    background-color: #145396;
}

/*Calendar*/
.inbox .calendar li.compose-btn a {
    font-size: 13px;
    text-align: center !important;
}

.flex {
    display: flex;
    width: 100%;
}

.flex-col {
    flex-direction: column;
}

.calendar .flex {
    vertical-align: center;
    align-items: center;
}

.calendar .calendar-title {
    background-color: #f3f3f3;
    font-size: 12px;
    padding: 12px 12px 11px 12px;
    margin-top: 5px;
    margin-left: 2px;

}

.calendar .body {
    background-color: #f3f3f3;
    padding: 10px;
    margin-top: 5px;
    margin-right: 2px;

}

/*Transaction*/
table.transaction {
    margin-top: 30px;
}

.transaction > tbody > tr:nth-child(2n+1) > th {
    background-color: #4c4c4c;
    color: #ffffff;
}

.transaction p, table tr {
    background-color: #f6f6f6;
    color: #1e1f21;
}

.transaction > tbody > tr:nth-child(2n+1) > td {
    background-color: #e0e0e0;
    color: #1e1f21;
}

.transaction > tbody > tr td a {
    color: #000000;
}

.transaction, .transaction > tbody > tr > td,
.transaction > tbody > tr > th, .transaction > tfoot > tr > td,
.transaction > tfoot > tr > th, .transaction > thead > tr > td,
.transaction > thead > tr > th {
    border: 1px solid #fff;
}

/*Refund*/
.refund-info {
    margin-top: 15px;
    padding: 5px;
}

.refund-content-info {
    padding: 0;
    margin-top: 10px;
}

.refund-content-info-title {
    background-color: #e3e3e3;
    color: #000000;
    padding: 15px 5px;
    margin-left: 5px;
    -webkit-box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.75);
    margin-right: 5px;
}

.refund-content-info-body {
    padding: 15px 5px;
    margin-right: 5px;
    color: #000000;
    background-color: #ffffff;
    -webkit-box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.75);
    margin-left: 5px;
}

.refund-request .alert {
    color: #000000;
}

.refund-label {
    background-color: #4c4c4c;
    color: #ffffff;
    padding: 10px;
    text-align: center;
}

.refund-reasons {
    padding: 0 10px 0 0;
}

.refund-reasons .select2-choice {
    border: 1px solid #bcbcbc;
    background-color: #ffffff;
    filter: none;
    height: 40px;
    padding: 3px 12px 0 0;
    box-sizing: border-box;
}

.refund-request form {
    position: relative;
}

.refund-info .flex-container {
    display: flex;
    flex-flow: row;
}

.pay-status {
    margin: 30px 0;
}

.reserve-box .finalprice {
    border: 2px solid #acacac;
    border-radius: 5px !important;
    border-top: none;
    margin-top: -1px;
}

.reserve-box .finalprice .payable {
    background-color: white;
    margin-top: 5px;
    border: 2px solid #CCCCCC;
}

.reserve-box .portlet.box.blue > .portlet-title,
.reserve-box .portlet.box.green > .portlet-title {
    background-color: #4c4c4c;
}

.reserve-box .portlet.box.green,
.reserve-box .portlet.box.blue {
    border: 1px solid #4c4c4c;
}

.msg-btn-mark {
    display: flex;
    flex-direction: row;
}

.message-star-icon i {
    color: #d1d1d1;
}

.message-star-icon i.inbox-with-star {
    color: gold !important;
}

.message-table thead tr th {
    vertical-align: middle;
}

.msg-back-btn {
    background-color: #f2f2f2;
    padding: 7px 10px;
    border-radius: 20px !important;
    margin-bottom: 15px;
    width: 35px;
}

.msg-back-btn a {
    color: #000000;
    padding: initial;
}

.msg-back-btn a:hover {
    color: #ffffff;
}

.msg-btn-txt {
    vertical-align: middle;
    margin-left: 5px;
    margin-top: 5px;
}

.msg-btn-forward {
    margin-left: 5px;
}

.msg-btn-forward i {
    margin-top: 5px !important;
}

.msg-btn-reply i {
    margin-top: 5px !important;
}

.certificate-tracking-code .transaction-search-icon {
    padding: 10px;
    background-color: #6e6e6e;
    border-radius: 5px 0 0 5px !important;
    color: #ffffff;
}

.certificate-tracking-code .transaction-search-icon i {
    font-size: 25px;
}

.certificate-tracking-code .transaction-search-icon:focus,
.certificate-tracking-code .transaction-search-icon:hover {
    background-color: #595959;
    color: White;
}

.transaction-filter {
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: space-between;
}

.transaction-filter:first-child {
    padding-right: 0;
}

.transaction-filter:last-child {
    padding-left: 0;
}

.transaction-filter label {
    background-color: #0e8dd4;
    margin-top: 5px;
    width: 60%;
    padding: 9px 0;
    color: #ffffff;
    text-align: center;
}

.transaction-filter .form-control {
    height: 35px;
    background-color: #f3f3f3;
}

.transaction-filter-date {
    border: 1px solid #bbbbbb;
    display: flex;
    background-color: #f3f3f3;
}

.transaction-filter-date input {
    border: none;
    width: 115px;
    background-color: #f3f3f3;
    font-size: 10px;
}

.transaction-filter-date span {
    background-color: #f3f3f3;
    align-items: center;
    justify-content: center;
    display: flex;
}

.transaction-filter-date-label {
    height: 37px;
}

.transaction-filter .form-control .select2-choice {
    height: 35px;
}

.filter-container .certificate-tracking-code {
    margin-bottom: 40px;
}

.refund-user-form {
    line-height: 35px;
}

.certificate-img {
    width: 10%;
    height: 10%;
}

.sub-certificate-img {
    width: 100%;
    height: 150px !important;
}

.sub-certificate {
    background-color: #e6e6e6;
    margin: 7px;
    padding: 15px;
}

.sub-certificate h4 {
    color: #0e8dd4;
}

.morecontent span {
    display: none;
}

.morelink {
    display: block;
}

#student-panel a {
    font-size: 14px;
}

.profile-user-image .table-responsive {
    margin-top: 20px;
}

.message-search {
    margin-bottom: 20px;
}

.message-star .btn-default {
    padding-bottom: 2px;
}

.btn-info:hover {
    background: #333333;
}

.pl-10 {
    padding-left: 10px;
}

.mr-7 {
    margin-right: 7px;
}

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

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

.azma-wizard {
    list-style: none;
    overflow: hidden;
    margin-right: -33px;
}

.azma-wizard li {
    position: relative;
    color: #555555;
    border: 1px solid #aaaaaa;
    padding: 10px 36px 10px 6px;
    float: right;
    margin-right: -1px;
}

.azma-wizard li::before {
    position: absolute;
    top: 9px;
    right: -4px;
    z-index: 1;
}

.azma-wizard div {
    position: relative;
    margin-left: 10px;
    margin-right: -18px;
}

.azma-wizard div::before {
    display: table-cell;
    content: "";
    width: 20px;
    height: 20px;
    position: absolute;
    top: 1px;
    right: -28px;
    background-color: white;
    border: 1px solid #aaaaaa;
    transform: rotate(45deg);
}

.azma-wizard .counter {
    position: absolute;
    z-index: 1;
    top: 10px;
}

.azma-wizard .counter::before {
    position: relative;
}

.azma-wizard .t1 {
    right: -4px;
}

.azma-wizard .t2 {
    right: -7px;
}

.azma-wizard li.active, .azma-wizard li.active div::before {
    background: #0e8dd4;
    color: white;
}

.azma-wizard li.disable, .azma-wizard li.disable div::before {
    background: #bbbbbb;
    color: white;
}

@media (min-width: 768px), (max-width: 767px) {
    .azma-wizard li {
        width: 100%;
        margin-bottom: 2px;
    }

    .azma-wizard div {
        font-size: 14px;
    }

    .azma-wizard .counter {
        top: 10px;
    }
}

/*@media (min-width: 992px) {*/
/*.azma-body.container {*/
/*width: 730px;*/
/*}*/

/*.azma-body.container.user-message {*/
/*width: 90%;*/
/*}*/

/*.azma-wizard li {*/
/*width: auto;*/
/*}*/

/*.azma-wizard div {*/
/*font-size: 10px;*/
/*}*/

/*.azma-wizard div::before {*/
/*top: -3px;*/
/*}*/

/*.azma-wizard .counter {*/
/*top: 6px;*/
/*}*/
/*}*/

/*@media (min-width: 1200px) {*/
/*.azma-wizard div {*/
/*font-size: 14px;*/
/*}*/

/*.azma-wizard div::before {*/
/*top: 1px;*/
/*}*/

/*.azma-wizard .counter {*/
/*top: 10px;*/
/*}*/

/*}*/

.azma-content-header {
    padding: 3px 10px;
    border: 1px solid #e3e3e3;
    background-color: #e3e3e3;
}

.azma-content-body {
    position: relative;
    padding: 10px;
    border: 1px solid #f3f3f3;
    background-color: #f3f3f3;
    margin-bottom: 20px;
}

.azma-content-body::before {
    display: table-cell;
    content: "";
    width: 20px;
    height: 20px;
    position: absolute;
    top: -12px;
    right: 10px;
    background-color: #0e8dd4;
    border: 1px solid white;
    transform: rotate(45deg);
}

.azma-content-header .counter {
    position: relative;
    color: white;
    z-index: 1;
    top: 13px;
}

.azma-content-header .counter::before {
    position: absolute;
}

.azma-content-header .t1 {
    right: 6px;
}

.azma-content-header .t2 {
    right: 2px;
}

.tab-next, .tab-prev {
    margin-top: 5px;
}

.tab-next {
    float: left;
}

.tab-prev {
    float: right;
}

.box-title {
    color: #0e8dd4;
    margin-bottom: -20px;
}

.top-bordered {
    border-top: 15px solid #555555;
}

.azma-table {
    width: 100%;
}

.azma-table > thead tr {
    background-color: #0e8dd4;
    color: white;
    padding: 10px;
}

.azma-table > thead.header tr {
    background-color: #555555;
    color: white;
    padding: 10px;
    cursor: pointer;
}

.azma-table th.header2nd {
    background-color: #555555 !important;
    color: white;
}

.azma-table th {
    padding: 10px 0;
    text-align: center;
}

.azma-table td {
    padding: 10px 5px;
    text-align: center;
}

.azma-table td.text-right {
    text-align: right;
}

.azma-table th div {
    padding: 5px 5px;
}

.cell-left-bordered {
    /* width: 100%; */
    border-left: 1px solid white;
}

.cell-right-bordered {
    /* width: 100%; */
    border-right: 1px solid white;
}

.azma-table > tbody > tr {
    border-bottom: 1px solid #eeeeee;
}

.azma-table > tbody > tr > td:nth-of-type(odd) {
    background-color: #dddddd;
}

.azma-table > tbody > tr > td:nth-of-type(even) {
    background-color: #cccccc;
}

.azma-table > tbody > tr.finalize-tuition td {
    background-color: rgba(70, 136, 71, 0.32);
}

.azma-table > tbody > tr.enter td {
    background-color: #f2f4ed;
}

.azma-table > tbody > tr.exit td {
    background-color: #f4eded;
}

.azma-table > tbody > tr.buy td {
    background-color: #f4f5ff;
}

.azma-table > tbody > tr.holiday td {
    background-color: #FFE7DD;
}

.azma-table > tbody > tr.absence td {
    background-color: #C1A8A8;
}

.azma-table > tbody > tr.vacation td {
    background-color: #DAE5DA;
}

.azma-table > tbody > tr.opposite td {
    background-color: #D3F7FF;
}

.azma-table > tbody > tr.free-field > td {
    background-color: #E7E3F7;
}

.confirmed {
    background-color: #56f073 !important;
}

.rejected {
    background-color: #0e8dd4 !important;
}

.azma-table textarea {
    resize: vertical;
    min-height: 30px;
    height: initial;
}

.open-more {
    transition: all 0.3s;
}

.open-more:hover {
    cursor: pointer;
}

.open-more.opened {
    transform: rotate(-90deg);
}

.more-info, .more-info > td {
    padding: 0;
}

.inner-table > thead > tr > th {
    background-color: #aaaaaa;
    color: white;
}

.inner-table > tbody > tr > td {
    background-color: #eeeeee;
}

.detail-subtitle {
    background-color: #cccccc;
}

.small-font {
    font-size: 12px;
}

.filter-item {
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: space-between;
}

.filter-item label {
    background-color: #0e8dd4;
    margin-top: 5px;
    width: 80px;
    padding: 9px 0;
    color: #ffffff;
    text-align: center;
}

.filter-item .form-control {
    height: 35px;
    background-color: #f3f3f3;
}

.filter-item .form-control .select2-choice {
    height: 35px;
}

.select2-chosen {
    font-size: 12px;
}

.res-table-sm .class-title {
    background-color: #4c4c4c;
    font-size: 12px;
    padding: 12px 12px 11px 12px;
    margin-left: 2px;
    color: #ffffff;
}

.res-table-sm .btn-warning {
    font-size: 12px;
    padding: 12px 12px 11px 12px;
    margin-left: 2px;
    color: #ffffff;
}

.res-table-sm .title {
    background-color: #0e8dd4;
    font-size: 12px;
    padding: 12px 12px 11px 12px;
    margin-left: 2px;
    color: #ffffff;
}

.edu-row:nth-child(odd) .body {
    background-color: #dddddd;
    padding: 12px 12px 11px 12px;
    font-size: 10px;
    margin-right: 2px;
    flex: 1;
}

.edu-row .btn-success {
    padding: 12px 12px 11px 12px;
    font-size: 10px;
    margin-right: 2px;
    flex: 1;
    color: #ffffff;
}

.edu-row .btn-info {
    padding: 12px 12px 11px 12px;
    font-size: 10px;
    margin-right: 2px;
    flex: 1;
    color: #ffffff;
}

.edu-row:nth-child(even) .body {
    background-color: #999999;
    padding: 12px 12px 11px 12px;
    font-size: 10px;
    margin-right: 2px;
    flex: 1;
    color: #ffffff;
}

.edu-row a {
    color: #0e8dd4;
}

.edu-row a:hover {
    color: #145396;
}

.text-red {
    color: red;
}

.text-blue {
    color: blue;
}

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

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

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

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

.mb-10 {
    margin-bottom: 20px;
}

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

.ml-5 {
    margin-left: 5px;
}

.ml-12 {
    margin-left: 12px;
}

.azma-dbox {
    padding: 25px 10px 15px;
    margin-bottom: 20px;
    background-color: #f5f5f5;
    -webkit-box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.2);
}

.azma-dbox:hover {
    -webkit-box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.20);
    -moz-box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.20);
    box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.20);
}

.azma-dbox .fa {
    color: #0e8dd4;
    font-size: 40px;
}

.azma-dbox.top-bordered {
    border-top: 10px solid #555555;
}

.azma-dbox .counter {
    float: left;
}

.dashboard-box {
    color: #0e8dd4;
}

.dashboard-box:hover {
    color: #145396;
}

.bg-grey-darkest {
    background-color: #3d4852;
}

.transaction-finance {
    padding: 20px;
    color: #ffffff;
}

.factor-head {
    background-color: #0e8dd4;
    padding: 15px;
    color: #ffffff;
    margin-bottom: -3px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.factor-body {
    border: 2px solid #acacac;
    border-radius: 5px !important;
    border-top: none;
    margin-top: -1px;
    padding: 25px;
}

.factor-body .factor-main .title {
    background-color: #acacac;
    color: #000000;
    text-align: center;
    height: 40px;
    font-weight: bold;
    margin-bottom: 10px;
    vertical-align: middle;
    box-sizing: border-box;
    min-width: 25px;
    padding: 0.7em;
    flex: 60%;
    font-size: 13px;
}

.factor-body .factor-main .body {
    background-color: #ffffff;
    padding: 8px 18px;
    margin-right: 0;
    box-sizing: border-box;
    flex: 1;
    display: flex;
    align-items: center;
    min-height: 40px;
}

.mt-25 {
    margin-top: 25px;
}

.store-reserve {
    border-radius: 5px !important;
}

.dashboard-pointer {
    margin-top: 25px;

}

.azma-dbox .pointer {
    font-size: 25px;
    color: #555555;
}

.dashboard-badge {
    background-color: #145396;
    color: #ffffff;
    font-size: 30px !important;
}

.student-badge {
    font-size: 15px !important;
    height: 30px;
    border-radius: 50% !important;
    padding: 2px 11px;
    background-color: #0e8dd4;
    float: left !important;
    margin-top: 93px;
    margin-left: -22px;
    color: #ffffff;
}

.hidden {
    display: none;
}

/* Pagination Begin */
.pgnation {
    display: inline-block;
    padding-right: 0;
    margin: 20px 0;
    border-radius: 4px
}

.pgnation > li {
    display: inline
}

.pgnation > li > a,
.pgnation > li > span {
    position: relative;
    float: right;
    padding: 6px 12px;
    margin-right: -1px;
    line-height: 1.42857143;
    color: #428bca;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd
}

.pgnation > li:first-child > a,
.pgnation > li:first-child > span {
    margin-right: 0;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px
}

.pgnation > li:last-child > a,
.pgnation > li:last-child > span {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px
}

.pgnation > li > a:focus,
.pgnation > li > a:hover,
.pgnation > li > span:focus,
.pgnation > li > span:hover {
    color: #2a6496;
    border-color: #ddd
}

.pgnation > .active > a,
.pgnation > .active > a:focus,
.pgnation > .active > a:hover,
.pgnation > .active > span,
.pgnation > .active > span:focus,
.pgnation > .active > span:hover {
    z-index: 2;
    color: #fff;
    cursor: default;
    background-color: #428bca;
    border-color: #428bca
}

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

.pgnation-ctrl a {
    background-color: transparent;
}

.pgnation-ctrl a:hover,
.pgnation-ctrl a span:hover {
    background-color: transparent;
    color: #0e8dd4;
}

.pgnation > li > a, .pgnation > li > span {
    position: relative;
    float: right;
    padding: 6px 12px;
    margin-right: -1px;
    line-height: 1.42857143;
    color: #626061;
    text-decoration: none;
    background-color: #fff;
    border: none;
}

.pgnation > .active > a, .pgnation > .active > a:focus,
.pgnation > .active > a:hover, .pgnation > .active > span,
.pgnation > .active > span:focus, .pgnation > .active > span:hover {
    color: #0e8dd4;
    background-color: transparent;
    border: 1px solid #0e8dd4;
    border-radius: 50% !important;
}

.pgnation > li > a,
.pgnation > li > span {
    float: left;
}

.pgnation > li > span {
    cursor: pointer;
}

/* Pagination End*/

.carousel-inner > .item > a > img, .carousel-inner > .item > img, .img-responsive, .thumbnail a > img, .thumbnail > img {
    display: unset;
    max-width: 100%;
    height: auto;
}

.edu-row.success > td,
.edu-row.success > th,
.edu-row.success > div {
    background-color: #dff0d8 !important;
}

.edu-row.success:hover > td,
.edu-row.success:hover > th,
.edu-row.success:hover > div {
    background-color: #d0e9c6;
}

.text-blue-darker {
    color: #145396;
}

.portlet.box.blue > .portlet-title {
    background-color: #145396;
}

.portlet.box.blue {
    border: 1px solid #145396;
    border-top: 0;
}

.blue {
    color: #145396;
}

.p-10 {
    padding: 10px;
}

.bg-danger {
    background-color: #f2dede !important;
}

.announcement-body {
    position: relative;
}

.bottom-shadow {
    position: absolute;
    height: 16px;
    bottom: 0;
    background-image: url('../../images/w-gradiant.png');
    width: 100%;
}

.media-carousel {
    margin-bottom: 0;
    /*padding: 0 40px 30px 40px;*/
    padding-bottom: 40px;
    margin-top: 30px;
}

/* Previous button  */
.media-carousel .carousel-control.left {
    /*left: -12px;*/
    background-image: none;
    background: none repeat scroll 0 0 #145396;
    border: 4px solid #FFFFFF;
    border-radius: 23px 23px 23px 23px !important;
    height: 40px;
    width: 40px;
    margin-top: 30px
}

/* Next button  */
.media-carousel .carousel-control.right {
    /*right: -12px !important;*/
    background-image: none;
    background: none repeat scroll 0 0 #145396;
    border: 4px solid #FFFFFF;
    border-radius: 23px 23px 23px 23px !important;
    height: 40px;
    width: 40px;
    margin-top: 30px
}

/* Changes the position of the indicators */
.media-carousel .carousel-indicators {
    right: 50%;
    top: auto;
    bottom: 0px;
    margin-right: -19px;
}

/* Changes the colour of the indicators */
.media-carousel .carousel-indicators li {
    background: #c0c0c0;
}

.media-carousel .carousel-indicators .active {
    background: #333333;
}

.media-carousel img {
    width: 250px;
    height: 100px
}

.w-full {
    width: 100%;
}


.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {
    padding: 8px;
    line-height: 1.428571429;
    vertical-align: top;
    border-top: none;
}

.mt-9 {
    margin-top: 9px;
}

.ml-10 {
    margin-left: 10px;
}

.navbar-res {
    background-color: #3d3d3d !important;
    background-image: url('../../assets/img/navbar-bg.png') !important;
    background-repeat: repeat !important;
}

.overflow-hidden {
    overflow: hidden;
}

.max-w-full {
    max-width: 100%;
}

.w-50 {
    width: 50%;
}

.p-5px {
    padding: 5px;
}

.p-r-8 {
    padding-right: 8px;
}

.card-number .box {
    max-width: 400px;
    margin: 20px auto;
}

.credit-input {
    display: block;
    width: 93%;
    max-width: 400px;
    height: 34px;
    margin-left: 8px;
    /*padding: 6px 12px;*/
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.credit-cell {
    width: 24%;
    height: 24px;
    padding: 6px 12px;
    font-size: 18px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    border: none;
    outline: none;
    text-align: center;
    letter-spacing: 3px;
}

.message-star .counter-filter{
    padding: 3px 3px 2px 3px
}

.mark-as {
    position: absolute;
    cursor: pointer;
    top: 25%;
    width: 10px;
    height: 10px;
    border-radius: 50% !important;
    z-index: 1000;
}
.unread-bullet {
    background-color: #cc3c31;
}

/*** Responsive Part ***/

@media (max-width: 1150px) {
    .modal-big {
        width: 96vw;
        margin-left: -48%;
    }
}

@media (min-width: 280px) and (max-width: 354px) {
    .student-badge {
        margin-top: 32px;
    }
}

@media (min-width: 320px) and (max-width: 480px) {

    .credit-cell{
        padding: 6px 6px;
        font-size: 10px;
    }

    .announcement-article .head {
        display: unset;
        justify-content: space-between;
        text-align: center;
    }

    .header.navbar .navbar-brand {
        width: 400px;
        /*max-width: 100%;*/
    }

    .azma-dbox {
        min-height: 195px;
    }

    .dashboard-title {
        font-size: 10px;
        font-weight: bold;
    }

    .factor-body .factor-main .body {
        font-size: 8px;
    }

    .azma-content-user-info-title {
        font-size: unset;
    }

    .azma-content-user-info .side,
    .azma-content-user-info .main {
        font-size: 10px;
    }

    .azma-content-info {
        padding: 18px 1px;
    }

    .refund-request input {
        width: 100% !important;
    }

    .azma-alert .alert-default-body {
        border-right: 1px solid #000000;
    }

    .azma-alert .alert {
        display: flex;
        flex-direction: column;
        text-align: center;
    }

    .video-player {
        display: flex;
        flex-direction: column;
        text-align: center;
    }

    .azma-video {
        order: 1;
    }

    .video-description {
        margin-top: 20px;
        order: 2;
    }

    .media-description {
        overflow: inherit !important;
        height: unset !important;
    }

    .audio {
        display: flex;
        flex-direction: column;
        text-align: center;
    }

    .audio-description {
        order: 1;
    }

    .media-audio {
        order: 2;
    }

    .user-profile .nav-tabs {
        border: none;
    }

    .user-profile .nav-tabs li {
        text-align: center;
        margin-bottom: 15px;
        /*width: 100%;*/
    }

    .user-profile .nav-tabs li a {
        margin: 0;
        border-bottom: 2px solid transparent;
    }

    .user-profile .nav-tabs li a:before {
        content: "";
        width: 100%;
        height: 2px;
        position: absolute;
        bottom: -2px;
        left: 0;
    }

    .nav-tabs > li:first-child.title.active > a,
    .nav-tabs > li:first-child.title.active > a:hover,
    .nav-tabs > li:first-child.title.active > a:focus {
        border-top: 0 solid #0e8dd4;
    }

    .nav-tabs > li .title.active > a,
    .nav-tabs > li .title.active > a:hover,
    .nav-tabs > li .title.active > a:focus {
        border-top: 0 solid #0e8dd4;
    }

    .inbox ul.inbox-nav li {
        margin-right: unset;
        border: 1px solid #fff;
        /*border-bottom-width: 0;*/
        margin-bottom: 0;
    }

    .inbox ul.inbox-nav li:last-child {
        margin-bottom: 15px;
    }

    .inbox .inbox-nav li.active a,
    .inbox .inbox-nav li.active a:hover,
    .inbox .inbox-nav li.active a:active,
    .inbox .inbox-nav li.active a:focus {
        background-color: #0e8dd4 !important;
        color: #f4f4f4;
        margin: 0;

    }

    .inbox .calendar li.compose-btn a {
        font-size: 13px;
    }

    .calendar > li.title.active > a,
    .calendar > li.title.active > a:hover,
    .calendar > li.title.active > a:focus {
        border-top: 2px solid #0e8dd4;
    }

    .user-profile .calendar {
        border: none;
        margin-bottom: 25px;
    }

    .user-profile .calendar li {
        text-align: center;
        margin-bottom: 15px;
        /*width: 100%;*/
    }

    .user-profile .calendar li a {
        margin: 0;
        border-bottom: 2px solid transparent;
    }

    .user-profile .calendar li a:before {
        content: "";
        width: 100%;
        height: 2px;
        position: absolute;
        bottom: -2px;
        left: 0;
    }

    .calendar > li:first-child.title.active > a,
    .calendar > li:first-child.title.active > a:hover,
    .calendar > li:first-child.title.active > a:focus {
        border-top: 0px solid #0e8dd4;
    }

    .calendar > li.title.active > a,
    .calendar > li.title.active > a:hover,
    .calendar > li.title.active > a:focus {
        border-top: 0px solid #0e8dd4;
    }

    .user-profile .tab-content {
        padding: 1px 0px 7px 7px;
    }

    .user-status .btn-group label {
        padding: 10px;
    }

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

    .input-flex {
        flex-direction: row;
    }

    .input-flex .input,
    .input-flex .user-label {
        /*width: 100%;*/
    }

    .flex-container {
        flex-direction: row;
    }

    .flex-container .side,
    .flex-container .main {
        width: 100%;
    }

    .input-flex .change-pass-input,
    .input-flex .change-pass-label {
        width: 100%;
        font-size: 10px;
        height: 29px;
    }

    .refund-content-info-title {
        margin-left: 0;
    }

    .refund-content-info-body {
        margin-right: 0;
    }

    .refund-reasons {
        padding: 0;
    }

    .azma-content-image img {
        width: unset;
        height: 130px;
    }

    .certificate-title {
        height: 15px;
        border-bottom: 1px solid #c1c1c1;
        text-align: center;
    }

    .certificate-title span {
        font-size: 18px;
    }

    .tracking-code {
        flex-direction: row;
    }

    .tracking-organization {
        width: 50%;
    }

    .msg-btn-mark {
        flex-direction: column;
    }

    .msg-btn-mark .btn-group .btn-list a {
        width: 100%;
    }

    .msg-btn-txt {
        vertical-align: middle;
        margin-left: 0;
        margin-top: 0;
        text-align: center;
    }

    .view-message a {
        display: unset;
    }

    .msg-btn-txt i {
        font-size: 25px;
        margin-top: 0;
        text-align: center;
    }

    .msg-btn-reply {
        width: 100%;
        margin-bottom: 5px;
    }

    .msg-btn-forward {
        width: 100%;
        margin-bottom: 5px;
    }

    .msg-btn-forward {
        margin-left: unset;
    }

    .transaction-filter-main {
        display: flex;
        flex-direction: column;
    }

    .transaction-filter {
        width: 100%;
        padding: 0;
    }

    .transaction-filter:first-child {
        padding-right: unset;
    }

    .transaction-filter:last-child {
        padding-left: unset;
    }

    .transaction-filter label {
        background-color: #0e8dd4;
        margin-top: 5px;
        width: 60%;
        padding: 9px 0;
        color: #ffffff;
        text-align: center;
    }

    .transaction-filter .form-control {
        height: 35px;
    }

    .transaction-filter-date {
        border: 1px solid #bbbbbb;
        display: flex
    }

    .transaction-filter-date input {
        border: none;
        width: 115px;
    }

    .transaction-filter-date-label {
        height: 37px;
    }

    .announcement-article {
        display: flex;
        flex-direction: column;
    }

    fieldset.calendar {
        width: unset;
        padding: 0 5px 5px 5px !important;
    }

    .calendar .flex {
        margin-bottom: -3px;
    }

    .calendar .calendar-title {
        background-color: #f3f3f3;
        font-size: 9px;
        padding: 5px;
        margin-left: 0px;
        flex: 1;
    }

    .calendar .body {
        /*margin-top: unset;*/
        background-color: #f3f3f3;
        padding: 3px;
        font-size: 10px;
        margin-right: 2px;
        flex: 1;
    }

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

    .profile-user-info .user-label {
        font-size: 9px;
        font-weight: bold;
    }

    .profile-user-info .user-content input {
        font-size: 10px;
    }

    #student-panel .user-profile .calendar {
        margin-right: 1px;
    }

    #student-panel .user-profile .calendar li {
        margin-bottom: 0;
    }

    #student-panel a {
        font-size: 12px;
        border: 1px solid #a5a5a5;
    }

    #student-panel .calendar .active a {
        background-color: #0e8dd4;
        color: #ffffff;
    }

    .user-image {
        /*margin-bottom: 10px;*/
        padding-right: 12px;
    }

    .announcement-link {
        display: flex;
        font-size: 9px;
    }

    .current-semester-content-info-title {
        font-size: 11px;
    }

    .current-semester-content-info-body {
        font-size: 11px;
    }

    .image-center {
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: 50%;
    }

    .res-table-lg {
        display: none;
    }

    .label-res label {
        width: 50%;
    }

    .user-status-label {
        height: 38px !important;
    }

    div.tracking-organization-desc {
        font-size: 10px;
    }

    .tc {
        white-space: normal;
    }

    .message-star{
        text-align: center;
        margin-bottom: 15px;
    }

    .message-star .counter-filter{
        padding: 3px 3px 1px 3px
    }

}

@media (min-width: 481px) and (max-width: 767px) {

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

    .image-center {
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: 50%;
    }

    .azma-alert .alert-default-body {
        border-right: 1px solid #000000;
    }

    .azma-alert .alert {
        display: flex;
        flex-direction: column;
        text-align: center;
    }

    .azma-content-image img {
        width: unset !important;
        height: 170px;
        text-align: center;
    }

    .user-profile .nav-tabs {
        border: none;
    }

    .user-profile .nav-tabs li {
        /*width: 100%;*/
        text-align: center;
        margin-bottom: 15px;
    }

    .user-profile .nav-tabs li a {
        margin: 0;
        border-bottom: 2px solid transparent;
    }

    .user-profile .nav-tabs li a:before {
        content: "";
        width: 100%;
        height: 2px;
        position: absolute;
        bottom: -2px;
        left: 0;
    }

    .user-profile .calendar li {
        /*width: 100%;*/
        text-align: center;
        margin-bottom: 15px;
    }

    .nav-tabs > li:first-child.title.active > a,
    .nav-tabs > li:first-child.title.active > a:hover,
    .nav-tabs > li:first-child.title.active > a:focus {
        border-top: 1.5px solid #0e8dd4;
    }

    .nav-tabs > li:first-child.title.active > a,
    .nav-tabs > li:first-child.title.active > a:hover,
    .nav-tabs > li:first-child.title.active > a:focus {
        border-top: 0 solid #0e8dd4;
    }

    .nav-tabs > li .title.active > a,
    .nav-tabs > li .title.active > a:hover,
    .nav-tabs > li .title.active > a:focus {
        border-top: 0 solid #0e8dd4;
    }

    .inbox ul.inbox-nav li {
        margin-right: unset;
        border: 1px solid #fff;
        /*border-bottom-width: 0;*/
        margin-bottom: 0;
    }

    .inbox ul.inbox-nav li:last-child {
        margin-bottom: 15px;
    }

    .inbox .inbox-nav li.active a,
    .inbox .inbox-nav li.active a:hover,
    .inbox .inbox-nav li.active a:active,
    .inbox .inbox-nav li.active a:focus {
        background-color: #0e8dd4 !important;
        color: #f4f4f4;
        margin: 0;

    }

    .inbox .calendar li.compose-btn a {
        font-size: 13px;
    }

    .nav-tabs > li.title.active > a,
    .nav-tabs > li.title.active > a:hover,
    .nav-tabs > li.title.active > a:focus {
        border-top: 2px solid #0e8dd4;
    }

    .user-profile .tab-content {
        padding: 1px 12px 5px 20px;
    }

    .inbox .calendar li.compose-btn a {
        font-size: 13px;
    }

    .calendar > li.title.active > a,
    .calendar > li.title.active > a:hover,
    .calendar > li.title.active > a:focus {
        border-top: 2px solid #0e8dd4;
    }

    .user-profile .calendar {
        border: none;
        margin-bottom: 25px;
    }

    .user-profile .calendar li {
        text-align: center;
        margin-bottom: 15px;
        /*width: 100%;*/
    }

    .user-profile .calendar li a {
        margin: 0;
        border-bottom: 2px solid transparent;
    }

    .user-profile .calendar li a:before {
        content: "";
        width: 100%;
        height: 2px;
        position: absolute;
        bottom: -2px;
        left: 0;
    }

    .calendar > li:first-child.title.active > a,
    .calendar > li:first-child.title.active > a:hover,
    .calendar > li:first-child.title.active > a:focus {
        border-top: 0px solid #0e8dd4;
    }

    .calendar > li.title.active > a,
    .calendar > li.title.active > a:hover,
    .calendar > li.title.active > a:focus {
        border-top: 0px solid #0e8dd4;
    }

    .user-status .btn-group label {
        padding: 10.5px;
        box-sizing: border-box;
        height: 38px;
    }

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

    .input-flex .change-pass-input,
    .input-flex .change-pass-label {
        width: 100%;
        font-size: 10px;
        height: 29px;
    }

    .azma-content-info {
        padding: 18px 1px;
    }

    .input-flex {
        flex-direction: row;
    }

    .video-player {
        display: flex;
        flex-direction: column;
        text-align: center;
    }

    .azma-video {
        order: 1;
    }

    .video-description {
        margin-top: 20px;
        order: 2;
    }

    .media-description {
        overflow: inherit !important;
        height: unset !important;
    }

    .audio {
        display: flex;
        flex-direction: column;
        text-align: center;
    }

    .audio-description {
        order: 1;
    }

    .media-audio {
        order: 2;
    }

    .flex-container {
        flex-direction: row;
    }

    .flex-container .side,
    .flex-container .main {
        width: 100%;
        font-size: 11px;
    }

    .input-flex .change-pass-input,
    .input-flex .change-pass-label {
        width: 100%;
    }

    .refund-content-info-title {
        margin-left: 0;
    }

    .refund-content-info-body {
        margin-right: 0;
    }

    .refund-reasons {
        padding: 0;
    }

    /*.azma-content-image img {*/
    /*width: 100%;*/
    /*height: 170px;*/
    /*}*/
    .certificate-title {
        height: 18px;
        border-bottom: 1px solid #c1c1c1;
        text-align: center;
    }

    .certificate-title span {
        font-size: 22px;
    }

    .tracking-code {
        flex-direction: row;
    }

    .tracking-organization {
        width: 49.99999%;
        margin: 6px 0;
    }

    .msg-btn-mark {
        flex-direction: column;
    }

    .msg-btn-mark .btn-group .btn-list a {
        width: 100%;
    }

    .transaction-filter-main {
        display: flex;
        flex-direction: column;
    }

    .transaction-filter {
        width: 100%;
        padding: 0;
    }

    .transaction-filter:first-child {
        padding-right: unset;
    }

    .transaction-filter:last-child {
        padding-left: unset;
    }

    .transaction-filter label {
        background-color: #0e8dd4;
        margin-top: 5px;
        width: 67%;
        padding: 9px 0;
        color: #ffffff;
        text-align: center;
    }

    .transaction-filter .form-control {
        height: 35px;
    }

    .transaction-filter-date {
        border: 1px solid #bbbbbb;
        display: flex;
        width: 60%;
    }

    .transaction-filter-date input {
        border: none;
        width: 115px;
    }

    .transaction-filter-date-label {
        height: 37px;
    }

    .announcement-article {
        display: flex;
        flex-direction: column;
    }

    fieldset.calendar {
        width: unset;
        padding: 0 5px 5px 5px !important;
    }

    .calendar .flex {
        margin-bottom: -3px;
    }

    .calendar .calendar-title {
        background-color: #f3f3f3;
        font-size: 11px;
        padding: 5px;
        margin-left: 0px;
    }

    .calendar .body {
        /*margin-top: unset;*/
        background-color: #f3f3f3;
        padding: 3px;
        font-size: 11px;
        margin-right: 2px;
    }

    #student-panel .user-profile .calendar {
        margin-right: 1px;
    }

    #student-panel .user-profile .calendar li {
        margin-bottom: 0;
    }

    #student-panel a {
        font-size: 14px;
        border: 1px solid white;

    }

    #student-panel .calendar .active a {
        background-color: #0e8dd4;
        color: #ffffff;
    }

    .announcement-link {
        display: flex;
        font-size: 9px;
    }

    .res-table-lg {
        display: none;
    }

    .user-status-label {
        height: 38px !important;
    }

    .table-responsive {
        width: 100%;
        margin-bottom: 15px;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        -ms-overflow-style: -ms-autohiding-scrollbar;
        border: 1px solid #ddd
    }

    .table-responsive > .table {
        margin-bottom: 0
    }

    .tc {
        white-space: normal;
    }

    .message-star{
        text-align: center;
        margin-bottom: 15px;
    }

    .message-star .counter-filter{
        padding: 3px 3px 2px 3px
    }

}

@media (min-width: 768px) and (max-width: 992px) {
    .tc {
        white-space: normal;
    }

    .azma-alert .alert-default-body {
        border-right: 1px solid #000000;
    }

    .azma-alert .alert {
        display: flex;
        flex-direction: column;
        text-align: center;
    }

    .video-player {
        display: flex;
        flex-direction: row;
        text-align: center;
    }

    .azma-video {
        order: 2;
    }

    .video-description {
        order: 1;
    }

    .media-description {
        overflow: inherit !important;
        height: unset !important;
    }

    .audio {
        display: flex;
        flex-direction: column;
        text-align: center;
    }

    .audio-description {
        order: 1;
    }

    .media-audio {
        order: 2;
    }

    .flex-container {
        /*flex-direction: column;*/
    }

    .user-status .btn-group label {
        padding: 10px 5px 11px 5px;
    }

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

    .flex-container .side,
    .flex-container .main {
        width: 100%;
    }

    .input-flex {
        flex-direction: column;
    }

    .input-flex .change-pass-input,
    .input-flex .change-pass-label {
        width: 100%;
        font-size: 10px;
        height: 29px;
    }

    .azma-content-info {
        padding: 18px 1px;
    }

    .input-flex {
        flex-direction: row;
    }

    .input-flex .input,
    .input-flex .user-label {
        width: 100%;
    }

    .refund-content-info-title {
        margin-left: 0;
    }

    .refund-content-info-body {
        margin-right: 0;
    }

    .refund-reasons {
        padding: 0;
    }

    .azma-content-image img {
        width: 100%;
        height: 170px;
    }

    .inbox .inbox-nav li.compose-btn a {
        padding: 6px;
        margin-top: 10px;
    }

    .certificate-title {
        height: 25px;
        border-bottom: 1px solid #c1c1c1;
        text-align: center;
    }

    .certificate-title span {
        font-size: 30px;
    }

    .tracking-code {
        flex-direction: row;
    }

    .transaction-filter-main {
        display: flex;
        flex-direction: row;
    }

    .transaction-filter {
        width: 100%;
        padding: 5px;
    }

    .transaction-filter:first-child {
        padding-right: unset;
    }

    .transaction-filter:last-child {
        padding-left: unset;
    }

    .transaction-filter label {
        background-color: #0e8dd4;
        margin-top: 5px;
        width: 67%;
        padding: 9px 0;
        color: #ffffff;
        text-align: center;
    }

    .transaction-filter .form-control {
        height: 35px;
    }

    .transaction-filter-date {
        border: 1px solid #bbbbbb;
        display: flex;
    }

    .transaction-filter-date input {
        border: none;
        width: 115px;
    }

    .transaction-filter-date-label {
        height: 37px;
        width: 50px !important;
    }

    fieldset.calendar {
        width: unset;
    }

    .calendar .flex {
        margin-bottom: -3px;
    }

    .calendar .calendar-title {
        background-color: #f3f3f3;
        font-size: 11px;
        padding: 5px 6px 7px 6px;
        margin-left: 0px;
    }

    .calendar .body {
        /*margin-top: unset;*/
        background-color: #f3f3f3;
        padding: 4px;
        font-size: 11px;
        margin-right: 2px;
    }

    .res-table-sm {
        display: none;
    }

    .user-status-label {
        height: 38px !important;
    }
}

@media (min-width: 1000px) {
    .azma-table > thead.header tr {
        cursor: default;
    }
}

@media (min-width: 992px) {
    .azma-body.container {
        width: 730px;
    }

    .azma-body.container.user-message {
        width: 90%;
    }

    .azma-wizard li {
        width: auto;
    }

    .azma-wizard div {
        font-size: 10px;
    }

    .azma-wizard div::before {
        top: -3px;
    }

    .azma-wizard .counter {
        top: 6px;
    }
}

@media (min-width: 993px) and (max-width: 1024px) {

    .user-status-label {
        height: 38px !important;
    }

    .transaction-filter-main {
        display: flex;
        flex-direction: row;
    }

    .transaction-filter {
        width: 100%;
        padding: 5px;
    }

    .transaction-filter:first-child {
        padding-right: unset;
    }

    .transaction-filter:last-child {
        padding-left: unset;
    }

    .transaction-filter label {
        background-color: #0e8dd4;
        margin-top: 5px;
        width: 67%;
        padding: 9px 0;
        color: #ffffff;
        text-align: center;
    }

    .transaction-filter .form-control {
        height: 35px;
    }

    .transaction-filter-date {
        border: 1px solid #bbbbbb;
        display: flex;
    }

    .transaction-filter-date input {
        border: none;
        width: 115px;
    }

    .transaction-filter-date-label {
        height: 37px;
        width: 50px !important;
    }

    fieldset.calendar {
        width: 48%;
    }

    .calendar .flex {
        flex-direction: column;
    }

    .calendar .calendar-title {
        margin-bottom: 10px;
    }

    .calendar .calendar-title {
        margin-bottom: 10px;
        margin-top: 10px;
    }

    .calendar .body {
        margin-top: unset;
    }

    .user-status .btn-group label {
        padding: 10px 5px 11px 5px;
    }

    .input-flex .address-info {
        font-size: 8px;
    }

    .res-table-sm {
        display: none;
    }

    .dashboard-title {
        font-size: 9px;
    }

    .tc {
        white-space: normal;
    }

}

@media (min-width: 1200px) {
    .azma-body.container {
        width: 930px;
    }

    .azma-body.container.user-message {
        width: 100%;
    }

    .message-notification .dashboard-stat .details .desc {
        line-height: 30px;
    }

    .message-notification .dashboard-stat .visual {
        margin-left: 0;
    }

    .tracking-code {
        flex-direction: row;
    }

    .side {
        /*flex: 45%;*/
    }

    .calendar .flex {
        flex-direction: row;
    }

    .calendar .calendar-title {
        margin-bottom: 10px;
        margin-top: 10px;
    }

    .calendar .body {
        margin-top: unset;
    }

    .azma-wizard div {
        font-size: 14px;
    }

    .azma-wizard div::before {
        top: 1px;
    }

    .azma-wizard .counter {
        top: 10px;
    }

    .res-table-sm {
        display: none;
    }
}

@media (min-width: 1025px) and (max-width: 1280px) {

    .user-status-label {
        height: 38px !important;
    }

    .dashboard-title {
        font-size: 10px;
    }

    .azma-alert .alert-default-body {
        border-right: 1px solid #000000;
    }

    .azma-alert .alert {
        display: flex;
        text-align: center;
    }

    .flex-container {
        flex-flow: unset;
    }

    .flex-container .side,
    .flex-container .main {
        width: 50%;
    }

    /*.input-flex {*/
    /*flex-direction: column;*/
    /*}*/
    /*.input-flex .change-pass-input,*/
    /*.input-flex .change-pass-label {*/
    /*width: 100%;*/
    /*}*/
    .input-flex .change-pass-input,
    .input-flex .change-pass-label {
        width: 100%;
    }

    .azma-content-info {
        padding: 45px 0px;
    }

    .input-flex {
        flex-direction: row;
    }

    .input-flex .input,
    .input-flex .user-label {
        width: 100%;
    }

    .refund-content-info-title {
        margin-left: 0;
    }

    .refund-content-info-body {
        margin-right: 0;
    }

    .refund-info .flex-container {
        flex-direction: row;
    }

    .refund-reasons {
        padding: 0;
    }

    .refund-ask .flex-container {
        flex-direction: row;
    }

    .refund-ask .flex-container .side,
    .refund-ask .flex-container .main {
        width: 0;
    }

    .inbox .inbox-nav li.compose-btn a {
        padding: 6px;
        margin-top: 10px;
    }

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

    .user-status .btn-group label {
        padding: 10px 5px 11px 5px;
    }

    .tracking-code {
        flex-direction: row;
    }

    .transaction-filter-main {
        display: flex;
        flex-direction: row;
    }

    .transaction-filter {
        width: 100%;
        padding: 5px;
    }

    .transaction-filter:first-child {
        padding-right: unset;
    }

    .transaction-filter:last-child {
        padding-left: unset;
    }

    .transaction-filter label {
        background-color: #0e8dd4;
        margin-top: 5px;
        width: 67%;
        padding: 9px 0;
        color: #ffffff;
        text-align: center;
    }

    .transaction-filter .form-control {
        height: 35px;
    }

    .transaction-filter-date {
        border: 1px solid #bbbbbb;
        display: flex;
    }

    .transaction-filter-date input {
        border: none;
        width: 115px;
    }

    .transaction-filter-date-label {
        height: 37px;
        width: 50px !important;
    }

    fieldset.calendar {
        width: 48%;
    }

    .calendar .flex {
        flex-direction: column;
    }

    .calendar .calendar-title {
        margin-bottom: 10px;
        margin-top: 10px;
        margin-left: unset;
    }

    .calendar .body {
        margin-top: unset;
    }

    .profile-user-info .user-label {
        font-size: 12px;
    }

    .input-flex .address-info {
        font-size: 8px;
    }

    .res-table-sm {
        display: none;
    }

    .tc {
        white-space: normal;
    }
}

@media (min-width: 1267px) and (max-width: 1280px) {
    .message-notification .dashboard-stat .details .desc {
        text-align: center;
        vertical-align: middle;
        line-height: 55px;
    }

    .message-notification .dashboard-stat .visual {
        margin-left: 0;
    }

    .tc {
        white-space: normal;
    }
}

@media (max-height: 570px) {
    .login-flex {
        margin-top: calc((750px - 100vh) / 2.4);
    }
}

@media (min-width: 990px) and (max-width: 1200px){
    .inbox ul.inbox-nav li {
        margin-right: unset;
        border: 1px solid #fff;
        /*border-bottom-width: 0;*/
        margin-bottom: 0;
    }

    .inbox ul.inbox-nav li:last-child {
        margin-bottom: 15px;
    }

    .inbox .inbox-nav li.active a,
    .inbox .inbox-nav li.active a:hover,
    .inbox .inbox-nav li.active a:active,
    .inbox .inbox-nav li.active a:focus {
        background-color: #0e8dd4 !important;
        color: #f4f4f4;
        margin: 0;

    }

    .inbox .inbox-nav li.compose-btn a {
        padding: 6px;
        margin-top: 0;
    }
}


/* End of Responsive Section */