

/* ---------------------------------------- */
/* header */
header {
    margin-bottom: 25px !important;
}

/* ---------------------------------------- */
/* container */
/* setting */

.classto_panel_container {
    margin-bottom: 38px;
    display: flex;
    align-items: start;
    justify-content: start;
}

.panel_part_right {
    width: 20%;
    position: sticky;
    top: 10px;
}

.panel_part_left {
    width: 80%;
}

.item_right_container {
    /*padding-left: 11px;*/
    padding: 0px 9px;
}

.item_left_container {
    /*padding-right: 11px;*/
    padding: 0px 9px;
}

.container_margin_butten {
    margin-bottom: 18px;
}

.classto_panel_barckscreen {
    position: fixed;
    top: 0;
    right: 0;
    width: 100vw;
    height: 100vh;
    visibility: hidden;
    opacity: 0;
    transition: all 0.5s ease;
    z-index: 10;
}

.classto_panel_barckscreen.active {
    visibility: visible;
    opacity: 1;
    transition: all 0.5s ease;
}


.roboyad_user_panel_show_login {
    height: 60vh;
}


/* title */

.title_dashbord {
    font-size: 19px;
    font-weight: bold;
    color: #49585F;
    width: 100%;
    margin-bottom: 17px;
}


@media (max-width: 427px) {

    .item_right_container {
        /*padding-left: 11px;*/
        padding: 0px 12px;
    }

    .item_left_container {
        /*padding-right: 11px;*/
        padding: 0px 12px;
    }

}


@media ( max-width: 768px ) {

    .panel_part_right {
        width: 70%;
        z-index: 20;
    }

    .panel_part_left {
        width: 100%;
    }

    .title_dashbord {
        font-size: 16px;
    }
}


/* ---------------------------------------- */
/* panel */
/* ---------------------------------------- */


.classto_menu_panel {
    display: flex;
    align-items: start;
    justify-content: start;
    flex-direction: column;
    background-color: white;
    border-radius: 8px;
    border: 1px solid #EEEEEE;
    padding: 12px 12px;
    margin-left: 6px;
    gap: 9px;

    min-height: 75vh;
    max-height: 75vh;
    overflow-y: auto;
}

.classto_menu_panel_item {
    display: flex;
    align-items: start;
    justify-content: start;
    flex-direction: row-reverse;
    padding: 14px 12px;
    border-radius: 8px;
    width: 100%;
}

.classto_menu_panel svg {
    min-width: 20px;
}

.classto_menu_panel_item:hover {
    cursor: pointer;
}

.classto_menu_panel_item.active {
    background-color: #D8EFFF;
}

.classto_menu_panel_item_text {
    margin-right: 30px;
    color: #343A40;
    font-weight: 500;
}

.classto_menu_panel_item.active .classto_menu_panel_item_text {
    color: #2B6CB0;
}

.close_panel_menu {
    width: 100%;
    display: none;
}


.show_icon_menu_inrespansive {
    display: none;
    align-items: start;
    justify-content: start;
    padding: 10px;
    border-radius: 8px;
    border: 1px solid #ECEFF1;
    width: fit-content;
    background-color: white;
    background-color: #2B6CB0;
    margin-bottom: 18px;
}

.show_icon_menu_inrespansive p {
    font-size: 13px;
    /*color: #2B6CB0;*/
    color: #fff;
    margin-right: 11px;
    font-weight: bold;
}


@media ( max-width: 768px ) {

    .show_icon_menu_inrespansive {
        display: flex;
    }

    .panel_part_right.active {
        position: fixed;
        top: 0;
        right: 0;
        transition: all 0.5s ease;
    }

    .panel_part_right {
        position: fixed;
        top: 0;
        right: -100%;
        transition: all 0.5s ease;
    }

    .classto_menu_panel {
        min-height: 100vh;
        border-radius: 18px 0px 0px 18px;
    }

    .close_panel_menu {
        display: flex;
        align-items: end;
        justify-content: end;
        padding: 5px 0px;
    }

    .classto_menu_panel_item_text {
        margin-right: 19px;
        font-size: 14px;
    }
}


/* ---------------------------------------- */
/* panel dashbord */
/* ---------------------------------------- */

/* --------------- */
/* alarm */

dasbord_alert {

}

.dasbord_alert {
    background-color: white;
    border-radius: 8px;
    padding: 12px;
    border: 1px solid #01AFDF;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.dasbord_alert_text_p {
    display: flex;
    align-items: start;
    justify-content: start;
}

.dasbord_alert_text_p p{
    font-size: 16px;
    color: black;
    margin-right: 10px;
    line-height: 24px;
}

.dasbord_alert_text_p svg{
    min-width: 24px;
}

.dasbord_alert_butten {
    padding: 10px;
    background-color: #01AFDF;
    font-size: 18px;
    border-radius: 8px;
    color: white;
    outline: none;
    border: none;
}

.dasbord_alert_butten:hover {
    cursor: pointer;
}

.dasbord_alert_butten_container {
    display: flex;
}


@media ( max-width: 768px ) {

    .dasbord_alert {
        flex-direction: column;
    }


    .dasbord_alert_text_p {
        width: 100%;
    }

    .dasbord_alert_text_p p {
        font-size: 13px;
        display: block;
        width: 100%;
        white-space: normal;
        word-wrap: break-word;
    }

    .dasbord_alert_butten_container {
        width: 100%;
        display: flex;
        align-items: end;
        justify-content: end;
        margin-top: 5px;
    }

    .dasbord_alert_butten {
        padding: 8px 12px;
        font-size: 12px;
        text-align: center;
    }

}




/* --------------- */
/* message manager */

.dashbord_message_manager {
    background-color: white;
    border-radius: 8px;
    box-shadow: 0px 2px 8px 0px rgba(184, 184, 184, 0.25);
    padding: 16px 18px;
    height: 100%;
}

.dashbord_message_manager_image_name_tag {
    display: flex;
    align-items: center;
    justify-content: start;
    width: 100%;
}

.dashbord_message_manager_image {
    border-radius: 50%;
    width: 69px;
    height: auto;
    margin-left: 11px;
}

.dashbord_message_manager_name {
    color: #37474F;
    font-size: 14px;
    font-weight: 600;
}

.dashbord_message_manager_tag {
    color: #37474F;
    font-size: 13px;
    font-weight: 500;
}


.dashbord_message_description {
    font-size: 13px;
    color: #6d7077;
    margin-top: 14px;
    line-height: 20px;
}


@media ( max-width: 768px ) {

    .dashbord_message_manager_image {
        width: 53px;
        margin-left: 8px;
    }

    .dashbord_message_manager_name {
        font-size: 12px;
    }

    .dashbord_message_manager_tag {
        font-size: 11px;
    }

    .dashbord_message_description {
        font-size: 12px;
        margin-top: 10px;
    }

    .dashbord_message_manager {
        padding: 12px;
    }

}



/* --------------- */
/* complete profile */


.dashbord_complete_profile {
    background-color: white;
    border-radius: 8px;
    box-shadow: 0px 2px 8px 0px rgba(184, 184, 184, 0.25);
    padding: 32px 18px;
    display: flex;
    align-items: center;
    justify-content: start;
    height: 100%;
}

.circle-progress {
    position: relative;
    width: 100%;
    max-width: 120px;
    aspect-ratio: 1 / 1;

    border-radius: 50%;
    flex-direction: column;
    display: flex;
    align-items: center;
    justify-content: center;
}
.circle-progress::before {
    content: "";
    position: absolute;
    /*top: 13px;*/
    /*left: 13px;*/
    width: 83%;
    height: 83%;
    background: #fff;
    border-radius: 50%;
    z-index: 1;
}
.circle-progress .percent,
.circle-progress .desc {
    position: relative;
    z-index: 2;
}
.circle-progress .percent {
    text-align: center;
    font-size: 25px;
    font-weight: bold;
    color: #495057;
}
.circle-progress .desc {
    text-align: center;
    font-size: 11px;
    font-weight: 500;
    color: #6C757D;
    padding: 0px 19px;
}


.dashbord_complete_profile_circle {
    width: 40%;
}

.dashbord_complete_profile_discription_link {
    width: 60%;
}

.dashbord_complete_profile_discription_link {
    display: flex;
    align-items: start;
    justify-content: start;flex-direction: column;
}

.dashbord_complete_profile_discription {
    font-size: 14px;
    color: #212529;
}

.dashbord_complete_profile_link {
    display: flex;
    align-items: start;
    justify-content: start;
    flex-direction: row-reverse;
    margin-top: 12px;
}

.dashbord_complete_profile_link:hover {
    cursor: pointer;
}

.dashbord_complete_profile_link p {
    margin-right: 8px;
    font-size: 16px;
    color: #0096C7;
    font-weight: bold;
}


@media ( max-width: 768px ) {

    .dashbord_complete_profile {
        flex-direction: column;
        padding: 12px;
    }

    .dashbord_complete_profile_circle {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        margin-bottom: 7px;
    }

    .dashbord_complete_profile_discription_link {
        width: 100%;
        text-align: center;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column-reverse;
    }

    .dashbord_complete_profile_link {
        width: 100%;
        align-items: center;
        justify-content: center;
        margin-bottom: 15px;
    }

    .circle-progress .percent {
        font-size: 19px;
    }

    .circle-progress .desc {
        font-size: 10px;
    }

    .dashbord_complete_profile_link p {
        font-size: 12px;
    }

    .dashbord_complete_profile_discription {
        font-size: 12px;
    }

}

/* --------------- */
/* complete profile */

.dashbord_ticket {
    background-color: white;
    border-radius: 8px;
    box-shadow: 0px 2px 8px 0px rgba(184, 184, 184, 0.25);
    padding: 12px 12px;
    height: 100%;
}

.dashbord_ticket_title {
    color: #343A40;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 20px;
}

.dashbord_ticket_title_carts_item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
    padding: 12px 12px;
    border: 1px solid #ECEFF1;
    border-radius: 8px;
    margin-bottom: 8px;
}

.dashbord_ticket_title_carts_item:hover {
    cursor: pointer;
}

.dashbord_ticket_title_carts_item_text {
    width: 40%;

    font-size: 13px;
    color: #37474F;
    font-weight: 500;
}

.dashbord_ticket_title_carts_item_status {
    width: 40%;

    font-size: 13px;
    color: #0077B6;
    font-weight: bold;
    text-align: center;
}

.dashbord_ticket_title_carts_item_svg {
    width: 20%;

    display: flex;
    align-items: center;
    justify-content: end;
}

.dashbord_ticket_show_all {
    width: 100%;
    color: #0096C7;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #0096C7;
    padding: 12px 12px;
    font-size: 16px;
    border-radius: 8px;
    font-weight: bold;
    margin-top: 17px;
}

@media ( max-width: 768px ) {

    .dashbord_ticket_title {
        font-size: 14px;
        margin-bottom: 18px;
    }

    .dashbord_ticket_title_carts_item_text {
        font-size: 12px;
    }

    .dashbord_ticket_title_carts_item_status {
        font-size: 12px;
    }

    .dashbord_ticket_title_carts_item {
        padding: 11px;
    }

    .dashbord_ticket_show_all {
        padding: 11px;
        font-size: 12px;
    }

}

/* --------------- */
/* complete money */


.dashbord_money .dashbord_ticket_title_carts_item_text {
    width: 40%;
    text-align: start;
}

.dashbord_money .dashbord_ticket_title_carts_item_status {
    width: 20%;
    text-align: center;
    color: #37474F;
    font-weight: normal;
}

.dashbord_money .dashbord_ticket_title_carts_item_svg {
    width: 40%;
}

.dashbord_money .dashbord_ticket_title_carts_item_svg p {
    text-align: end;
    color: #24BA72;
}

@media ( max-width: 768px ) {
    .dashbord_money .dashbord_ticket_title_carts_item_svg p {
        font-size: 12px;
    }
}


/* null ticket and menoy reporter */


.image_null_ticket_money_reaporter_container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    height: 80%;
}


.image_null_ticket_money_reaporter svg {
    width: 100%;
    max-width: 80px;
    height: auto;
}

.image_null_ticket_money_reaporter {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    margin: 30px 10px;
}

.image_null_ticket_money_reaporter p {
    margin-top: 12px;
    font-size: 13px;
    font-weight: bold;
    color: #808A8F;
}


@media ( max-width: 768px ) {

    .image_null_ticket_money_reaporter svg {
        max-width: 80px;
    }
}

/* --------------- */
/* show education filme */

.dashbord_show_video {
    background: #45C8E3;
    background: linear-gradient(180deg, rgba(69, 200, 227, 1) 0%, rgba(6, 154, 201, 1) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 70px 12px;
    border-radius: 8px;
    box-shadow: 0px 2px 8px 0px rgba(184, 184, 184, 0.25);
    height: 100%;
}

.dashbord_show_video p {
    color: white;
    font-size: 25px;
    font-weight: bold;
    margin-right: 11px;
}

.dashbord_show_video svg {
    width: 100%;
    max-width: 59px;
}

.dashbord_show_video:hover {
    cursor: pointer;
}



@media ( max-width: 768px ) {

    .dashbord_show_video p {
        font-size: 17px;
        margin-right: 11px;
    }

    .dashbord_show_video svg {
        width: 100%;
        max-width: 40px;
    }

    .dashbord_show_video {
        padding: 37px 12px;
    }

}



/* ---------------------------------------- */
/* panel list courses */
/* ---------------------------------------- */

/* --------------- */
/* list courses tabel*/



.tabel_course_container {
    background-color: white;
    padding-top: 18px;
    border-radius: 8px 8px 0 0;
    box-shadow: 0px 2px 8px 0px rgba(184, 184, 184, 0.25);
}

.tabel_course {
    width: 100%;
    text-align: center;
    border-spacing: 0;
}

.tabel_course thead {
    background-color: rgba(233, 236, 239, 0.3);
}

.tabel_course thead tr th{
    padding: 15px 0px;
    font-size: 16px;
    font-weight: normal;
    color: #6C757D;
}

.tabel_course tbody tr td{
    border-bottom: 1px solid #E9ECEF;
    padding: 20px 8px;
}

.tabel_course_row {
    font-size: 16px;
    color: #495057;
}

.tabel_course_name_course {
    font-size: 16px;
    color: #495057;
}

.tabel_course_status {
    font-weight: 600;
    font-size: 16px;
}

.tabel_course_status.color_status_1 {
    color: #FF7051;
}

.tabel_course_status.color_status_2 {
    font-size: 16px;
    color: #00D06C;
}

.tabel_course_status.color_status_3 {
    font-size: 16px;
    color: #0096C7;
}

.tabel_course_status.color_status_4 {
    color: red;
}

.tabel_course_vahed {
    font-size: 16px;
    color: #495057;
}

.tabel_course_number {
    font-size: 16px;
    color: #495057;
}

.tabel_course_number.color_red {
    color: #FF7051;
}


/* list */

.label_show_course {
    display: none;
}

.label_show_course_item_box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
    font-size: 13px;
}

.label_show_course_item {
    border-bottom: 1px solid #CDCDCD;
    margin-bottom: 20px;
}

.label_show_course_item:last-child {

    border-bottom: 0px solid #CDCDCD;
    margin-bottom: 0px;
}

.label_show_course_item_title {
    color: #333333;
    font-weight: 600;
    width: 30%;
}

.label_show_course_item_text {
    color: #495057;
    font-weight: 500;
    width: 70%;
    text-align: end;
}

.label_show_course_item_status_text.color_1 {
    color: #FF7051;
}
.label_show_course_item_status_text.color_2 {
    color: #00D06C;
}
.label_show_course_item_status_text.color_3 {
    color: #0096C7;
}



@media (max-width: 427px) {

    .tabel_course_container {
        padding: 18px;
    }

    .tabel_course {
        display: none;
    }

    .label_show_course {
        display: block;
    }
}

/* ---------------------------------------- */
/* select course */
/* ---------------------------------------- */

/*.select_cours {*/
/*    width: 100%;*/
/*    background-color: white;*/
/*    text-align: center;*/
/*    padding-top: 18px;*/
/*    padding-bottom: 18px;*/
/*    border-radius: 8px 8px 0 0;*/
/*    box-shadow: 0px 2px 8px 0px rgba(184, 184, 184, 0.25);*/
/*}*/

/*.select_cours_title_container {*/
/*    background-color: rgba(233, 236, 239, 0.3);*/
/*    display: flex;*/
/*    align-items: start;*/
/*    justify-content: start;*/
/*    flex-wrap: wrap;*/
/*    padding: 25px 25px;*/
/*    gap: 35px;*/
/*}*/

/*.select_cours_title_container_item {*/
/*    display: flex;*/
/*}*/

/*.select_cours_title_container_item_title {*/
/*    font-size: 16px;*/
/*    color: #6C757D;*/
/*    !*font-weight: bolder;*!*/
/*}*/

/*.select_cours_title_container_item_text {*/
/*    font-size: 16px;*/
/*    color: #0080FF;*/
/*    font-weight: 600;*/
/*    margin-right: 10px;*/
/*}*/

/*.tabel_select_course {*/
/*    width: 100%;*/
/*    border-spacing: 0;*/
/*}*/

/*.tabel_select_course tr td {*/
/*    font-size: 16px;*/
/*    color: #495057;*/
/*    padding: 20px 8px;*/
/*    border-bottom: 1px solid #E9ECEF;*/
/*}*/

/*.tabel_select_course_statuce {*/
/*    font-weight: 600;*/
/*}*/

/*.tabel_select_course_statuce.tabel_select_course_color_1 {*/
/*    color: #FF7051;*/
/*}*/

/*.tabel_select_course_statuce.tabel_select_course_color_2 {*/
/*    color: #00D06C;*/
/*}*/

/*.tabel_select_course_statuce.tabel_select_course_color_3 {*/
/*    color: #0096C7;*/
/*}*/

/*.tabel_select_course_vahed {*/
/*    font-weight: 500;*/
/*}*/

/*.tabel_select_course_number {*/
/*    font-weight: 500;*/
/*}*/

/*.tabel_select_course_butten {*/
/*    display: flex;*/
/*    align-items: center;*/
/*    justify-content: center;*/
/*}*/

/*.butten_select_course {*/
/*    background-color: #0096C7;*/
/*    color: white;*/
/*    outline: none;*/
/*    border: none;*/
/*    border-radius: 8px;*/
/*    padding: 10px 8px;*/
/*    font-size: 14px;*/
/*    width: 100%;*/
/*    max-width: 98px;*/
/*    font-weight: 600;*/
/*}*/

/*.butten_select_course.active {*/
/*    background-color: white;*/
/*    color: #0096C7;*/
/*    border: 1px solid #0096C7;*/
/*}*/

/*.tabel_select_course_butten button:hover {*/
/*    cursor: pointer;*/
/*}*/

/*.select_cours_butten {*/
/*    width: 100%;*/
/*    display: flex;*/
/*    align-items: start;*/
/*    justify-content: start;*/
/*    text-align: center;*/
/*    padding: 20px 20px;*/
/*}*/

/*.select_cours_butten {*/
/*    margin: 15px;*/
/*    background-color: #9C9C9C;*/
/*    color: white;*/
/*    outline: none;*/
/*    border: none;*/
/*    border-radius: 8px;*/
/*    padding: 10px 8px;*/
/*    font-size: 16px;*/
/*    width: 100%;*/
/*    max-width: 200px;*/
/*    display: flex;*/
/*    align-items: center;*/
/*    justify-content: center;*/
/*}*/

/*.select_cours_butten.active {*/
/*    background-color: #01CC52;*/
/*}*/

/*.select_cours_butten svg {*/
/*    width: 24px;*/
/*    height: auto;*/
/*    margin-left: 10px;*/
/*}*/

/*.dont_have_report_select_cours {*/
/*    font-size: 14px;*/
/*    margin-bottom: 15px;*/
/*    color: #495057;*/
/*}*/

/*.dont_have_report_select_cours span {*/
/*    color: #0096C7;*/
/*    font-weight: 600;*/
/*}*/

/* select course responsive */

/*.select_cours_responsive {*/
/*    display: none;*/
/*}*/

/*.select_cours_box_item {*/
/*    width: 100%;*/
/*    background-color: rgba(233, 236, 239, 0.3);*/
/*    border: 1px solid #C2CAD1;*/
/*    padding: 12px;*/
/*    border-radius: 8px;*/
/*    margin-bottom: 18px;*/
/*}*/

/*.select_cours_box_item_container {*/
/*    display: flex;*/
/*    align-items: center;*/
/*    justify-content: space-between;*/
/*    margin-bottom: 20px;*/

/*    font-size: 13px;*/
/*    color: #6C757D;*/
/*    font-weight: 600;*/
/*}*/

/*.select_cours_box_item_title {*/
/*    width: 50%;*/
/*}*/

/*.select_cours_box_item_text {*/
/*    font-size: 13px;*/
/*    color: #0080FF;*/
/*    font-weight: 600;*/
/*    width: 50%;*/
/*    text-align: end;*/
/*}*/

/*.select_cours_box_item_butten {*/
/*    width: 100%;*/
/*    display: flex;*/
/*    align-items: center;*/
/*    justify-content: center;*/
/*    background-color: #9C9C9C;*/
/*    border-radius: 8px;*/
/*    font-size: 12px;*/
/*    padding: 8px;*/
/*    color: #fff;*/
/*}*/

/*.select_cours_box_item_butten.active {*/
/*    background-color: #01CC52;*/
/*}*/

/*.select_cours_box_item_butten svg {*/
/*    margin-left: 10px;*/
/*    width: 18px;*/
/*    height: auto;*/
/*}*/

/*.select_cours_box_show_select_cours_container {*/
/*    background-color: white;*/
/*    padding: 12px;*/
/*    box-shadow: 0px 2px 8px 0px rgba(184, 184, 184, 0.25);*/
/*    border-radius: 12px;*/
/*    margin-bottom: 18px;*/
/*}*/

/*.select_cours_box_show_select_cours_item {*/
/*    display: flex;*/
/*    align-items: center;*/
/*    justify-content: space-between;*/
/*    width: 100%;*/
/*    font-size: 14px;*/
/*    color: #495057;*/
/*    margin-bottom: 23px;*/
/*}*/

/*.select_cours_box_show_select_cours_name_cours {*/
/*    font-weight: bold;*/
/*}*/

/*.select_cours_box_show_select_cours_status {*/
/*    font-weight: 600;*/
/*}*/

/*.select_cours_box_show_select_cours_status_color_1 {*/
/*    color: #FF7051;*/
/*}*/
/*.select_cours_box_show_select_cours_status_color_2 {*/
/*    color: #00D06C;*/
/*}*/
/*.select_cours_box_show_select_cours_status_color_3 {*/
/*    color: #0096C7;*/
/*}*/
/*.select_cours_box_show_select_cours_status_color_4 {*/
/*    color: #ff0000;*/
/*}*/

/*.select_cours_box_show_select_cours_container.have_butten .select_cours_box_show_select_cours_item:last-child {*/
/*    margin-bottom: 0px;*/
/*}*/

/*.select_cours_box_show_select_cours_item_container {*/
/*    width: 100%;*/
/*    display: flex;*/
/*    align-items: center;*/
/*    justify-content: center;*/
/*}*/

/*.select_cours_box_show_select_cours_item_butten {*/
/*    color: white;*/
/*    background-color: #0096C7;*/
/*    width: 100%;*/
/*    max-width: 180px;*/
/*    text-align: center;*/
/*    padding: 8px;*/
/*    border-radius: 8px;*/
/*    border: none;*/
/*}*/

/*.select_cours_box_show_select_cours_item_butten.active {*/
/*    color: #0096C7;*/
/*    border: #0096C7 2px solid;*/
/*    background-color: white;*/
/*    width: 100%;*/
/*    max-width: 180px;*/
/*    text-align: center;*/
/*    padding: 8px;*/
/*    border-radius: 8px;*/
/*}*/

/*.tabel_select_course_name_course {*/
/*    width: 40%;*/
/*}*/

/*.tabel_select_course_name_course span{*/
/*    font-size: 14px;*/
/*    color: #7b9aaf;*/
/*}*/

/*.tabel_select_course_price {*/
/*    font-size: 14px;*/
/*    color: #7b9aaf;*/
/*}*/

/*@media (max-width: 427px) {*/

/*    .select_cours {*/
/*        display: none;*/
/*    }*/

/*    .select_cours_responsive {*/
/*        display: block;*/
/*    }*/

/*    .dont_have_report_select_cours {*/
/*        line-height: 25px;*/
/*    }*/
/*}*/


/* ---------------------------------------- */
/* financial_report_container */
/* ---------------------------------------- */


.financial_report_container {
    background-color: white;
    padding-top: 18px;
    border-radius: 8px 8px 0 0;
    box-shadow: 0px 2px 8px 0px rgba(184, 184, 184, 0.25);
}

.financial_report_tabel {
    width: 100%;
    text-align: center;
    border-spacing: 0;
    font-size: 16px;
    color: #495057;
}

.financial_report_tabel thead {
    background-color: rgba(233, 236, 239, 0.3);
}

.financial_report_tabel thead tr th {
    padding: 15px 0px;
    font-size: 16px;
    font-weight: normal;
    color: #6C757D;
}

.financial_report_tabel tbody tr td {
    border-bottom: 1px solid #E9ECEF;
    padding: 20px 8px;
}

.financial_report_tabel_status.color_1 {
    text-align: center;
    font-size: 14px;
    color: #7b9aaf;
    width: 30%;
}

.financial_report_tabel_status_pay {
    font-size: 16px;
}

.financial_report_tabel_status_pay.color_green {
    /*color: #00D06C;*/
}

.financial_report_tabel_status_pay_complit_pay {
    border: none;
    outline: none;
    background-color: #01CC52;
    color: #fff;
    font-weight: 600;

    padding: 10px 20px;
    border-radius: 5px;
}

.financial_report_tabel_status_pay .pay_wait_for_check {
    color: #ca4e00;
}

.financial_report_tabel_money {
    font-weight: 600;
    color: #0096C7;
}

/* financial report container responsive */

.financial_report_tabel_container {
    padding: 18px;
    display: none;
}

.financial_report_tabel_container_container {
    font-size: 13px;
    color: #333333;
    border-bottom: 1px solid #CDCDCD;
    margin-top: 18px;
}

.financial_report_tabel_container_container:last-child {
    border-bottom: none;
}

.financial_report_tabel_container_container:first-child {
    margin-top: 0px;
}


.financial_report_tabel_container_container_item {
    display: flex;
    justify-content: space-between;
    margin-bottom: 15px;
}

.financial_report_tabel_container_container_item_title {
    font-weight: 600;
}

.dont_have_report {
    font-size: 14px;
}

.cours_financial_report {
    color: #616161;
    font-size: 12px;
}

@media (max-width: 427px) {

    .financial_report_tabel {
        display: none;
    }

    .financial_report_container {
        padding-top: 0px;
    }

    .financial_report_tabel_container {
        display: block;
    }
}



/* ---------------------------------------- */
/* profile */
/* ---------------------------------------- */

.panel_profile_container {
    background-color: white;
    border-radius: 8px;
    box-shadow: 0px 2px 8px 0px rgba(184, 184, 184, 0.25);
    padding: 24px;
}

.panel_profile_container_fild {
    /*display: flex;*/
    /*align-items: start;*/
    /*justify-content: start;*/
    /*flex-wrap: wrap;*/
    /*gap: 20px;*/
}

.panel_profile_container_item {
    padding-right: 5px;
    padding-left: 5px;
}

.panel_profile_container_item p {
    font-size: 14px;
    margin-bottom: 4px;
}

.panel_profile_container_item input {
    border-radius: 8px;
    border: 1px solid #A9B5C6;
    padding: 9px;
    outline: none;
    width: 100%;
    font-size: 14px;
}

.panel_profile_container_item input::placeholder {
    font-size: 14px;
    color: #A9B5C6;
    padding: 9px 0 9px 0;
}

.panel_profile_container_butten {
    display: flex;
    align-items: end;
    justify-content: end;
    width: 100%;
    margin-top: 24px;
}

.panel_profile_container_butten button {
    color: white;
    background-color: #00B4D8;
    font-size: 16px;
    padding: 10px 16px;
    border-radius: 8px;
    outline: none;
    border: none;
    font-weight:600;
}


@media (max-width: 427px) {

    .panel_profile_container {
        padding: 12px;
    }

    .panel_profile_container_butten {
        align-items: center;
        justify-content: center;
    }

    .panel_profile_container_item {
        width: 100%;
    }

    .panel_profile_container_fild {
        gap: 20px;
    }

    .panel_profile_container_item input {
        max-width: 100%;
    }
}



/*!* ---------------------------------------- *!*/
/*!* popup show view *!*/
/*!* ---------------------------------------- *!*/


/* .video-trigger {*/
/*     background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);*/
/*     color: white;*/
/*     border: none;*/
/*     padding: 15px 30px;*/
/*     border-radius: 50px;*/
/*     font-size: 18px;*/
/*     cursor: pointer;*/
/*     transition: all 0.3s ease;*/
/*     box-shadow: 0 8px 25px rgba(102, 126, 234, 0.3);*/
/* }*/

/*.video-trigger:hover {*/
/*    transform: translateY(-2px);*/
/*    box-shadow: 0 12px 35px rgba(102, 126, 234, 0.4);*/
/*}*/

/*!* Overlay *!*/
/*.video-overlay {*/
/*    position: fixed;*/
/*    top: 0;*/
/*    left: 0;*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    background: rgba(0, 0, 0, 0.8);*/
/*    backdrop-filter: blur(5px);*/
/*    display: flex;*/
/*    justify-content: center;*/
/*    align-items: center;*/
/*    z-index: 1000;*/
/*    opacity: 0;*/
/*    visibility: hidden;*/
/*    transition: all 0.3s ease;*/
/*}*/

/*.video-overlay.active {*/
/*    opacity: 1;*/
/*    visibility: visible;*/
/*}*/

/*!* Video Container *!*/
/*.video-container {*/
/*    position: relative;*/
/*    background: white;*/
/*    border-radius: 20px;*/
/*    padding: 20px;*/
/*    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.3);*/
/*    !*max-width: 90vw;*!*/
/*    max-height: 90vh;*/
/*    transform: scale(0.8);*/
/*    transition: all 0.3s ease;*/
/*    width: 100%;*/
/*    max-width: 568px;*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*    text-align: center;*/

/*}*/

/*.video-overlay.active .video-container {*/
/*    transform: scale(1);*/
/*}*/

/*!* Close Button *!*/
/*.close-btn {*/
/*    position: absolute;*/
/*    top: -10px;*/
/*    right: -10px;*/
/*    width: 40px;*/
/*    height: 40px;*/
/*    background: #ff4757;*/
/*    color: white;*/
/*    border: none;*/
/*    border-radius: 50%;*/
/*    font-size: 20px;*/
/*    cursor: pointer;*/
/*    display: flex;*/
/*    align-items: center;*/
/*    justify-content: center;*/
/*    transition: all 0.3s ease;*/
/*    z-index: 1001;*/
/*}*/

/*.close-btn:hover {*/
/*    background: #ff3742;*/
/*    transform: scale(1.1);*/
/*}*/

/*!* Video Element *!*/
/*.video-player {*/
/*    width: 100%;*/
/*    max-width: 800px;*/
/*    height: auto;*/
/*    border-radius: 15px;*/
/*    outline: none;*/
/*}*/

/*!* Video Info *!*/
/*.video-info {*/
/*    text-align: center;*/
/*    margin-top: 15px;*/
/*    color: #333;*/
/*}*/

/*.video-title {*/
/*    font-size: 24px;*/
/*    font-weight: bold;*/
/*    margin-bottom: 8px;*/
/*    color: #2c3e50;*/
/*}*/

/*.video-description {*/
/*    color: #7f8c8d;*/
/*    line-height: 1.6;*/
/*}*/

/*!* Loading Animation *!*/
/*.loading {*/
/*    display: flex;*/
/*    justify-content: center;*/
/*    align-items: center;*/
/*    height: 300px;*/
/*}*/

/*.loading::after {*/
/*    content: '';*/
/*    width: 40px;*/
/*    height: 40px;*/
/*    border: 4px solid #f3f3f3;*/
/*    border-top: 4px solid #667eea;*/
/*    border-radius: 50%;*/
/*    animation: spin 1s linear infinite;*/
/*}*/

/*@keyframes spin {*/
/*    0% { transform: rotate(0deg); }*/
/*    100% { transform: rotate(360deg); }*/
/*}*/

/*!* Responsive Design *!*/
/*@media (max-width: 768px) {*/
/*    .video-container {*/
/*        margin: 20px;*/
/*        padding: 15px;*/
/*    }*/

/*    .video-title {*/
/*        font-size: 20px;*/
/*    }*/

/*    .close-btn {*/
/*        width: 35px;*/
/*        height: 35px;*/
/*        font-size: 18px;*/
/*    }*/
/*}*/


/* ----------------------- */
/* weekly_schedule */

.weekly_schedule_container_parent {
    width: 100%;
    box-shadow: 1px 2px 8px 1px rgba(184, 184, 184, 0.25);
    border-radius: 8px;
}

.weekly_schedule_container {
    display: flex;
    align-items: start;
    justify-content: start;
    flex-direction: row;
    flex-wrap: wrap;
    background-color: rgba(233, 236, 239, 0.3);
    width: 100%;
    border-radius: 8px;
    padding: 12px 25px;
}

.weekly_schedule_container_user_pass {
    display: flex;
    align-items: start;
    justify-content: start;
    gap: 8px;
    flex-direction: column;
}

.weekly_schedule_container_description {
    font-size: 16px;
    color: black;
}

.weekly_schedule_container_user_pass_container {
    display: flex;
    align-items: start;
    justify-content: start;
    flex-direction: row;
    gap: 20px;
}

.weekly_schedule_container_item {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
}

.weekly_schedule_container_item_text_info {
    color: #6C757D;
    margin-left: 5px;
}

.weekly_schedule_container_item_text_data {
    color: #0080FF;
    font-weight: 600;
}

.weekly_schedule_container_parent_header {
    padding-top: 19px;
    background-color: white;
    border-radius: 8px;
}

.weekly_schedule_container_select_term {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
}

.weekly_schedule_container_select_term p {
    color: #6C757D;
}

.weekly_schedule_container_select_term select {
    padding: 10px 16px;
    border-radius: 8px;
    border: 2px #2B6CB0 solid;
    background-color: transparent;
    color: #2B6CB0;
    font-size: 16px;
    font-weight: 600;
    outline: none;
}

.weekly_schedule_container_parent_item {
    margin-top: 28px;
    width: 100%;
    background-color: #fff;
    box-shadow: 1px 2px 8px 1px rgba(184, 184, 184, 0.25);
    border-radius: 8px;
}

.weekly_schedule_container_parent_item_header {
    display: flex;
    align-items: start;
    justify-content: start;
    background-color: #F8F9FA;
    width: 100%;
    padding: 13px 25px;
}

.weekly_schedule_container_parent_item_header p {
    font-size: 15px;
    color: #6C757D;
    font-weight: 600;
}

.weekly_schedule_container_parent_item_cours {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 25px;
    border-bottom: 1px solid #E9EDF0;
}

.weekly_schedule_container_parent_item_cours:last-child {
    border-bottom: none;
}

.weekly_schedule_container_parent_item_cours_name {
    font-size: 14px;
    color: #6C757D;
    font-weight: 500;
    margin-bottom: 7px;
}

.weekly_schedule_container_parent_item_cours_time {
    font-size: 14px;
    color: #8E97A0;
}

.weekly_schedule_container_parent_item_cours a {
    background-color: #00ACE2;
    border-radius: 8px;
    padding: 10px 16px;
    color: #fff;
    font-size: 14px;
}

.undifilne_cours_from_mycours_select {
    padding: 20px 12px;
    font-size: 16px;
}


/* ----------------------- */
/* weekly_schedule */

@media ( max-width: 768px ) {

    .weekly_schedule_container_parent {
        box-shadow: none;
    }

    .weekly_schedule_container_parent_header {
        padding-top: 0;
    }

    .weekly_schedule_container {
        background-color: #E9ECEF;
        border: 1px solid #C2CAD1;
        padding: 12px;
    }

    .weekly_schedule_container_user_pass {
        display: flex;
        align-items: start;
        justify-content: start;
        flex-direction: column;
        width: 100%;
        gap: 10px;
    }

    .weekly_schedule_container_user_pass_container {
        display: flex;
        align-items: start;
        justify-content: start;
        flex-direction: column;
        width: 100%;
        gap: 12px;
    }

    .weekly_schedule_container_description {
        font-size: 14px;
    }

    .weekly_schedule_container_item {
        justify-content: space-between;
        font-size: 13px;
        width: 100%;
    }

    .weekly_schedule_container_parent_item {
        margin-top: 28px;
        width: 100%;
        box-shadow: 1px 2px 8px 1px rgba(184, 184, 184, 0.25);
        padding: 12px;
        border: 1px #C3C9CF solid;
        background-color: white;
        border-radius: 5px;
        margin-bottom: 15px;
    }

    .weekly_schedule_container_parent_item_header {
        padding: 12px;
    }

    .weekly_schedule_container_parent_item_cours {
        padding: 12px 0px;
    }

    .weekly_schedule_container_parent_item_cours_name {
        font-size: 12px;
    }

    .weekly_schedule_container_parent_item_cours_time {
        font-size: 12px;
    }

    .weekly_schedule_container_parent_item_cours a {
        padding: 8px;
        font-size: 12px;
    }


    .undifilne_cours_from_mycours_select {
        padding: 15px 12px;
        font-size: 14px;
    }

}





















/* ---------------------------------------- */
/* select course */
/* ---------------------------------------- */


/*header*/

.container_select_course {
    background-color: white;
    width: 100%;
    border-radius: 8px;
    box-shadow: 0px 2px 8px 0 #b8b7b724;
    padding-bottom: 15px;
}

.container_select_course_info_term {
    background-color: rgba(233, 236, 239, 0.5);
    width: 100%;
    padding: 10px 20px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.container_select_course_text_start_select_course {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 17px ;
}

.container_select_course_text_start_select_course_p {
    font-size: 14px;
    color: #495357;
}

.container_select_course_text_start_select_course_p span {
    color: #0080FF;
    font-weight: 500;
}

.container_select_course_info_term_container {
    display: flex;
    align-items: start;
    justify-content: start;
    flex-direction: row;
    gap: 35px;
    flex-wrap: wrap;
}

.container_select_course_text_container {
    display: flex;
    align-items: start;
    justify-content: start;
    flex-direction: row;
    font-size: 16px;
}

.container_select_course_text_container_title {
    color: #6C757D;
}

.container_select_course_text_container_des {
    color: #0080FF;
    font-weight: 500;
    margin-right: 5px;
}

.butten_compelite_select_course_filter {
    display: flex;
    gap: 10px;
}

.butten_compelite_select_cours {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row-reverse;
    flex-wrap: nowrap;
    border-radius: 5px;
    width: fit-content;
    color: #fff;
    padding: 7px 16px;
    font-size: 14px;
    background-color: #888888;
}

.butten_compelite_select_cours.active {
    background-color: #01CC52;
}

.butten_compelite_select_cours svg {
    margin-left: 9px;
    width: 20px;
    height: auto;
}

#package_filter {
    border-radius: 5px;
    color: #000000;
    padding: 7px 16px;
    font-size: 14px;
    background-color: #fff;
    outline: none;
    border: 2px solid #888888;
}



/* body */
/* show box */

.kelasto_show_cours_package_container {
    display: none;
    padding: 15px;
    background-color: #fff;
    /*border-top: 1px solid #EEEEEE;*/
    border-bottom: 1px solid #cdcdcd;
}

.kelasto_show_cours_package_container:last-child {

    border-bottom: none;
}

.kelasto_show_cours_package_container.active {
    display: block;
}

.kelasto_show_cours_package_container_title {
    color: #495357;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 20px;
}

/* pupop info */
.kelasto_show_single_course_container_icon_info_container {
    display: flex;
    align-items: center;
    position: relative;
}

.label_show_info_lable_show_course {
    position: absolute;
    top: 0px;
    right: 0px;
    background-color: #657BE8;
    border: 1px solid #2E43AA;
    border-radius: 8px 0px 8px 8px;
    padding: 9px;
    min-width: 230px;
    color: white;

    transition: all 0.5s ease;
    visibility: hidden;
    opacity: 0;

    z-index: 20;
}

.kelasto_show_single_course_container_icon_info_container:hover .label_show_info_lable_show_course  {
    transition: all 0.5s ease;
    visibility: visible;
    opacity: 1;
}

.label_show_info_lable_show_course_item {
    display: flex;
    align-items: start;
    justify-content: start;
    color: #fff;
    gap: 3px;
    margin-bottom: 8px;
}

.label_show_info_lable_show_course_item:last-child {
    margin-bottom: 0px;
}

.label_show_info_lable_show_course_item p {
    font-size: 13px;
}

.label_show_info_lable_show_course_item span {
    font-size: 13px;
    font-weight: 600;
}

/* single_cours */

.kelasto_show_single_course_container_name_time_info {
    display: flex;
    align-items: center;
}

.kelasto_show_single_course_container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    background-color: #F7FAFC;
    border: 1px solid #D2DAE5;
    padding: 12px 12px;
    border-radius: 8px;
    gap: 5px;
    position: relative;
    margin-bottom: 10px;
}

.kelasto_show_single_course_container.boxMode {
    /*background-color: #016307;*/
    /*border: 1px solid #003604;*/

    /*background-color: #2e586c;*/

    background-color: #3e728a;
    border: 1px solid #2d5b70;
}

.kelasto_show_single_course_container:last-child {
    margin-bottom: 0px;
}

.icon_info_resoinsive {
    position: absolute;
    top: 5px;
    left: 5px;
    display: none;
    align-items: start;
    justify-content: end;
    z-index: 9;
}

.label_show_info_lable_show_course_responsive {

    display: flex;
    flex-direction: column;

    position: absolute;
    background-color: #657BE8;
    border: 1px solid #2E43AA;
    border-radius: 0px 8px 8px 8px;
    padding: 9px;
    min-width: 230px;
    color: white;

    transition: all 0.5s ease;
    visibility: hidden;
    opacity: 0;

    z-index: 20;
}

.icon_info_resoinsive:hover .label_show_info_lable_show_course_responsive {
    transition: all 0.5s ease;
    visibility: visible;
    opacity: 1;
}

.kelasto_show_single_course_container_icon_info {
    width: 24px;
    height: auto;
}

.kelasto_show_single_course_container_name_time {
    display: flex;
    align-items: start;
    justify-content: start;
    flex-direction: column;

    margin-right: 10px;
}

.kelasto_show_single_course_container_name_cours {
    color: #2f383d;
    font-size: 14px;
    margin-bottom: 5px;
    font-weight: 700;
}

.kelasto_show_single_course_container_name_cours.boxMode {
    color: #fff;
}

.kelasto_show_single_course_container_time {
    color: #485359;
    font-size: 14px;
    font-weight: 600;
}

.kelasto_show_single_course_container_time span {
    font-weight: 400;
}

.kelasto_show_single_course_container_price_container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: start;

    min-width: 20%;
}

.kelasto_show_single_course_container_price_container p {
    font-weight: 600;
    color: #495357;
    font-size: 16px;
}

.kelasto_show_single_course_container_price_container p.boxMode {
    color: #fff;
}

.kelasto_show_single_course_container_price_container_discount {
    display: flex;
    gap: 5px;
}

.kelasto_show_single_course_container_price_container_discount_price {
    font-size: 12px !important;
    font-weight: 400 !important;
    color: #7A8296 !important;
    text-decoration: line-through;
}

.kelasto_show_single_course_container_price_container_discount_price.boxMode {
    color: #fff !important;
}

.kelasto_show_single_course_container_price_container_discount_number {
    color: #FF0000 !important;;
    font-size: 12px !important;
    font-weight: bold !important;
}

.kelasto_show_single_course_container_price_container_discount_number.boxMode   {
    /*color: #9aff6f  !important;*/
    color: #aafbff  !important;
}

.kelasto_show_butten_container {
    display: flex;
    align-items: center;
    justify-content: start;
    flex-direction: column;
}

.kelasto_show_single_course_container_butten_container {
    display: none;
    align-items: center;
    justify-content: end;
    gap: 10px;

}

.kelasto_show_single_course_container_butten_container.active {
    display: flex;
}

.kelasto_show_butten_text_up {
    font-size: 12px;
    color: #484d59;
    font-weight: 500;
    margin-bottom: 5px;
}

.kelasto_show_butten_text_up span {
    color: #FF0000;
    font-weight: bold;
}

.kelasto_show_butten_text_up.boxMode {
    color: #fff;
}


.kelasto_show_butten_text_up.boxMode span {
    /*color: #9aff6f ;*/
    color: #b4fff1 ;
    font-weight: bold;
}

.kelasto_show_butten_gher_hozory {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 8px 9px;
    background-color: #657BE8;
    gap: 10px;
    font-weight: 400;
    color: white;
    border: none;
    border-radius: 4px;
}

.kelasto_show_single_course_container.boxMode .kelasto_show_butten_gher_hozory {
    background-color: #ffffff;
    color: #173f51;
    font-weight: 600;
}

.kelasto_show_single_course_container.boxMode .kelasto_show_butten_gher_hozory path {
    stroke: #173f51;
}


.kelasto_show_butten_hozory {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 8px 9px;
    background-color: #46B876;
    gap: 10px;
    font-weight: 400;
    color: white;
    border: none;
    border-radius: 4px;
}

.kelasto_show_butten_gher_hozory.fill {
    background-color: #777;
}

.kelasto_show_butten_hozory.fill {
    background-color: #777;
}

.kelasto_show_single_course_container_butten_container button {
    cursor: pointer;
}

.text_get_course {
    color: #495357;
    font-weight: 600;
    font-size: 14px;
}

.text_get_course.boxMode {
    color: #fff;
}

.cansel_butten_select_cours button {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 8px 9px;
    gap: 10px;
    font-weight: 400;
    color: white;
    border: none;
    border-radius: 4px;
}

.cansel_butten_select_cours button {
    /*background-color: #C93434;*/
    background-color: #FF3131;
}

.you_have_already_taken_this_course {
    color: #485359;
    font-size: 14px;
    font-weight: 600;
}

.you_have_already_taken_this_course.boxMode {
    color: #fff;
}

/*responsive*/

@media ( max-width: 768px ) {

    .kelasto_show_butten_text_up {
           margin-bottom: 8px;
    }

    .container_select_course {
        box-shadow: none;
        background-color: transparent;
    }

    .container_select_course_text_start_select_course {
        padding: 0px 0px 17px 0px;
    }

    .container_select_course_text_start_select_course_p {
        font-size: 12px;
    }

    .container_select_course_info_term_container {
        align-items: center;
        justify-content: center;
        flex-direction: column;
        gap: 0px;
        flex-wrap: wrap;
        width: 100%;
    }

    .container_select_course_info_term {
        padding: 12px;
        flex-direction: column;
        justify-content: center;
        background-color: #e9ecefd1;
        border: 1px solid #C2CAD1;
        border-radius: 5px;
        margin-bottom: 15px;
    }

    .container_select_course_text_container {
        justify-content: space-between;
        font-size: 13px;
        width: 100%;
        margin-bottom: 17px;
        font-weight: 600;
    }

    .butten_compelite_select_cours {
        padding: 8px;
        font-size: 12px;
        width: 100%;
        border-radius: 5px;
    }

    #package_filter {
        padding: 8px;
        font-size: 12px;
        width: 60%;
        border-radius: 5px;
    }

    .butten_compelite_select_cours svg {
        margin-left: 10px;
        width: 18px;
        height: auto;
    }

    /* single_cours */

    .kelasto_show_single_course_container {
        flex-wrap: wrap;
        gap: 0px;
    }

    .kelasto_show_single_course_container_name_time_info {
        width: 60%;
    }

    .kelasto_show_single_course_container_price_container {
        width: 40%;
        align-items: end;
    }

    .kelasto_show_single_course_container_butten_container {
        width: 100%;
        justify-content: center;
        margin-top: 15px;
    }

}



@media ( max-width: 426px ) {

    .kelasto_show_single_course_container_name_time_info {
        width: 100%;
    }

    .kelasto_show_single_course_container_price_container {
        width: 100%;
        align-items: start;
        margin-top: 12px;
    }

    .kelasto_show_single_course_container_icon_info_container {
        display: none;
    }

    .kelasto_show_single_course_container_name_time {
        margin-right: 0px;
    }

    .kelasto_show_single_course_container_time {
        font-size: 13px;
    }

    .kelasto_show_single_course_container_price_container p {
        font-size: 14px;
    }


    .kelasto_show_cours_package_container {
        padding: 8px;
    }

    .kelasto_show_cours_package_container_title {
        color: #495357;
        font-size: 14px;
        font-weight: 600;
        margin-bottom: 12px;
    }

    .label_show_info_lable_show_course_item p {
        font-size: 12px;
    }

    .label_show_info_lable_show_course_item span {
        font-size: 12px;
    }

    .kelasto_show_single_course_container_butten_container {
        gap: 6px;
    }

    .kelasto_show_butten_gher_hozory {
        gap: 2px;
    }

    .kelasto_show_butten_container svg {
        width: 15px;
        height: auto;
    }

    .kelasto_show_butten_container button {
        padding: 10px 7px;
    }

    .kelasto_show_butten_container button p {
        font-size: 12px;
    }

    .icon_info_resoinsive {
        display: flex;
    }

    .text_get_course {
        font-size: 12px;
    }

}






