/**************************** fixed dashboard******************** */
body {
    display: unset
}

.dashboard {
    position: sticky;
    top: 0;
    padding: 0;
    margin: 0;
    text-align: center;
    background-color: gainsboro;
    box-shadow: 0 0 10px gainsboro;
    border-radius: 30px;
    margin-bottom: 50px;
    border-radius: 20px;
}

.dashboard .avatar {
    width: 100%;
    display: block;
    margin: 0 auto;
}

.dashboard img {
    padding: 10px 0;
    width: 80%;
    border-radius: 100%;

}

.dashboard .user-name {
    padding: 10px 0;
    font-size: 20px;
    color: #2f0c55;
}

.dashboard ul {
    border-radius: 0 0 20px 20px;
    padding: 20px;
    margin: 0;
    background-color: #2f0c55;
    text-align: right;
    position: relative;
}

.dashboard li {
    margin: 0;
    position: relative;
    border-radius: 10px;
}

.dashboard li a {
    position: relative;
    text-decoration: none;
    color: #fff;
    padding: 20px;
    border-radius: 10px;
}

.dashboard li:hover {
    background-color: #1f0b357c;
}

.active-mode {
    background-color: #1f0b357c;
}

.dashboard .fa-house-user,
.dashboard .fa-user-cog,
.dashboard .fa-key,
.dashboard .fa-cart-arrow-down,
.dashboard .fa-wallet,
.dashboard .fa-comment-dots,
.dashboard .fa-sign-out-alt,
.dashboard .fa-receipt,
.dashboard .fa-user-clock,
.dashboard .fa-chalkboard-teacher,
.dashboard .fa-question-circle {
    margin-left: 5px;
    color: #c095ee;
    font-size: 14px;
}

/* profile */

.profile {
    background-color: #f4f4f4;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='152' height='152' viewBox='0 0 152 152'%3E%3Cg fill-rule='evenodd'%3E%3Cg id='temple' fill='%232f0c55' fill-opacity='0.01'%3E%3Cpath d='M152 150v2H0v-2h28v-8H8v-20H0v-2h8V80h42v20h20v42H30v8h90v-8H80v-42h20V80h42v40h8V30h-8v40h-42V50H80V8h40V0h2v8h20v20h8V0h2v150zm-2 0v-28h-8v20h-20v8h28zM82 30v18h18V30H82zm20 18h20v20h18V30h-20V10H82v18h20v20zm0 2v18h18V50h-18zm20-22h18V10h-18v18zm-54 92v-18H50v18h18zm-20-18H28V82H10v38h20v20h38v-18H48v-20zm0-2V82H30v18h18zm-20 22H10v18h18v-18zm54 0v18h38v-20h20V82h-18v20h-20v20H82zm18-20H82v18h18v-18zm2-2h18V82h-18v18zm20 40v-18h18v18h-18zM30 0h-2v8H8v20H0v2h8v40h42V50h20V8H30V0zm20 48h18V30H50v18zm18-20H48v20H28v20H10V30h20V10h38v18zM30 50h18v18H30V50zm-2-40H10v18h18V10z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    padding: 20px;
    text-align: right;
    background-color: #fff;
    box-shadow: 0 0 10px gainsboro;
    border-radius: 30px;
    max-width: 73%;
    float: left;
    margin-bottom: 20px;
}

.profile h2 {
    text-align: right;
    padding: 20px;
    border-bottom: 1px solid #2f0c55;
    font-size: 20px;
    color: #2f0c55;
    margin-bottom: 40px;
}

.profile a {
    margin: 15px 0;
    text-decoration: none;
    color: #2f0c55c0;
    padding: 5px 15px 5px 0;
    font-size: 17px;
    font-style: normal;
    cursor: default;
}

.profile small {
    color: #43494da6;
}

.profile i {
    font-size: 20px;
    color: #2f0c55b0;
}

/* edit profile */

.profile input {
    display: block;
    width: 100%;
    padding: 10px;
    border: 1px solid gainsboro;
    border-radius: 5px;
    color: #43494da6;
}

.profile textarea {
    width: 100%;
    border: 1px solid gainsboro;
    border-radius: 5px;
}

.profile .editBtn {
    float: left;
    margin: 20px 0;
}

.profile .changePassBtn {
    float: left;
    margin: 20px 15px;
}

/* ****************** my course *******************/

.no-course h3 {
    text-align: center;
    padding: 50px;
    font-size: 30px;
    color: rgb(182, 179, 179);
    display: none;
}

.my-course {
    position: relative;
    display: block;
    margin-bottom: 35%;
    display: block;
}

.course-box {
    background-color: rgb(109, 68, 146);
    color: #fff;
    padding: 0px;
    transition: all 0.6s ease-in-out;
    box-shadow: 0 0 2px rgb(180, 176, 185);
    border-radius: 5px;
}

.course-box h3 {
    padding: 15px;
}

.course-box p {
    padding: 15px;
    font-size: 12px;
    color: rgba(214, 210, 219, 0.705);
}

.course-box span {
    padding-right: 15px;
    font-size: 25px;
}

.course-box .progress {
    margin: 0 15px;
    height: 10px;
    background-color: #2f0c55;
}

.course-box .progress-bar {
    background-color: #9fd98c;
}

.course-box .view-course {
    color: #fff;
    padding: 0;
    margin: 0;
    background-color: #2f0c55;
    text-align: center;
    transition: all 0.2s ease-in-out;
    height: 0;
}

.view-course a {
    text-decoration: none;
    color: #fff;
    font-size: 14px;
    padding: 10px;
    margin: 0;
    font-weight: normal;
    cursor: pointer;
}

.course-box:hover .view-course {
    height: 40px;
}

.course-box:hover {
    transform: scale(1.05);
}


.paging {
    text-align: center;
    direction: rtl !important;
}

.page-link {
    cursor: pointer !important;
    color: #39363d !important;
    font-size: 14px !important;
    border-radius: 5px;
    margin: 0 5px !important;
}

.page-link:hover {
    color: #ffffff !important;
    background-color: #2f0c55 !important;
}

.page-link-active {
    background-color: #2f0c55 !important;
    color: #fff !important;
}

/* **************** supprot page */
.answered {
    color: #9fd98c;
}

.pending {
    color: #fcc208;
}

.new-message {
    font-size: 16px !important;
    cursor: pointer !important;
}

.new-message:hover {
    transform: scale(1.02);
    color: #2f0c55;
}

.warning-box {
    background-color: #f0bcba8c;
    color: #3e3744;
    margin-bottom: 50px;
    padding: 20px 10px 10px 10px;
    border: 1px solid #3e3744;
}

/* Decoupled document build. */
.ck.editor__editable[role='textbox'],
.ck.ck-editor__editable[role='textbox'],
/* Inline & Balloon build. */
.ck.editor[role='textbox'] {
    width: 100%;
    background: #fff;
    font-size: 1em;
    line-height: 1.6em;
    min-height: 180px;
    padding: 0em 2em;
    margin-bottom: 20px;
}

/* ************** favorites ************************** */
.favorites a {
    color: #39363d;
    font-size: 14px;
    cursor: pointer;
    padding: 0;
}

.fa-trash-alt {
    position: relative;
    top: 16px;
    color: crimson;
    cursor: pointer;
}


/* *****************modal************************ */
.modal {
    text-align: center;
    padding: 50px;
    top: 30%;

}

.modal p {
    text-align: center;
}

.modal button {
    width: 20%;
    margin: 20px;
    background-color: #2f0c55;
    border: none;
}

.modal button:hover {
    background-color: #531397;
}

.modal .fa-exclamation {
    font-size: 100px;
    color: #fcc208;
    margin: 10px 0 30px 0;
}

/********************* submit-consulting ****************************/

.submit-consulting select {
    width: 100%;
    padding: 10px;
    border-radius: 5px;
    margin-bottom: 50px;
}

.fa-clipboard-list,
.fa-calendar-check,
.fa-hourglass-start {
    margin-left: 10px;
    color: #686e71;
}


/* ************** new alert ***************** */

.new-alert:after {
    content: '1';
    background-color: crimson;
    border-radius: 100%;
    color: #fff;
    padding: 2px 10px;
    width: 5px;
    height: 5px;
    margin-right: 20px;
}


.tr  a{
    padding: 0 !important;
    margin: 0 !important; 
    cursor: pointer !important;
}

/* wallet button and input */

.wallet .wallet-input-1{
    margin-bottom: 10px;
}
.wallet .wallet-input-2{
    margin-bottom: 50px;
}
.wallet input{
    width: 60%;
}
.wallet  button{
    margin-right: 20px;
}

/* ************* 1199 ********************* */
@media screen and (max-width : 1199px) {
    .dashboard .fa-house-user,
    .dashboard .fa-user-cog,
    .dashboard .fa-key,
    .dashboard .fa-cart-arrow-down,
    .dashboard .fa-wallet,
    .dashboard .fa-comment-dots,
    .dashboard .fa-sign-out-alt,
    .dashboard .fa-receipt,
    .dashboard .fa-user-clock,
    .dashboard .fa-chalkboard-teacher,
    .dashboard .fa-question-circle,
    .fa-clipboard-list,
    .fa-calendar-check,
    .fa-hourglass-start,
    .fa-trash-alt,
    .dashboard i,
    .profile i{
        font-size: 14px !important;
    }
    .dashboard p,
    .dashboard a,
    .dashboard label,
    .dashboard a,
    .profile p,
    .profile a,
    .profile span,
    .profile label{
        font-size: 13px !important;
    }
    .dashboard h2,
    .profile h2{
        font-size: 15px !important;
    }
}

/* ******************* 991 *********************** */
@media screen and (max-width : 991px) {
    .dashboard {
        position: relative;
    }
    .dashboard img{
        width: 60%;
    }
    .profile{
        max-width: 100%;
    }

    .dashboard .fa-house-user,
    .dashboard .fa-user-cog,
    .dashboard .fa-key,
    .dashboard .fa-cart-arrow-down,
    .dashboard .fa-wallet,
    .dashboard .fa-comment-dots,
    .dashboard .fa-sign-out-alt,
    .dashboard .fa-receipt,
    .dashboard .fa-user-clock,
    .dashboard .fa-chalkboard-teacher,
    .dashboard .fa-question-circle,
    .fa-clipboard-list,
    .fa-calendar-check,
    .fa-hourglass-start,
    .fa-trash-alt,
    .dashboard i,
    .profile i{
        font-size: 15px !important;
    }
    .dashboard p,
    .dashboard a,
    .dashboard label,
    .dashboard a,
    .profile p,
    .profile a,
    .profile span,
    .profile label{
        font-size: 14px !important;
    }
    .dashboard h2,
    .profile h2{
        font-size: 16px !important;
    }
    .my-course{
        margin-bottom: 5px;
    }
    .course-box{
        padding-top: 20px;
    }
    .wallet .wallet-input-1{
        margin-bottom: 50px;
    }
    .wallet .wallet-input-2{
        margin-bottom: 100px;
    }
}

/* ************************** 767 ******************** */
@media screen and (max-width : 767px) {
  
}


/* ***************** 480 ********************* */
@media screen and (max-width : 480px) {

}