:root {
    --main-color: #011F57;
    --bar-h: 26px;
    /* bottom toolbar height */
    --right-w: 15%;
    /* width of the right control cluster */
    --edge-w: 18%;
}

body {
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    font-family: "poppinsregular", sans-serif;
    font-weight: normal;
    font-size: 14px;
    font-style: normal;
    color: var(--main-color);
}

.dev_tool_enabled {
    position: absolute;
    top: 0;
    left: 0;
    background-color: #000;
    color: #fff;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.full_screen_mode .smart_board_tabs {
    padding: 0;
}

.smart_board_icons a.zoom_out, 
.smart_board.sketch_frame .smart_board_teching_view .options_block .option.topic_menu, 
.smart_board.sketch_frame .smart_board_teching_view .options_block .option.topic_menu_content {
    display: none;
}

.full_screen_mode .topic_block,
.full_screen_mode .topic_block iframe,
.full_screen_mode .topic_block embed,
.full_screen_mode .topic_block audio,
.full_screen_mode .topic_block video,
.full_screen_mode .topic_block img {
    border-radius: 0;
}

.topic_block_sketch {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    transform: translateY(-100%);
    transition: transform .4s;
}

.topic_block_sketch div,
.topic_block_sketch iframe {
    width: 100%;
    height: 100%;
}

.sketch_frame .topic_block_sketch {
    transform: translateY(0);
}

.full_screen_mode .smart_board_icons a.zoom_out {
    display: block;
}

.full_screen_mode .smart_board_tab,
.full_screen_mode .smart_board_icons a.zoom_in {
    display: none;
}

.full_screen_mode .topic_block {
    height: 100%;
}

.smart_board .sidebar,
.smart_board .header {
    display: none;
}

.smart_board .wrapper {
    padding: 0
}

.smart_board .wrapper .content {
    width: 100%;
    padding: 0;
    overflow: hidden;
}

.content_area {
    min-height: 100px;
}

.smart_board .content_area {
    white-space: nowrap;
    transform: translateX(0);
    transition: transform .4s;
}

.smart_board .content_area>div {
    white-space: normal;
}

.smart_board .content_area.content_area_move {
    transform: translateX(-100%);
}

.smart_board .content {
    overflow: hidden;
}

.smart_board .content_area>div {
    display: inline-block;
}

.smart_board_tabs {
    width: 100%;
    height: 100vh;
    background: linear-gradient(121.65deg, #F9FBFF 2%, #BAD2FF 69.07%);
    padding: 60px 60px 40px;
}

.smart_board_tab {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 40px;
}

.topic_select {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.topic_select .dd .selected-item span {
    width: 330px;
}

.topic_select img {
    height: 56px;
    border-radius: 50px;
}

.topic_sel {
    padding-left: 27px;
}

.topic_sel_title {
    font-size: 14px;
    color: #1E2B42;
    font-weight: 400;
}

.inp_wrap {
    margin-top: 4px;
    position: relative;
}

.dd .selected-item span {
    font-size: 28px;
    line-height: 135%;
    color: var(--main-color);
    display: inline-block;
    width: 220px;
    text-overflow: ellipsis;
    overflow: hidden;
}

.inp_wrap .filter_dropdown {
    position: absolute;
    right: 0px;
    top: 50%;
    transform: translateY(-50%);
    width: 17px;
    height: 10px;
    z-index: 2;
    pointer-events: none;
}

.inp_wrap .filter_dropdown:before {
    content: '';
    position: absolute;
    width: 10px;
    height: 10px;
    top: -50%;
    left: 5%;
    border-bottom: 2px solid #1E2B42;
    border-right: 2px solid #1E2B42;
    transform: rotate(45deg);
}

.name {
    font-size: 15px;
    line-height: 1.2;
    color: #1E2B42;
}

.profile_log .topic_sel {
    padding-left: 0;
    padding-right: 20px;
}

.profile_log .topic_sel_title {
    text-align: right;
}

.profile_log .name {
    text-align: right;
    padding-top: 3px;
    white-space: nowrap;
    width: 124px;
    text-overflow: ellipsis;
    overflow: hidden;
}

.profile_log .inp_wrap {
    width: 15px;
    height: 15px;
    margin-left: 15px;
    margin-top: 0;
}

.topic_tab {
    display: inline-block;
    text-align: center;
}

.options_menu .topic_tab {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.topic_tit {
    display: block;
    font-size: 14px;
    color: var(--main-color);
}

.topic_ico {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 85px;
    height: 85px;
    background: #FFFFFF;
    border-radius: 50%;
    margin-top: 15px;
}

.topic_ico img {
    height: 35px;
}

.active .topic_ico {
    background: var(--color);
}

.active .topic_ico img {
    filter: invert(1);
}


.topic_block {
    background: #FFFFFFA8;
    width: 100%;
    height: calc(100% - 160px);
    border-radius: 50px;
    display: block;
    overflow: auto;
    position: relative;
}

.topic_block:after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: var(--right-w);
    height: var(--bar-h);
    pointer-events: auto;
    background: transparent;
    z-index: 555;
}

.topic_block:before {
    content: '';
    position: absolute;
    right: 0;
    bottom: 0;
    width: var(--right-w);
    height: var(--bar-h);
    pointer-events: auto;
    background: transparent;
    z-index: 555;
}

.topic_block>iframe,
.topic_block>div,
.topic_block embed,
.topic_block audio,
.topic_block video,
.topic_block img {
    position: relative;
    width: 100%;
    height: 100%;
}

.topic_block>div>iframe {
    position: relative;
    width: 100%;
    height: 100%;
}

.topic_block>div:before {
    content: '';
    position: absolute;
    right: 0;
    bottom: 0;
    width: var(--right-w);
    height: var(--bar-h);
    pointer-events: auto;
    background: transparent;
    z-index: 555;
}

.topic_block>div:after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: var(--right-w);
    height: var(--bar-h);
    pointer-events: auto;
    background: transparent;
    z-index: 555;
}

.multiple_file {
    margin-top: 10px
}

.multiple_file>* {
    display: inline-block;
    vertical-align: middle
}

.delete_mul_file {
    position: relative;
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-left: 10px;
}

.delete_mul_file:after,
.delete_mul_file:before {
    content: '';
    width: 100%;
    height: 2px;
    background-color: #000;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%) rotate(-45deg);
}

.delete_mul_file:before {
    transform: translate(-50%) rotate(45deg);
}

.topic_block>div {
    overflow: auto;
}

.topic_block img {
    object-fit: contain;
}

.topic_tabs {
    position: relative;
}

.swiper-button-next,
.swiper-button-prev {
    width: 30px;
    height: 100%;
    background-color: rgb(0 0 0 / 30%);
    border-radius: 5px;
    top: 0;
    margin: 0;
}

.swiper-button-next:after,
.swiper-button-prev:after {
    font-size: 16px;
    font-weight: 900;
    color: #fff;
}

.topic_tabs .swiper-button-disabled {
    display: none;
}

.swiper-button-next {
    right: 0px;
}

.swiper-button-prev {
    left: 0px;
}

.smart_board_tab .col._1 {
    width: 330px;
}

.smart_board_tab .col._2 {
    width: calc(100% - 560px);
    padding: 0 20px;
}

.smart_board_tab .col._3 {
    width: 230px;
}

.profile_log .dd .selected-item span {
    display: none;
}

.topic_sel_back {
    width: 60px;
    height: 60px;
    display: inline-block;
    margin-right: 20px;
    vertical-align: middle;
}

.smart_board_icons {
    position: absolute;
    right: 0;
    bottom: 50%;
    z-index: 999;
}

.smart_board_icons a {
    display: block;
    margin-top: 25px
}

.topic_block_embed_pdf {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 5%;
    background-color: #f7f7f7;
}

.smart_board_icons a img {
    width: 20px;
    height: auto;
}

.smart_board_icons a.zoom_out,
.smart_board_icons a.zoom_in {
    background-color: #000000;
    border-top-left-radius: 9px;
    border-bottom-left-radius: 9px;
    padding: 5px 5px 5px 7px;
}

.smart_board_icons a.zoom_in {
    background-color: #fff;
}

.sketch_icon {
    background-color: #fff;
    border-top-left-radius: 9px;
    border-top-right-radius: 9px;
    padding: 7px 7px 7px 8px;
    position: absolute;
    right: 0;
    bottom: 50%;
    transform: translateY(75px) rotate(-90deg);
    margin-right: -26px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sketch_icon img {
    margin-right: 5px;
}

.selected_topic {
    width: 100%;
    background: linear-gradient(121.65deg, #F9FBFF 2%, #BAD2FF 69.07%);
    padding: 60px 0 50px 70px;
    height: 100vh;
    white-space: normal;
}

.sec_title {
    font-size: 28px;
    line-height: 1.2;
    color: #1E2B42;
}

.topic_card {
    border-radius: 50px;
    background: #FFFFFFA8;
    display: block;
}

.image {
    position: relative;
    display: block;
}

.bg_full {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url() no-repeat 50% 50%;
    overflow: hidden;
    background-size: cover;
}

.topic_card .image .bg_full {
    border-radius: 50px 50px 0 0;
    background-color: #fff;
}

.topic_card .image {
    padding-top: 75%;
}



.col_4 {
    width: 25%;
}

.col_2 {
    width: 50%;
}

.col_full {
    width: 100%;
}

.file_attachment_section {
    position: relative;
}

.logo_preview {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: auto;
}

.topic_card_cont .title {
    font-size: 26px;
    line-height: 1.3;
    color: var(--main-color);
    transition: color .4s;
}

.topic_card:hover .title {
    color: #3078FF;
}

.topic_card_cont .desc {
    font-size: 16px;
    line-height: 1.2;
    color: #011F57;
    margin-top: 20px;
}

.topic_card_cont {
    padding: 35px 40px 40px;
}

.sel_topic {
    padding-top: 35px;
}

.standard .dd .selected-item span {
    width: 40px;
}

.lecture_dropdown .dd .selected-item span {
    width: 200px;
}

.subject .dd .selected-item span {
    width: 155px;
}

.lecture .dd .selected-item span {
    width: 270px;
}

.topic_sel_details .topic_sel {
    padding-left: 0;
    display: inline-block;
    vertical-align: middle;
}

.topic_sel_details .topic_sel+.topic_sel {
    padding-left: 40px;
}

.topic_sel_details {
    padding-top: 45px;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.topic_sel_details .col._1 {
    width: 80%;
}

.topic_sel_details .col._2 {
    width: 20%;
}

.swiper_inner {
    position: relative;
    max-width: 190px;
    margin-left: auto;
    height: 85px;
    display: block;
}

.swiper_inner .swiper-button-next:after,
.swiper_inner .swiper-button-prev:after {
    font-size: 34px;
    font-weight: 500;
    color: #011F57;
}

.swiper_inner .swiper-button-next,
.swiper_inner .swiper-button-prev {
    width: 75px;
    height: 75px;
    border-radius: 90px;
    background-color: #FFFFFF;
    top: 0;
    margin-top: 0;
}

.swiper_inner .swiper-button-next {
    right: 0;
}

.swiper_inner .swiper-button-prev {
    left: 0;
}

.selected_topic .topic_sel_details,
.selected_topic .sec_title {
    padding-right: 80px;
}

.teacher_menu_selection,
.topic_select.profile_log {
    position: relative;
    cursor: pointer;
}

.topic_select.profile_log img {
    height: 50px;
    border: 1px solid #000;
    border-radius: 40px;
}

.topic_select_a {
    display: flex;
    align-items: center;
}

.topic_select.profile_log:hover .teacher_menu,
.teacher_menu_selection:hover .teacher_menu,
.menu_active .teacher_menu {
    opacity: 1;
    visibility: visible;
}

.teacher_menu {
    position: absolute;
    right: 0px;
    top: 20px;
    width: 130px;
    display: block;
    background-color: #fff;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s, visibility 0.4s;
    border-radius: 10px;
}

.teacher_menu li {
    width: 100%;
    display: block;
}

.teacher_menu li a {
    font-size: 14px;
    color: #000000;
    display: block;
    width: 100%;
    padding: 10px 15px;
}


body {
    background-color: #FAFAFA;
}

.header {
    position: fixed;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 999;
}

.com_head {
    padding: 20px 35px;
    background: linear-gradient(90deg, #0084FF 1.44%, #003CFF 100%);
}

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

.com_head .row .col {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
}

.breadcrumb {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.breadcrumb img {
    height: 22px;
}

.breadcrumb span {
    font-family: 'poppinsmedium';
    font-size: 18px;
    line-height: 1.6;
    color: #FFFFFF;
    padding-left: 20px;
    position: relative;
    min-height: 20px;
}

.breadcrumb span+span {
    padding-left: 50px;
}

.breadcrumb span+span:after {
    content: '';
    position: absolute;
    width: 10px;
    height: 10px;
    top: 7px;
    left: 13px;
    border-bottom: 2px solid #FFFFFF;
    border-right: 2px solid #FFFFFF;
    transform: rotate(-45deg);
}

.create {
    font-family: 'poppinsmedium';
    font-size: 18px;
    color: #FFFFFF;
    display: inline-flex;
    align-items: center;
}

.create span {
    padding-left: 10px;
}

.profile_select {
    display: inline-flex;
    align-items: center;
    margin-left: 45px;
    padding-left: 35px;
}

.profile_select .name {
    font-size: 18px;
    line-height: 1.12;
    text-align: right;
    color: #FFFFFF;
}

.profile_select img {
    height: 40px;
    border: 2px solid #FFFFFF;
    border-radius: 40px;
}

.profile_select .inp_wrap {
    padding-right: 15px;
}

.profile_select .inp_wrap .filter_dropdown {
    right: auto;
    left: -30px;
}

.profile_select .inp_wrap .filter_dropdown:before {
    border-bottom: 2px solid #FFFFFF;
    border-right: 2px solid #FFFFFF;
}

.wrapper {
    display: flex;
    flex-direction: row;
    position: relative;
    padding-top: 80px;
    padding-left: 380px;
}

.wrapper .sidebar {
    background: #FAFAFA;
    padding: 40px 0 30px 30px;
    width: 380px;
    position: fixed;
    left: 0;
    height: 100%;
}

.topic_tabs .swiper-slide {
    width: auto;
}

.topic_tabs .swiper-wrapper {
    justify-content: center;
}

.wrapper .content {
    width: 100%;
    padding: 40px 40px 40px 50px;
    overflow: hidden;
}

.sidebar ul {
    list-style: none;
}

.sidebar ul li+li {
    margin-top: 10px;
}

.sidebar ul li a {
    display: flex;
    background-color: transparent;
    align-items: center;
    flex-direction: row;
    padding: 15px 12px;
}

.sidebar ul li a.active {
    background-color: #EBEBEB;
}

.sidebar ul li a:hover {
    background-color: #EBEBEB;
}

.sidebar ul li a img {
    height: 24px;
}

.sidebar ul li a span {
    display: inline-block;
    padding-left: 20px;
    font-size: 16px;
    line-height: 1;
    color: #333333;
}

.card_grid .row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
}

.card_grid .col {
    display: inline-block;
    vertical-align: middle;
    padding: 0 5px;
    margin-top: 10px;
}

.card {
    background: #FFFFFF;
    box-shadow: 0px 2px 4px 0px #00000029;
    padding: 20px 20px 30px 20px;
}

.card .number {
    font-size: 51px;
    line-height: 1.1;
    color: #000000;
}

.card .title {
    font-size: 18px;
    line-height: 1.1;
    color: #000000;
    margin-top: 40px;
}

.card .desc {
    font-size: 16px;
    line-height: 1.25;
    color: rgb(0 0 0 / 50%);
    margin-top: 15px;
}

.height_330 {
    height: 330px;
}

.login_page {
    width: 100%;
    min-height: 100vh;
    display: flex;
    background: linear-gradient(106.11deg, #0082FF 0.83%, #003DFF 99.42%);
}

.login_form_box {
    background: #FFFFFF;
    box-shadow: 0px 2px 4px 0px #00000029;
    padding: 30px 35px;
    margin: auto;
    width: 39%;
}

.login_form_box .title {
    font-family: 'poppinsmedium';
    font-size: 35px;
    color: #000000;
    line-height: 1.2;
}


.label {
    font-size: 16px;
    line-height: 1.2;
    color: #333333;
}

.viewwer {
    position: relative;
    height: calc(100% - 160px);
}

/* blocks the bottom-right icon cluster only */
.shield-bottom-right {
    position: absolute;
    right: 0;
    bottom: 0;
    width: var(--right-w);
    height: var(--bar-h);
    pointer-events: auto;
    background: transparent;
}

/* optional: block the right edge so the side pane cannot be opened */
.shield-right-edge {
    position: absolute;
    top: 0;
    right: 0;
    width: var(--edge-w);
    height: 100%;
    pointer-events: auto;
    background: transparent;
}


.field_input {
    background-color: #EBEBEB;
    width: 100%;
    padding: 25px;
    font-size: 16px;
    line-height: 1.2;
    color: #333333;
    border: 1px solid transparent;
    font-family: "Inter";
}

.select2 {
    margin-top: 15px;
    background-color: #EBEBEB;
    padding: 10px 10px 15px 10px;
    font-size: 16px;
    line-height: 1.2;
    color: #333333;
    border: 1px solid transparent;
    font-family: "Inter";
}

.form_wrp .select2-container--default.select2-container--focus .select2-selection--multiple {
    border: none;
}

.form_wrp .select2-container--default .select2-selection--multiple {
    background-color: transparent;
    border: none;
}

.select2-container {
    z-index: 9999;
}

.field_input.error_input {
    border: 1px solid #ff0000;
}

.label+.field_input,
.form_wrp+.form_wrp,
.form_group_custom+.form_wrp {
    margin-top: 25px;
}

.row.data_content+.no_content {
    display: none;
}



.form_group_custom {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 20px -15px 0 -15px;
}

.form_group:first-of-type {
    margin-top: 0;
}

.form_group_custom .form_wrp {
    width: 50%;
    margin-top: 0;
    padding: 0 15px;
}

.login_form_box form {
    margin-top: 20px;
}

.button {
    position: relative;
}

.login_form_box button {
    background: #000000;
    font-size: 16px;
    line-height: 1.2;
    color: #FFFFFF;
    width: 100%;
    padding: 25px;
    text-align: left;
    margin-top: 30px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.loading_left img {
    opacity: 0;
}

.login_form_box button:hover {
    background: rgb(0 0 0 / 70%);
}

.btn_forget_reset {
    margin-top: 30px;
}

.btn_forget_reset a {
    font-size: 16px;
    line-height: 1.25;
    color: #000000;
    display: inline-block;
    margin-left: 15px;
}

.btn_forget_reset a:first-child,
.btn_forget_reset a:hover {
    opacity: 0.5;
}

.btn_forget_reset a:first-child:hover {
    opacity: 1;
}

.btn_forget_reset a+a {
    margin-left: 15px;
}

.pass_input_wrp {
    position: relative;
    margin-top: 25px;
}

.pass_input_wrp .show_hide_password {
    height: 25px;
    width: 25px;
    position: absolute;
    top: 50%;
    right: 25px;
    transform: translateY(-50%);
    cursor: pointer;
}

.pass_input_wrp .field_input {
    padding-right: 55px;
}

.topic_sel_details.cont_manage_top_sel {
    padding-top: 0;
}

.cont_manage_top_sel .dd .selected-item span {
    font-size: 24px;
    width: 155px;
}

.configure {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
}

.configure img {
    height: 25px;
}

.configure span {
    font-size: 18px;
    color: #000000;
    padding-left: 10px;
}

.txt_right {
    text-align: right;
}

.inter {
    font-family: "Inter" !important;
}

.add_topics_sec {
    display: flex;
    flex-wrap: wrap;
    padding-top: 20px;
    margin: 0 -10px;
    min-height: 100px;
}

.add_topics_sec.loading:before {
    top: 30px;

}

.opacity_zero {
    opacity: 0;
}

.add_topics_sec .col {
    display: inline-block;
    padding: 0 10px;
    margin-top: 20px;
}

.col_5 {
    width: 20%;
}

.topics_card {
    background: #FFFFFF;
    box-shadow: 0px 2px 4px 0px #00000029;
    height: 100%;
}

.topics_card_img {
    padding-top: 77%;
    background: #E1E1E1;
    position: relative;
    display: block;
}

.topics_card_cont {
    padding: 15px 25px 20px;
    display: block;
}

.topics_card_content {
    position: relative;
}

.institution_box .class_submenu {
    top: 0;
    right: 5px;
}

.institution_box .class_submenu .action_menu {
    transform: translateX(-50%);
}

.institution_box.content_access .data_content_scoll {
    min-height: 100px;
    max-height: none;
    overflow-y: auto;
}

.class_submenu {
    position: absolute;
    top: 15px;
    right: 25px;
    padding: 10px 0;
    font-size: 0;
}

.action_menu {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    top: 25px;
    left: -10px;
    width: 110px;
    font-size: 14px;
    background-color: #fff;
    z-index: 2;
    box-shadow: 0px 2px 4px 0px #00000040;
    border-radius: 6px;
    transition: opacity .4s, visibility .4s;
}

td.p_relative .action_menu {
    transform: translateX(-50%);
}

.action_menu li {
    display: block
}

.breadcrumb img.instituion_logo {
    width: auto;
    height: 40px;
}

.add_topics_card.popup_open {
    min-height: 298px !important;
}

.action_menu li a {
    font-size: 14px;
    color: #000000;
    display: block;
    width: 100%;
    padding: 10px 15px;
}

.class_submenu.submenu_show .action_menu {
    opacity: 1;
    visibility: visible
}

.topics_card_cont .title {
    font-size: 16px;
    line-height: 1.34;
    color: #333333;
    position: relative;
    padding-right: 20px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.class_submenu_show {
    position: relative;
    z-index: 1;
}

table.myTable tbody tr.row-deleted {
    background-color: #ffe6e6;
    opacity: 0.7;
}

.row_deleted {
    background-color: #ffe6e6;
    opacity: 0.7;
}

.row_deleted .action_menu_list_add_form_open,
.row_deleted .action_menu_list_delete,
.action_menu_list_delete.action_menu_list_restore {
    display: none;
}

.row_deleted .action_menu_list_delete.action_menu_list_restore {
    display: block;
}

.topics_card_cont .title span {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    font-size: 0;
}

.topics_card_cont .edit_date {
    font-size: 16px;
    color: rgb(51 51 51 / 50%);
    padding-top: 15px;
}

.add_topics_card {
    border: 1px dashed #000000;
    box-shadow: 0px 2px 4px 0px #00000029;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 10px;
    cursor: pointer;
    min-height: 298px;
}

.add_topics_card img {
    height: 85px;
}

.add_topics_card span {
    font-size: 16px;
    line-height: 1.34;
    text-align: center;
    padding-top: 15px;
}

.add_topics_sec .col+.col .add_topics_card {
    min-height: auto;
}

.cont_manage_form_page .cont_manage_top_sel .inp_wrap .filter_dropdown:before,
.inp_wrap .selected_item_lecture_select_dd .filter_dropdown:before {
    width: 10px;
    height: 10px;
    top: -2px;
    transform: rotate(-45deg);
}

.cont_manage_form_page .sec_title {
    color: #000000;
    font-family: 'poppinsmedium';
    margin-top: 45px;
}

.label span {
    display: block;
    opacity: 0.5;
    margin-top: 10px;
}

.label span.title_span {
    display: inline;
    opacity: 1;
}

.cont_manage_form_page .form_wrp {
    margin: 45px 0 40px;
}

.cont_manage_form_page {
    width: 50%;
    margin: auto;
}

.content_data_tabs {
    background: #EBEBEB;
    box-shadow: 0px 2px 4px 0px #00000040;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 20px;
}

.content_data_tab {
    width: 12.5%;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    padding: 25px 5px 20px 5px;
}

.content_data_tab.active {
    background: #FFFFFF;
    box-shadow: 0px 2px 4px 0px #00000040;
}

.content_data_ico {
    display: inline-block;
}

.content_data_ico img {
    height: 35px;
}

.content_data_tit {
    font-size: 14px;
    line-height: 1.2;
    text-align: center;
    margin-top: 20px;
    color: #222324;
}

.content_data_block {
    background: #FFFFFF;
    box-shadow: 0px 2px 4px 0px #00000040;
    padding: 25px 30px 30px;
    z-index: 1;
    position: relative;
    display: none;
}

.content_data_block.active {
    display: block;
}

.content_data_block textarea.field_input {
    resize: none;
    overflow: hidden;
}

.cont_manage_form_page .content_data_block .form_wrp {
    margin: 0;
}

.cont_manage_form_page .content_data_block .form_wrp+.form_wrp {
    margin-top: 35px;
}

.cont_manage_form_page .content_data_block .form_group+.form_wrp {
    margin-top: 35px;
}

.drop_box,
.topic_dropbox {
    border: 1px dashed #000000;
    height: 410px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 10px;
    cursor: pointer;
    margin-top: 25px;
    position: relative;
    border-radius: 7px;
}

.txt_center {
    text-align: center;
}

.mt_40 {
    margin-top: 40px;
}

.mt_25 {
    margin-top: 25px;
}

.content_data_submit {
    font-size: 16px;
    line-height: 1.2;
    background: #000000;
    color: #FFFFFF;
    width: 100%;
    padding: 25px;
    text-align: left;
    margin-top: 30px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.popup_open {
    overflow: hidden;
}

.popup_open .common_popup {
    opacity: 1;
    visibility: visible;
}

.common_popup {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #FAFAFA;
    z-index: 99;
    overflow: auto;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s, visibility 0.4s;
    padding-top: 80px;
}

.popup_wrap {
    display: table;
    width: 100%;
    height: 100%;
    vertical-align: middle;
    position: relative;
}

.popup_inner {
    display: table-cell;
    vertical-align: top;
    padding: 40px;
}

.popup_close {
    position: absolute;
    top: 40px;
    left: 40px;
}

.disabled {
    pointer-events: none;
    opacity: 0.5;
}

.popup_close img {
    height: 50px;
}

.profile_select .teacher_menu {
    left: -30px;
    right: auto;
    top: 30px;
    box-shadow: 0px 2px 4px 0px #00000040;
    width: 160px;
}

.profile_select .teacher_menu li a {
    font-size: 16px;
}

.dataTables_length,
.dataTables_info,
table.dataTable thead>tr>th.sorting_asc:before,
table.dataTable thead>tr>th.sorting:before,
table.dataTable thead>tr>th.sorting:after {
    display: none;
}

.myTable {
    border-bottom: none !important;
    background: #FFFFFF;
    box-shadow: 0px 2px 4px 0px #00000029;
    padding-bottom: 35px;
    width: 100%;
}

.table_title {
    font-family: 'poppinsmedium';
    font-size: 20px;
    line-height: 1.2;
    color: #000000;
    margin-right: 350px;
    display: flex;
    justify-content: space-between;
}

.table_title a>* {
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    font-size: 18px;
    margin-right: 10px;
}

table.myTable thead>tr>th {
    font-family: "Inter";
    font-weight: 500;
    font-size: 13px;
    line-height: 1.2;
    text-transform: uppercase;
    color: #6C6565;
    padding: 30px 40px 15px;
    border-bottom: none;
}

table.myTable tbody tr:first-child td {
    border-top: none;
}

table.myTable tbody td {
    padding: 25px 40px;
    font-family: "Inter";
    font-size: 16px;
    line-height: 1.2;
    color: #000000;
    border-bottom: 1px solid #EBEBEB;
    border-top: 1px solid #EBEBEB;
    white-space: nowrap;
}

table.myTable tbody td:first-child {
    padding: 0;
}

table.myTable tbody td:first-child a {
    padding: 25px 40px;
    display: block;
}

table.myTable thead tr th:last-child,
table.myTable tbody tr td:last-child {
    text-align: right;
}

table.myTable tbody tr td.dataTables_empty {
    text-align: center;
    padding: 25px 40px;
}

.dataTables_wrapper .dataTables_filter label {
    font-size: 0;
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.dataTables_wrapper .dataTables_filter {
    margin-top: -30px;
    padding-right: 30px;
}

.dataTables_wrapper .dataTables_filter input {
    background-color: transparent;
    padding: 5px 35px 5px 10px;
    font-size: 16px;
    line-height: 1.2;
    color: #000000;
    border: 1px solid transparent;
    font-family: "inter";
    margin-left: 0;
    width: 330px;
    background-image: url(../images/icons/search_ico.svg);
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: right;
}

.dataTables_wrapper .dataTables_paginate {
    margin-top: 20px;
}

.p_relative {
    position: relative;
}

.dateRange_container {
    position: absolute;
    top: 20px;
    right: 60px;
    z-index: 99;
    width: 225px;
}

.dateRange {
    width: 100%;
    padding: 5px 10px;
}

.resetDates {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 25px
}

.configure_content_map {
    max-width: 1105px;
    margin: auto;
}

.configure_content_map .row {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -15px;
}

.configure_content_map .col {
    display: inline-block;
    padding: 0 15px;
}

.col_3 {
    width: 33.33%;
}

.configure_radio {
    display: block;
    width: 100%;
    position: relative;
}

.configure_radio+.configure_radio {
    border-top: 1px solid #EBEBEB;
}

.configure_radio_input {
    display: none;
}

.add_configure_radio {
    padding: 25px 35px;
    width: 100%;
    display: block;
    background-color: #DCDCDC;
    cursor: pointer;
}

.configure_radio_label {
    font-size: 16px;
    line-height: 1.2;
    color: #000000;
    padding: 25px 35px;
    background-color: #FFFFFF;
    cursor: pointer;
    width: 100%;
    display: block;
}

.configure_radio_input:checked+.configure_radio_label {
    background-color: #3078FF;
    color: #FFFFFF;
}

.add_configure_radio img {
    height: 17px;
    padding-right: 12px;
}

.configure_radio_btns {
    box-shadow: 0px 2px 4px 0px #00000029;
    background: #FFFFFF;
}

.configure_content_map .title {
    font-family: 'poppinsregular';
    font-size: 20px;
    line-height: 1.2;
    color: #000000;
    padding: 25px 35px;
}

.add_configure_radio .configure_radio_label {
    padding: 0;
    background-color: transparent;
    width: auto;
    display: inline-block;
}

.add_chapter_submit {
    font-size: 16px;
    line-height: 1.2;
    background: #000000;
    color: #FFFFFF;
    width: 100%;
    padding: 25px;
    text-align: left;
    margin-top: 30px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.add_chapter_box .drop_box,
.add_chapter_box .topic_dropbox {
    height: 152px;
    position: relative;
}

.drop_box img,
.topic_dropbox img {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 50%;
}

.add_chapter_box .title {
    font-size: 24px;
    line-height: 1.2;
    color: #000000;
    margin-bottom: 30px;
}

.add_chapter_box {
    background: #FFFFFF;
    box-shadow: 0px 2px 4px 0px #00000029;
    padding: 30px 35px 40px;
    margin: auto;
    width: 37%;
}

.add_chapter_popup {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(0 0 0 / 50%);
    z-index: 9999;
    overflow: auto;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s, visibility 0.4s;
    display: flex;
}

.add_configure_show .add_chapter_popup {
    opacity: 1;
    visibility: visible;
}

.configure_radio_scroll {
    max-height: 560px;
    /* overflow-y: scroll; */
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.configure_radio .class_submenu {
    top: 50%;
    transform: translateY(-50%);
}

.configure_radio .action_menu {
    top: -24px;
    left: -115px;
}

.configure_radio_scroll::-webkit-scrollbar {
    display: none;
}

.no_auth {
    padding: 40px;
    display: flex;
    justify-content: center;
    font-size: 25px;
}

.preview_div {
    height: 416px;
    background-color: #ebebeb;
    overflow: auto;
    margin-top: 20px;
}
.preview_div_hide div {

}
.preview_div_hide>div:before {
    content: '';
    position: absolute;
    right: 0;
    bottom: 0;
    width: var(--right-w);
    height: var(--bar-h);
    pointer-events: auto;
    background: transparent;
    z-index: 555;
}
.preview_div_hide>div:after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: var(--right-w);
    height: var(--bar-h);
    pointer-events: auto;
    background: transparent;
    z-index: 555;
}

.preview_div div,
.preview_div embed,
.preview_div iframe,
.preview_div img,
.preview_div video,
.preview_div audio {
    position: relative;
    width: 100%;
    height: 100%;
}

.preview_div img {
    object-fit: contain;
}

.add_form_popup {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(0 0 0 / 50%);
    z-index: 9999;
    overflow: auto;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s, visibility 0.4s;
    display: flex;
}

.add_form_show .add_form_popup {
    opacity: 1;
    visibility: visible;
}

.sub_heading {
    font-size: 14px;
    color: #7F6B6B;
    font-weight: 500;
    padding-left: 40px;
}

.institution_row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 20px 40px 0 0;
}

.title_25 {
    font-family: 'poppinsmedium';
    font-size: 25px;
    line-height: 1.2;
    color: #000000;
}

.align_center {
    justify-content: center;
}

.add_form_open {
    font-size: 18px;
    font-family: 'poppinsmedium';
}

.add_form_open_normal {
    font-size: 16px;
}

.add_form_open>* {
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    font-size: 18px;
    margin-right: 10px;
}

.institution_box+.title_25 {
    padding-top: 40px;
}

.institution_box {
    background: #FFFFFF;
    box-shadow: 0px 2px 4px 0px #00000029;
    padding: 40px 30px;
    margin-top: 20px;
}

.institution_box .row {
    display: flex;
    margin: 0 -5px;
    padding: 0 10px 17.5px;
}

.institution_box .col {
    padding: 0 5px;
}

._10 {
    width: 10%;
}

._13 {
    width: 13%;
}

._15 {
    width: 15%;
}

._17 {
    width: 17%;
}

._19 {
    width: 19%;
}

._30 {
    width: 30%;
}

._50 {
    width: 50%;
}

._55 {
    width: 55%;
}

._60 {
    width: 60%;
}

._61 {
    width: 61%;
}

._39 {
    width: 391%;
}

.institution_box .heading {
    font-size: 14px;
    line-height: 1.2;
    text-transform: uppercase;
    color: #333333;
}

.institution_box .data_content {
    padding: 17.5px 10px;
}

.institution_box .data_cont {
    font-size: 17px;
    line-height: 1.2;
    color: #000000;
}

.institution_box .data_cont a,
.myTable .data_cont a {
    color: #003DFF;
    text-decoration: underline;
}

.institution_box .data_cont a:hover {
    text-decoration: none;
}

.institution_head_row {
    display: flex;
    justify-content: space-between;
    padding: 40px 35px 0;
}

.institution_head_row .add_form_open {
    font-weight: 500;
    font-size: 18px;
    line-height: 1.2;
    color: #000000;
    padding-left: 10px;
}

.class_submenu_text {
    padding-right: 30px;
    display: inline-block;
    padding-top: 5px;
}

.data_content_scoll {
    max-height: 110px;
    overflow-y: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.institution_box .class_submenu .action_menu {
    left: -60px;
    top: -25px;
}

.form_wrp label+label {
    margin-left: 25px;
}

.form_wrp label span {
    position: relative;
    padding-left: 25px;
    font-size: 16px;
    line-height: 1.2;
    color: #333333;
}

.form_wrp input[type="radio"]:checked+span::after {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 10px;
    height: 10px;
    background-color: #000000;
    border-radius: 50%;
}

.form_wrp input[type="radio"]+span::before {
    border-radius: 50%;
    border: 1px solid #000000;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 14px;
    height: 14px;
}

.form_wrp input[type="radio"]+span::after,
.form_wrp input[type="radio"]+span::before {
    content: '';
}

.search_filter_input {
    background-color: transparent;
    padding: 5px 35px 5px 10px;
    font-size: 16px;
    line-height: 1.2;
    color: #000000;
    border: 1px solid transparent;
    font-family: "inter";
    margin-left: 0;
    width: 300px;
    background-image: url(../images/icons/search_ico.svg);
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: right;
}

.search_filter {
    position: absolute;
    top: 50%;
    right: 0;
    display: inline-block;
    transform: translateY(-50%);
}

.pad_LR {
    padding: 0 30px;
}

.pad_LR .search_filter {
    right: 30px;
}

.mt_80 {
    margin-top: 80px !important;
}

.opacity_50 {
    opacity: 0.5;
}

.lecture_card_grid {
    margin-top: 5px;
}

.lecture_card_grid .card {
    padding: 25px 25px 30px 25px;
    cursor: pointer;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
}

.lecture_card_grid .card .title {
    font-size: 30px;
    line-height: 1.3;
    color: #333333;
    margin-top: 0;
}

.lecture_card_grid .card .desc {
    color: #333333;
    margin-top: 10px;
    position: relative;
}

.lecture_card_grid .col .class_submenu {
    top: auto;
    right: 35px;
    bottom: 55px;
}

.lecture_card_grid .row {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    min-height: 150px;
    position: relative;
    padding-bottom: 40px;
}

.lecture_card_grid .pagination {
    position: absolute;
    bottom: 0;
    right: 0;
    color: #000000;
    font-size: 16px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 10px;
}

.lecture_card_grid .page-link {
    position: relative;
    overflow: hidden;
    z-index: 1;
    font-weight: 600;
    padding: 10px 20px;
    color: #FFFFFF;
    border-radius: 10px;
    display: inline-block;
    border: 1px solid transparent;
    transition: color 0.4s ease, border 0.4s ease;
}

.lecture_card_grid .page-link::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(90deg, #0084FF 1.44%, #003CFF 100%);
    transition: opacity 0.4s ease;
}

.lecture_card_grid .page-link:hover::before {
    opacity: 0;
}

.lecture_card_grid .page-link:hover {
    color: #000000;
    border: 1px solid #000000;
}

.lecture_card_grid .row.loading:before {
    top: 0;
    margin-top: 20px;
}

.lecture_card_grid .col {
    display: inline-block;
    vertical-align: middle;
    padding: 0 10px;
    margin-top: 25px;
    position: relative;
}

.lecture_card_grid .col+.no_content {
    display: none
}

.leture_add_row {
    padding-left: 90px;
    padding-right: 760px;
    height: 100%;
}

.leture_add {
    height: 100%;
}

.title_30 {
    font-size: 30px;
    line-height: 1.3;
    color: #333333;
}

.leture_add .title_30 {
    margin-top: 10px;
}

.lecture_name {
    background-color: transparent
}

.leture_add .short_title {
    font-size: 14px;
    line-height: 1.2;
    color: #7F6B6B;
    font-weight: 500;
}

.leture_add .drop_box,
.leture_add .topic_dropbox {
    margin-top: 35px;
    height: 85%;
}

.leture_add .drop_box .label,
.leture_add .topic_dropbox .label {
    font-size: 21px;
    line-height: 1.34;
}

.leture_add_drag_drop {
    background-color: #FFFFFF;
    padding: 40px 45px;
    width: 50%;
    max-width: 745px;
    position: absolute;
    height: 100%;
    top: 0;
    right: 0;
}

.leture_add_drag_drop .cont_manage_top_sel .topic_sel.board .dd .selected-item span {
    width: 120px;
}

.leture_add_drag_drop .cont_manage_top_sel .topic_sel.standard .dd .selected-item span {
    width: 55px;
}

.leture_add_drag_drop .cont_manage_top_sel .topic_sel.subject .dd .selected-item span {
    width: 90px;
}

.leture_add_drag_drop .cont_manage_top_sel .topic_sel.chapter .dd .selected-item span {
    width: 150px;
}

.leture_add_drag_drop .add_topics_sec {
    padding-top: 0;
    max-height: calc(100% - 45px);
    overflow-y: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.leture_add .topics_card {
    display: flex;
    flex-direction: row;
    height: auto;
    margin-top: 30px;
}

.leture_add .topics_card+.topics_card {
    margin-top: 20px;
}

.leture_add .topics_card_img {
    width: 35%;
    padding-top: 18%;
}

.leture_add .topics_card_content {
    width: 65%;
}

.leture_add .topics_card_cont {
    padding: 30px 30px 30px 35px;
    display: flex;
    height: 100%;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
}

.leture_add .topics_card_cont .title {
    max-width: 320px;
    font-size: 22px;
    padding-right: 0;
    white-space: normal;
    text-overflow: inherit;
    overflow: inherit;
}

.leture_add .topics_card_cont .edit_date {
    font-size: 22px;
}

.leture_add .topic_dropbox.has_drop {
    margin-top: 0;
}

.topic_dropbox.has_drop {
    border: none;
    display: block;
    padding: 0;
}

.leture_add .topic_dropbox.has_drop .label {
    display: none;
}

.leture_add .topic_dropbox.has_drop .col_2.topic_card {
    width: 100%;
}

.topics_card_dots {
    cursor: move;
}

.topics_card_dots,
.topics_card_close {
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    display: inline-block;
    width: 32px;
    height: 32px;
}

.topics_card_close {
    top: 10px;
    transform: none;
    width: 25px;
    height: 25px;
}

.topics_card_close:after,
.topics_card_close:before {
    content: '';
    width: 100%;
    height: 2px;
    background-color: #000;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%) rotate(-45deg);
}

.topics_card_close:before {
    transform: translate(-50%) rotate(45deg);
}

.topics_card_dots img,
.topics_card_close img {
    width: 32px;
    height: 32px;
}

.add_topics_sec .topics_card_content .topics_card_dots,
.add_topics_sec .topics_card_content .topics_card_close {
    display: none;
}

.topic_dropbox .topics_card_content .topics_card_dots,
.topic_dropbox .topics_card_content .topics_card_close {
    display: inline-block;
}

.teacher_view .sidebar,
.teacher_view .header {
    display: none;
}

.teacher_view .wrapper {
    padding-top: 0;
    padding-left: 0;
    height: 100vh;
}

.teacher_view .content_area {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

.white_box_grid {
    display: flex;
    justify-content: center;
    gap: 30px;
    margin-top: 75px;
}

.content_area .white_box_grid .white_box {
    width: 19%;
    height: 385px;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.white_box {
    background: #FFFFFF;
    box-shadow: 0px 2px 4px 0px #00000029;
    padding: 40px;
    display: inline-block;
}

.white_box .title {
    font-size: 18px;
    line-height: 1.2;
    text-align: center;
    color: #000000;
    margin-top: 60px;
}

a.white_box:hover {
    box-shadow: 0px 10px 20px 8px #00000029;
}

.toastify {
    padding: 15px 25px;
    font-size: 16px;
    display: flex;
    align-items: center;
    margin-top: 85px;
}

.toast-close {
    opacity: 1;
    padding: 0 0 0 10px;
    vertical-align: middle;
}

.leture_add .row {
    display: flex;
    flex-direction: row;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
}

.planned_on_input {
    width: 260px;
    padding: 10px
}

.report_head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 35px;
}

.title_20 {
    font-family: 'poppinsmedium';
    font-size: 20px;
    line-height: 1.2;
    color: #000000;
}

.report_head .desc {
    font-style: Italic;
    font-size: 16px;
    color: #000000;
    opacity: 0.5;
}

.report.white_box {
    display: block;
    margin-top: 25px;
}

.form_grp {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin: 40px -15px 0;
}

.form_grp .form_wrp {
    width: 50%;
    padding: 0 15px;
}

.form_grp .form_wrp+.form_wrp {
    margin-top: 0;
}

.form_wrp input[type="checkbox"]+span::after,
.form_wrp input[type="checkbox"]+span::before {
    content: '';
}

.form_wrp input[type="checkbox"]+span::before {
    border: 6px solid #EBEBEB;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 28px;
    height: 28px;
    border-radius: 5px;
}

.form_wrp label input[type="checkbox"]+span {
    padding-left: 55px;
    font-size: 22px;
    color: #333333;
    height: 40px;
    display: inline-flex;
    align-items: center;
    opacity: 0.5;
}

.form_wrp input[type="checkbox"]:checked+span::after {
    content: '';
    position: absolute;
    left: 14px;
    top: 7px;
    width: 10px;
    height: 18px;
    border: solid #000;
    border-width: 0 3px 3px 0;
    transform: rotate(45deg);
}

.report .form_wrp label {
    display: inline-block;
}

.report .form_wrp label+label {
    margin-left: 40px;
}

.mt_30 {
    margin-top: 30px;
}

.topic_tabs .swiper-slide:nth-child(7) .topic_ico img {
    margin-right: -5px;
}

.smart_board_tab ._1 .topic_select .topic_sel {
    width: 85%;
}

.smart_board_tab ._1 .topic_select>div {
    width: 15%;
}

.smart_board_tab ._1 .topic_select>div img {
    width: 100%;
}


/* -------------- smart board teching view ---------------  */
.smart_board_teching_view {
    position: relative;
}

.smart_board_teching_view .topic_block {
    background: #000000;
    width: 100vw;
    height: 100vh;
    border-radius: 0;
    position: relative;
}

.smart_board_teching_view .topic_block iframe,
.smart_board_teching_view .topic_block embed {
    border-radius: 0;
}

.smart_board_teching_view.menu_open .topic_block,
.sketch_frame .smart_board_teching_view.menu_open .topic_block_sketch {
    z-index: -1;
}

.smart_board_tabs {
    padding: 0;
}

.options_block {
    position: absolute;
    z-index: 2;
    bottom: 55px;
    left: 65px;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 15px;
    height: 75px;
}

.option {
    width: 75px;
    height: 75px;
    border: 1px solid #FFFFFF;
    border-radius: 50%;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgb(0 0 0 / 50%);
}

.option .profile {
    width: 75px;
    height: 75px;
    object-fit: contain;
}

.option .logo {
    width: 50px;
    height: 50px;
    object-fit: contain;
}

.option .ico {
    width: 35px;
    height: 35px;
}

.options_menu {
    padding: 30px;
    border-radius: 46px;
    border: 1px solid #FFFFFF;
    background-color: #000000;
    position: absolute;
    bottom: 0;
    right: -100%;
    transition: all 0.3s ease;
    z-index: 10;
    opacity: 0;
    visibility: hidden;
    width: 100%;
}

.options_menu.active {
    right: 5px;
    opacity: 1;
    visibility: visible;
}

.options_menu .topic_sel {
    padding-left: 0;
    margin-top: 25px;
    display: block;
}

.options_menu .topic_sel_title {
    font-size: 11px;
    color: #ffffff;
}

.options_menu .dd .selected-item span {
    font-size: 23px;
    font-weight: 400;
    color: #ffffff;
}

.options_menu .inp_wrap .filter_dropdown:before {
    border-bottom: 2px solid #ffffff;
    border-right: 2px solid #ffffff;
}

.topic_wrap {
    display: flex;
    align-items: center;
    margin-top: 20px;
    cursor: pointer;
}

.topic_wrap .topic_img {
    width: 70px;
    height: 70px;
    border-radius: 15px;
    object-fit: contain;
}

.topic_wrap .title {
    position: relative;
    padding: 0 20px;
    font-weight: 400;
    font-size: 18px;
    color: #FFFFFF;
    max-width: 300px;
    line-height: 1.3;
}

.topic_wrap .filter_dropdown {
    position: absolute;
    right: 0px;
    top: 50%;
    transform: translateY(-50%);
    width: 17px;
    height: 10px;
    z-index: 2;
    pointer-events: none;
}

.topic_wrap .filter_dropdown:before {
    content: '';
    position: absolute;
    width: 10px;
    height: 10px;
    top: -50%;
    left: 5%;
    border-bottom: 2px solid #FFFFFF;
    border-right: 2px solid #FFFFFF;
    transform: rotate(-45deg);
}

.back_btn {
    display: inline-flex;
    align-items: center;
    flex-direction: row;
    cursor: pointer;
}

.back_btn img {
    width: 20px;
    height: 20px;
}

.back_btn span {
    font-weight: 400;
    font-size: 14px;
    line-height: 1.5;
    color: #FFFFFF;
    padding-left: 10px;
}

.back_btn+.topic_sel_title {
    margin-top: 30px;
}

.options_menu .topic_tabs {
    display: grid;
    grid-template-columns: 4fr 4fr 4fr 4fr;
    column-gap: 10px;
    row-gap: 30px;
}

.options_menu .topic_tabs .topic_ico {
    width: 55px;
    height: 55px;
    border: 1px solid #FFFFFF;
    background-color: transparent;
    margin-top: 0;
}

.options_menu .topic_tabs .topic_ico img {
    height: 20px;
    filter: invert(1);
}

.options_menu .topic_tabs .topic_tit {
    font-size: 11px;
    color: #ffffff;
    padding-top: 20px;
}

.options_menu .topic_sel_title+.topic_tabs {
    margin-top: 30px;
}

.option,
.drag_icon {
    transition: opacity 0.3s ease;
}

.drag_icon {
    cursor: grab;
    user-select: none;
}

.no_data {
    font-size: 12px;
    color: #fff;
    margin-top: 15px;
}

.smart_board.full_screen_mode .smart_board_teching_view .zoom_in {
    display: none;
}

.drag_icon:active {
    cursor: grabbing;
}

.option.hide,
.drag_icon.hide {
    opacity: 0;
    pointer-events: none;
}

.profile_menu {
    cursor: pointer;
}

.menu_profile_list a {
    font-weight: 400;
    font-size: 22px;
    line-height: 1.2;
    display: block;
    color: #FFFFFF;
    margin-top: 25px;
}

.menu_profile_list a.back_btn {
    margin-top: 0;
}

.menu_profile_list a:first-child {
    margin-top: 0px;
}

.topic_wrap .topic_img+.title {
    max-width: none;
    width: calc(100% - 75px);
    display: block;
    padding: 0 20px;
}

.topic_wrap .title {
    max-width: none;
    width: 100%;
    display: block;
    padding: 0 20px 0 0;
    margin-top: 10px;
}

.overflow_scroll {
    max-height: 450px;
    overflow-y: auto;
    margin-top: 20px;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.overflow_scroll::-webkit-scrollbar {
    display: none;
}

.overflow_scroll .topic_wrap:first-child {
    margin-top: 0;
}

.drag_top_menu .options_menu {
    bottom: auto;
    top: 0;
}