* {
    font-family: "Poppins", sans-serif;
}

.mh10p0 {
    min-height: 10px;
    padding: 0px;
    float: left;
}

.mh10p5 {
    min-height: 10px;
    padding: 5px;
    float: left;
}

.mh10p10 {
    min-height: 10px;
    padding: 10px;
    float: left;
}

.mh10p15 {
    min-height: 10px;
    padding: 15px;
    float: left;
}

.mh10p20 {
    min-height: 10px;
    padding: 20px;
    float: left;
}

.noselect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Menu */

.menu_topline_outer {
    width: 100%;
    min-height: 10px;
    float: left;
    background-color: #3bbcd9;
}

.menu_topline_inner {
    width: 100%;
    min-height: 10px;
    float: left;
    padding: 7px 0px;
}

.menu_topline_social {
    width: 25px;
    height: 25px;
    float: right;
    margin-left: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    color: #fff;
    cursor: pointer;
    opacity: 0.9;
    transition: ease 0.3s all;
    text-decoration: none;
}

.menu_topline_social:hover {
    opacity: 1;
}

.menu_top_line_contact_outer {
    min-width: 10px;
    height: 25px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    color: #fff;
    gap: 10px;
    padding-bottom: 2px;
    cursor: pointer;
    margin-right: 15px;
    text-decoration: none;
}

.menu_top_line_contact_outer i {
    font-size: 13px;
    float: left;
    margin-top: 2px;
}

.menu_contents_outer {
    width: 100%;
    min-height: 10px;
    float: left;
    background-color: #fff;
    -webkit-box-shadow: 0px 2px 16px -8px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px 2px 16px -8px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 2px 16px -8px rgba(0, 0, 0, 0.75);
    position: relative;
}

.menu_contents_inner {
    width: 100%;
    min-height: 20px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px 0px;
}

.menu_logo_outer {
    width: 300px;
    height: 50px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
}

.menu_logo_outer img {
    width: 100%;
    height: 50px;
    object-fit: contain;
    object-position: center left;
}

.menu_right_outer {
    width: 300px;
    height: 50px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

.menu_center_outer {
    flex: 1;
    min-height: 10px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.menu_center_box {
    min-width: 10px;
    height: 30px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: #333;
    font-weight: 500;
    cursor: pointer;
    transition: ease 0.2s all;
    text-decoration: none;
}

.menu_center_box:hover {
    color: #3bbcd9;
}

.menu_right_btn_outer {
    min-width: 10px;
    height: 40px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    color: #fff;
    background-color: #f24141;
    padding: 0px 25px;
    border-radius: 20px;
    padding-bottom: 1px;
    cursor: pointer;
    text-decoration: none;
}

.menu_right_btn2_outer {
    min-width: 10px;
    height: 30px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    background-color: #f24141;
    color: #fff;
    padding: 0px 15px;
    border-radius: 20px;
    padding-bottom: 1px;
    cursor: pointer;
}

/* Menu */

/* Login Page */

.login_page_outer {
    width: 100%;
    height: 100vh;
    position: fixed;
    left: 0px;
    top: 0px;
    z-index: 99;
    background-color: #fff;
}

.login_page_outer video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0%;
    bottom: 0%;
    left: 0%;
    right: 0%;
    z-index: 1;
    float: left;
}

.login_page_inner {
    width: 100%;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.8);
    position: relative;
    z-index: 2;
}

.login_page_contents {
    width: 100%;
    height: 100vh;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login_page_contents_inner {
    width: 100%;
    min-height: 50px;
    max-height: 100vh;
    overflow: auto;
    float: left;
}

.login_page_contents_inner::-webkit-scrollbar {
    width: 0px;
}

.login_page_contents_box {
    /*   width: 400px; */
    min-height: 30px;
    background-color: #fff;
    float: left;
    border-radius: 4px;
    -webkit-box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.27);
    -moz-box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.27);
    box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.27);
    padding: 20px 20px;
    margin: 60px calc(50% - 200px);
}

.login_page_contents_box h3 {
    width: 100%;
    float: left;
    font-size: 24px;
    font-weight: 500;
    color: #333;
    float: left;
    text-align: center;
    letter-spacing: 3px;
    margin-top: 15px;
    margin-bottom: 35px;
}

.login_inputs_outer {
    width: 100%;
    min-height: 20px;
    float: left;
    margin-bottom: 10px;
}

.login_inputs_outer p {
    width: 100%;
    font-size: 12px;
    font-weight: 500;
    color: #333;
    margin: 0px;
}

.login_input_line_outer {
    width: 100%;
    height: 45px;
    float: left;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid #dadada;
}

.login_input_line_outer_radio-content {
    width: 100%;
    height: 45px;
    float: left;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    border-bottom: 1px solid #dadada;
}

.login_input_line_icon {
    width: 35px;
    height: 45px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    padding-top: 1px;
    color: #b5b5b5;
}

.login_input_line_btn {
    width: 35px;
    height: 45px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 14px;
    color: #333;
}

.login_input_line_outer input {
    flex: 1;
    height: 45px;
    background-color: transparent;
    float: left;
    border: 0px !important;
    outline: 0px !important;
    box-shadow: 0px !important;
    font-size: 12px;
    font-weight: 400;
    color: #333;
    padding-bottom: 2px;
}

.login_input_line_outer_radio-content .form-check-label {
    flex: 1;
    height: 45px;
    background-color: transparent;
    float: left;
    border: 0px !important;
    outline: 0px !important;
    box-shadow: 0px !important;
    font-size: 12px !important;
    font-weight: 400;
    color: #333;
    padding-bottom: 2px;
}

.login_input_bottom_line {
    width: 0%;
    height: 1px;
    position: absolute;
    bottom: -1px;
    left: 0px;
    background-color: #ffaa00;
    z-index: 4;
}

.login_input_line_outer input:focus~.login_input_bottom_line {
    width: 100%;
    transition: 0.7s;
}

.login_mini_link {
    width: 100%;
    min-height: 10px;
    float: left;
    margin-top: -3px;
}

.login_mini_link label {
    font-size: 12px;
    font-weight: 300;
    color: #333;
    float: left;
    text-decoration: none;
    cursor: pointer;
}

.login_mini_link label input {
    width: 12px;
    height: 12px;
    margin-right: 5px;
    float: left;
    margin-top: 2px;
}

.login_mini_link a {
    font-size: 12px;
    font-weight: 300;
    color: #333;
    float: right;
    text-decoration: none;
}

.login_button_outer {
    width: 100%;
    min-height: 20px;
    float: left;
    margin-top: 20px;
}

.login_button_outer button {
    width: 100%;
    height: 45px;
    background-color: #fad300;
    color: #333;
    border: 0px !important;
    outline: 0px !important;
    box-shadow: 0px !important;
    text-transform: uppercase;
    letter-spacing: 2px;
    padding-bottom: 2px;
    font-weight: 500;
}

.login_page_line_text {
    width: 100%;
    min-height: 10px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    font-size: 13px;
    font-weight: 300;
    color: #333;
    margin: 20px 0px;
    letter-spacing: 1px;
}

.login_page_line_text:before {
    content: "";
    flex: 1;
    height: 1px;
    float: left;
    background-color: #333;
    float: left;
    opacity: 0.3;
}

.login_page_line_text:after {
    content: "";
    flex: 1;
    height: 1px;
    float: left;
    background-color: #333;
    float: left;
    opacity: 0.3;
}

.login_link_btn {
    width: 100%;
    height: 45px;
    float: left;
    background-color: #ececec;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
    text-decoration: none;
}

.login_link_btn span {
    position: relative;
    z-index: 3;
    transition: all 0.5s ease;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: #333;
    font-weight: 500;
}

.login_link_btn:before {
    content: "";
    width: 0%;
    height: 45px;
    background-color: #fad300;
    position: absolute;
    left: 0px;
    top: 0px;
    transition: all 0.5s ease;
    z-index: 1;
}

.login_link_btn:hover::before {
    width: 100%;
}

.login_link_btn:hover span {
    color: #333;
}

.login_page_back_btn {
    width: 40px;
    height: 40px;
    background-color: #fad300;
    position: absolute;
    left: 20px;
    top: 20px;
    border-radius: 50%;
    z-index: 99;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: #333;
}

@media only screen and (max-width: 900px) {
    .login_page_contents_box {
        width: 100%;
        margin: 60px 0px;
    }
}

.notification_line_outer {
    width: 100%;
    min-height: 20px;
    padding: 15px;
    border-radius: 8px;
    float: left;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    position: relative;
}

.notification_line_image {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background-size: cover;
    background-position: center;
    float: left;
    background-color: rgba(255, 255, 255, 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    color: #fff;
    padding-top: 2px;
    padding-left: 1px;
}

.notification_line_right {
    width: 150px;
    height: 23px;
    float: left;
    font-size: 12px;
    color: #fff;
    text-align: right;
    font-weight: 300;
    opacity: 0.7;
}

.notification_line_center {
    flex: 1;
    min-height: 20px;
    float: left;
}

.notification_line_center h3 {
    width: 100%;
    float: left;
    margin: 0px;
    font-weight: 300;
    color: #fff;
    font-size: 13px;
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-align: left;
}

.notification_line_center h4 {
    width: 100%;
    float: left;
    margin: 0px;
    font-weight: 200;
    color: #fff;
    font-size: 12px;
    line-height: 24px;
}

.notification_danger {
    background-color: #ff3a41;
}

.notification_info {
    background-color: #0066ff;
}

.notification_warning {
    background-color: #ff7b00;
}

.notification_success {
    background-color: #00ba57;
}

.notification_delete_btn {
    width: 40px;
    height: 40px;
    background-color: #ff0000;
    position: absolute;
    right: -10px;
    top: -10px;
    border-radius: 50%;
    border: 2px solid #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 17px;
    padding-left: 1px;
    padding-top: 1px;
    cursor: pointer;
}

.loginTabOuter {
    width: 100%;
    min-height: 10px;
    float: left;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.logintabBtn {
    flex: 1;
    padding: 13px 5px;
    background-color: #f5f5f5;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    cursor: pointer;
}

/* Login Page */

/* User Profile */

.profile_content_outer {
    width: 100%;
    min-height: 25px;
    float: left;
}

.user_profil_outer {
    width: 100%;
    min-height: 50vh;
    float: left;
    padding: 15px;
    display: flex;
    border-left: 1px solid #dadada;
    border-right: 1px solid #dadada;
}

.user_profile_left_area {
    background-color: #f9f0e4;
    display: flex;
    align-items: center;
    flex-direction: column;
    float: left;
    border-radius: 10px;
    width: 100%;
    min-height: 20px;
    padding: 20px 0;
}

.user_profile_left_photo {
    width: 100px;
    height: 100px;
    float: left;
}

.user_profile_left_photo img {
    width: 100%;
    height: 100%;
    border-radius: 50px;
    border: 1px solid #361004;
    object-fit: cover;
    float: left;
}

.userProfileRightArea {
    width: 100%;
    float: left;
    background-color: yellow;
    min-height: 150px;
}

.user_info {
    width: 100%;
    float: left;
    padding: 10px;
    margin-top: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.left_area_menu_outer {
    width: 100%;
    min-height: 50px;
    float: left;
    margin-top: 15px;
}

.profile_menu_line {
    width: 100%;
    height: 40px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px 25px;
    margin-bottom: 10px;
    border-radius: 4px;
    gap: 10px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.profile_menu_line:hover {
    background-color: #60200f1e;
}

.profile_menu_line:last-child {
    margin-bottom: 0px;
}

.profile_menu_iconbox_icon {
    width: 20px;
    height: 20px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: #60210f;
}

.profile_menu_iconbox_text {
    flex: 1;
    height: 20px;
    font-size: 14px;
    color: #60210f;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    text-decoration: none;
}

.user_statistic {
    width: 100%;
    min-height: 15px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid #3610042e;
}

.user_statistic_box {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 5px;
    border-right: 1px solid #3610042e;
    border-top: 1px solid #3610042e;
}

.user_statistic_box:last-child {
    border-right: none;
}

.user_statistic_box_number {
    font-size: 20px;
    font-weight: 500;
    color: #f8af00;
}

.user_statistic_box_title {
    font-size: 14px;
    font-weight: 300;
    color: #361004;
}

.custom_profile_sidebar {
    width: 100%;
    min-height: 20px;
    background-color: #242424;
    float: left;
    padding: 20px;
    border-radius: 5px;
}

.custom_profile_sidebar_image {
    width: 80px;
    height: 80px;
    background-color: #dadada;
    border-radius: 50px;
    float: left;
    margin: 0px calc(50% - 40px);
    background-size: cover;
    background-position: center;
}

.custom_profile_sidebar_image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50px;
}

.custom_profile_sidebar h3 {
    width: 100%;
    font-size: 18px;
    font-weight: 300;
    color: #dadada;
    text-align: center;
    margin-top: 10px;
    float: left;
    margin-bottom: 10px;
    letter-spacing: 2px;
}

.custom_profile_sidebar h4 {
    width: 100%;
    font-size: 13px;
    font-weight: 300;
    color: #dadada;
    text-align: center;
    float: left;
    margin-bottom: 20px;
    opacity: 0.7;
}

.custom_sidebar_profile_btn {
    width: 100%;
    height: 40px;
    background-color: #ffffff1f;
    float: left;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    cursor: pointer;
    margin-bottom: 25px;
}

.custom_sidebar_profile_btn i {
    font-size: 14px;
    color: #fff;
}

.custom_sidebar_profile_btn span {
    font-size: 14px;
    font-weight: 300;
    color: #fff;
}

.custom_profile_sidebar_group {
    width: 100%;
    min-height: 20px;
    float: left;
    border-bottom: 1px solid #dadada38;
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.custom_profile_sidebar_group h4 {
    width: 100%;
    float: left;
    font-size: 13px;
    font-weight: 300;
    color: #dadadaed;
    letter-spacing: 2px;
    margin-bottom: 20px;
}

.custom_profile_sidebar_group h5 {
    width: 100%;
    float: left;
    font-size: 12px;
    font-weight: 300;
    color: #dadadaab;
    letter-spacing: 1px;
    margin-bottom: 15px;
}

.custom_profile_sidebar_group p {
    width: 100%;
    float: left;
    font-size: 12px;
    font-weight: 300;
    color: #dadadaab;
    letter-spacing: 1px;
    margin: 0;
}

.custom_profile_sidebar_group h5:last-child {
    margin-bottom: 0px;
}

.custom_profile_sidebar_group h5 span {
    float: right;
}

.custom_profile_sidebar_group .menu_iconbox_line {
    width: calc(100% + 16px);
    margin-left: -8px;
    margin-right: -8px;
}

.custom_profile_sidebar_group .menu_iconbox_line_selected {
    width: calc(100% + 16px);
    margin-left: -8px;
    margin-right: -8px;
}

.custom_profile_sidebar_group:last-child {
    padding-bottom: 0px;
    border-bottom: 0px;
    margin-bottom: 0px;
}

.custom_profile_contents {
    width: 100%;
    min-height: 20px;
    float: left;
}

.custom_profile_contents_mini_title {
    width: 100%;
    font-size: 15px;
    font-weight: 300;
    color: #ff9b00;
    text-transform: uppercase;
    letter-spacing: 6px;
    margin: 0px;
    margin-bottom: 10px;
    margin-top: 10px;
}

.custom_profile_contents_title {
    width: 100%;
    float: left;
    font-size: 32px;
    font-weight: 300;
    color: #60210f;
    text-transform: uppercase;
    margin: 0px;
    margin-bottom: 20px;
    letter-spacing: 2px;
    position: relative;
}

.custom_profile_contents_title .create_new_playlist_inner {
    float: right;
}

.slderbar_menu_group {
    width: 100%;
    min-height: 10px;
    float: left;
    margin-bottom: 10px;
    padding-left: 15px;
}

.slderbar_menu_group .menu_iconbox_line {
    background-color: rgba(255, 255, 255, 0.06);
}

.menu_iconbox_icon {
    width: 20px;
    height: 20px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    color: #fff;
}

.menu_iconbox_text {
    flex: 1;
    height: 20px;
    font-size: 13px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    text-decoration: none;
}

.menu_iconbox_line_group {
    width: 100%;
    min-height: 10px;
    float: left;
    border-top: 1px solid #454545;
    border-bottom: 1px solid #454545;
    margin-top: -1px;
    padding: 10px 0px;
}

.menu_iconbox_line_group:last-child {
    border-bottom: 0px;
    padding-bottom: 0px;
}

.menu_dropdown_user_line {
    width: 100%;
    min-height: 10px;
    padding: 10px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 10px;
    transition: all 0.2s ease;
}

.menu_dropdown_user_line:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

.menu_dropdown_userline_icon {
    width: 40px;
    height: 40px;
    background-color: #dadada;
    float: left;
    border-radius: 50%;
    background-size: cover;
    background-position: center;
}

.menu_dropdown_userline_contents {
    flex: 1;
    min-height: 10px;
    float: left;
}

.menu_dropdown_userline_contents h3 {
    width: 100%;
    font-size: 13px;
    font-weight: 400;
    color: #fff;
    float: left;
    margin: 0px;
    margin-bottom: 5px;
}

.menu_dropdown_userline_contents h4 {
    width: 100%;
    font-size: 12px;
    font-weight: 200;
    color: #fff;
    float: left;
    margin: 0px;
    letter-spacing: 1px;
}

.menu_iconbox_line {
    width: 100%;
    height: 30px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px;
    gap: 6px;
    margin-bottom: 10px;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
}

.menu_iconbox_line_selected {
    width: 100%;
    height: 30px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px;
    gap: 6px;
    margin-bottom: 10px;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s ease;
    background-color: rgba(255, 255, 255, 0.2) !important;
    text-decoration: none;
}

.menu_iconbox_line:hover {
    background-color: rgba(255, 255, 255, 0.2) !important;
}

.menu_iconbox_line:last-child {
    margin-bottom: 0px;
}

.edit_account_outer {
    width: 100%;
    float: left;
}

.edit_accounts_inputset_outer {
    width: 100%;
    float: left;
    display: flex;
    gap: 10px;
}

.edit_profile_button_outer_area {
    width: 100%;
    display: flex;
    justify-content: center;
    padding-top: 35px;
}

.edit_profile_button_outer_area .login_button_outer button {
    width: auto;
    padding-left: 25px;
    padding-right: 25px;
    border-radius: 5px;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.custom_input_outer {
    width: 100%;
    min-height: 20px;
    float: left;
    margin-bottom: 10px;
}

.custom_input_outer p {
    width: 100%;
    float: left;
    font-size: 13px;
    font-weight: 400;
    color: #60210f;
    letter-spacing: 1px;
    margin-bottom: 7px;
}

.custom_input_outer input {
    width: 100%;
    height: 40px;
    border: 1px solid #dadada;
    outline: 0px !important;
    box-shadow: 0px !important;
    font-size: 13px;
    font-weight: 300;
    padding: 0px 10px;
    padding-bottom: 1px;
    border-radius: 5px;
}

.VideoIndroduce {
    width: 100%;
    border: 1px solid #dadada;
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.fakeInput {
    width: 100%;
    height: 40px;
    border: 1px solid #dadada;
    outline: 0px !important;
    box-shadow: 0px !important;
    font-size: 13px;
    font-weight: 300;
    padding: 0px 10px;
    padding-bottom: 1px;
    border-radius: 5px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

.grayIconGenerate {
    width: 60px;
    height: 60px;
    background-color: #f5f5f5;
    border: 1px solid #dadada;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.custom_input_outer select {
    width: 100%;
    height: 40px;
    border: 1px solid #dadada;
    outline: 0px !important;
    box-shadow: 0px !important;
    font-size: 13px;
    font-weight: 300;
    padding: 0px 10px;
    padding-bottom: 1px;
    border-radius: 5px;
    appearance: none;
}

.custom_input_outer textarea {
    width: 100%;
    height: 100px;
    border: 1px solid #dadada;
    outline: 0px !important;
    box-shadow: 0px !important;
    font-size: 13px;
    font-weight: 300;
    padding: 5px 10px;
    padding-bottom: 1px;
    border-radius: 5px;
    resize: none;
    margin: 0px !important;
}

.login_box_outer button {
    width: 100%;
    height: 40px;
    background-color: #ffbc64;
    border-radius: 5px;
    font-size: 15px;
    font-weight: 300;
    color: #60210f;
    border: 0px !important;
    outline: 0px !important;
    box-shadow: 0px !important;
    margin-top: 15px;
    float: left;
    padding-bottom: 2px;
}

.custom_input_checkline {
    width: 100%;
    min-height: 20px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 8px 0px;
    border-top: 1px solid #dadada;
    border-bottom: 1px solid #dadada;
    margin-top: -1px;
}

.custom_input_checkline_box {
    width: 30px;
    height: 30px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
}

.custom_input_checkline_box input {
    width: 15px;
    height: 15px;
}

.custom_input_checkline_text {
    flex: 1;
    min-height: 20px;
    float: left;
    font-size: 15px;
    color: #333;
    font-weight: 400;
}

/* User Profile */

/* Messages */
.messages_contents_outer {
    width: 100%;
    min-height: calc(100vh - 130px);
    float: left;
    overflow: hidden;
    border-radius: 10px;
}

.messages_contents_left {
    width: 100%;
    min-height: calc(100vh - 130px);
    float: left;
    background-color: #1b1b1b;
    border-right: 1px solid #272727;
}

.messages_contents_right_title {
    width: 100%;
    height: 60px;
    background-color: #1b1b1b;
    float: left;
    font-size: 14px;
    font-weight: 200;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 0px 15px;
    border-bottom: 1px solid #272727;
    letter-spacing: 2px;
}

.messages_contents_right_bottom {
    width: 100%;
    height: 60px;
    background-color: #1b1b1b;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    gap: 10px;
}

.messages_contents_right_center {
    width: 100%;
    height: calc(100vh - 250px);
    background-color: #0a0a09;
    float: left;
    overflow: auto;
    padding: 15px;
}

.messages_contents_left_title {
    width: 100%;
    height: 60px;
    font-size: 16px;
    font-weight: 200;
    text-transform: uppercase;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 0px 15px;
    border-bottom: 1px solid #272727;
    letter-spacing: 2px;
}

.messages_contents_left_bottom {
    width: 100%;
    height: calc(100vh - 190px);
    padding: 15px;
    float: left;
    overflow: auto;
}

.messages_contents_left_searchLine {
    width: 100%;
    height: 40px;
    background-color: rgba(255, 255, 255, 0.1);
    float: left;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    margin-top: 5px;
}

.messages_contents_left_searchLine input {
    flex: 1;
    height: 40px;
    border: 0px !important;
    outline: 0px !important;
    box-shadow: 0px !important;
    color: #fff;
    background-color: transparent;
    font-size: 13px;
    padding-left: 10px;
}

.messages_contents_left_searchLine button {
    width: 40px;
    height: 40px;
    border: 0px !important;
    outline: 0px !important;
    box-shadow: 0px !important;
    color: #fff;
    background-color: transparent;
    font-size: 15px;
}

.messages_contents_left_line {
    width: 100%;
    min-height: 10px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 15px 0px;
    border-top: 1px solid #2e2e2e;
    border-bottom: 1px solid #2e2e2e;
    margin-top: -1px;
    transition: all 0.2s ease;
    cursor: pointer;
}

.messages_contents_left_line:hover {
    padding-left: 15px;
}

.messages_contents_left_line_image {
    width: 45px;
    height: 45px;
    background-color: #dadada;
    border-radius: 50%;
    background-size: cover;
    background-position: center;
    float: left;
}

.messages_contents_left_line_btn {
    width: 25px;
    height: 25px;
    background-color: #0a0a09;
    float: left;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 13px;
    color: #ffffffbb;
    padding-left: 1px;
}

.messages_contents_left_line_center {
    width: calc(100% - 90px);
    min-height: 10px;
    float: left;
}

.messages_contents_left_line_center h3 {
    width: 100%;
    font-size: 13px;
    font-weight: 400;
    color: #fff;
    margin: 0px;
    margin-bottom: 8px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    float: left;
}

.messages_contents_left_line_center h3 i {
    color: #ffb000;
    font-size: 8px;
    float: left;
    margin-right: 3px;
    margin-top: 4px;
}

.messages_contents_left_line_center h4 {
    width: 100%;
    font-size: 11px;
    font-weight: 200;
    color: #ffffffbc;
    margin: 0px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    float: left;
}

.custom_scroll::-webkit-scrollbar {
    width: 5px;
}

.custom_scroll::-webkit-scrollbar-track {
    background: #232323;
}

.custom_scroll::-webkit-scrollbar-thumb {
    background: #3c3c3c;
}

.custom_scroll::-webkit-scrollbar-thumb:hover {
    background: rgb(21, 21, 21);
}

.messages_contents_right_bottom button {
    min-width: 40px;
    height: 40px;
    background-color: rgba(255, 255, 255, 0.1);
    padding: 0px 15px;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 200;
    color: #fff;
    border: 0px !important;
    outline: 0px !important;
    box-shadow: 0px !important;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.messages_contents_right_bottom input {
    flex: 1;
    height: 40px;
    border: 0px !important;
    outline: 0px !important;
    box-shadow: 0px !important;
    color: #fff;
    background-color: transparent;
    padding-bottom: 3px;
    font-size: 14px;
    font-weight: 300;
}

.message_box_outer {
    width: 100%;
    min-height: 10px;
    float: left;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    gap: 10px;
    margin-bottom: 20px;
}

.message_box_image {
    width: 40px;
    height: 40px;
    background-color: #dadada;
    border-radius: 50%;
    float: left;
    background-size: cover;
    background-position: center;
}

.message_box_contents {
    min-width: 10px;
    max-width: calc(60% - 50px);
    min-height: 20px;
    background-color: #232323;
    border-radius: 7px 7px 7px 0px;
    padding: 8px 12px;
}

.message_box_contents p {
    font-size: 13px;
    float: left;
    color: #fff;
    margin: 0px;
    font-weight: 300;
    line-height: 23px;
}

.message_box_contents span {
    font-size: 11px;
    float: left;
    color: #fff;
    margin: 0px;
    font-weight: 200;
    letter-spacing: 1px;
    margin-top: 5px;
    opacity: 0.6;
}

.sender_message {
    flex-direction: row-reverse;
}

.sender_message .message_box_contents {
    border-radius: 7px 7px 0px 7px;
}

@media screen and (max-width: 992px) {
    .messages_contents_outer .col-3 {
        width: 100%;
    }

    .messages_contents_outer .col-9 {
        width: 100%;
    }

    .message_box_contents {
        max-width: calc(90% - 50px) !important;
    }

    .message_box_contents .market_card_outer {
        width: 100% !important;
    }
}

/* Messages */

/* Slider */

.slider_outer {
    width: 100%;
    min-height: 10px;
    float: left;
}

.slider_inner {
    width: 100%;
    min-height: 10px;
    float: left;
    padding: 15px 0px;
}

.slider_box_outer {
    width: 100%;
    min-height: 50px;
    background: rgb(242, 183, 5);
    background: linear-gradient(90deg,
            rgba(242, 183, 5, 1) 0%,
            rgba(242, 144, 5, 1) 100%);
    float: left;
    border-radius: 15px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 35px;
    gap: 65px;
    -webkit-box-shadow: 0px 2px 16px -8px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px 2px 16px -8px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 2px 16px -8px rgba(0, 0, 0, 0.75);
}

.slider_box_outer:before {
    content: "";
    height: 100%;
    aspect-ratio: 1;
    background-color: #fff;
    position: absolute;
    bottom: 0px;
    left: 0px;
    z-index: 1;
    mask: url(../images/slider/bottomLeft.svg) no-repeat left / contain;
    -webkit-mask: url(../images/slider/bottomLeft.svg) no-repeat left / contain;
}

.slider_box_outer:after {
    content: "";
    height: 100%;
    aspect-ratio: 50/39;
    background-color: #f5f5f5;
    position: absolute;
    bottom: 0px;
    right: 0px;
    z-index: 1;
    mask: url(../images/slider/topRight.svg) no-repeat right / contain;
    -webkit-mask: url(../images/slider/topRight.svg) no-repeat right / contain;
    background-image: url("../images/slider/sliderRightTop.png");
    background-size: cover;
    background-position: center right;
}

.slider_box_outer img {
    width: 30%;
    float: left;
    position: relative;
    z-index: 3;
}

.slider_box_contents_outer {
    flex: 1;
    min-height: 10px;
    float: left;
    position: relative;
    z-index: 4;
}

.slider_box_contents_outer h3 {
    width: 100%;
    font-size: 45px;
    color: #fff;
    margin-bottom: 25px;
    font-family: "Bangers", system-ui;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.slider_box_contents_outer p {
    width: 80%;
    font-size: 19px;
    line-height: 35px;
    color: #fff;
    margin-bottom: 35px;
    font-family: "Love Ya Like A Sister", cursive;
}

.slider_buttons_outer {
    width: 100%;
    min-height: 10px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 15px;
}

.slider_button {
    min-width: 10px;
    height: 50px;
    background-color: #f2c12e;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    font-weight: 500;
    color: #333;
    padding: 0px 25px;
    border-radius: 25px;
    cursor: pointer;
    text-decoration: none;
}

/* Slider */

/* Footer */

.footer_outer {
    width: 100%;
    min-height: 20px;
    background-color: #fff;
    float: left;
    -webkit-box-shadow: 0px -2px 16px -8px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px -2px 16px -8px rgba(0, 0, 0, 0.75);
    box-shadow: 0px -2px 16px -8px rgba(0, 0, 0, 0.75);
}

.footer_inner {
    width: 100%;
    min-height: 20px;
    float: left;
    padding: 35px 0px;
}

.footer_top_contents_outer {
    width: 100%;
    min-height: 20px;
    float: left;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 35px;
    border-bottom: 1px solid #dadada;
    padding-bottom: 25px;
}

.footer_logo_outer {
    flex: 1;
    min-height: 10px;
    float: left;
}

.footer_logo_outer img {
    width: 60%;
    float: left;
    margin-bottom: 20px;
}

.footer_logo_outer p {
    width: 100%;
    float: left;
    margin: 0px;
    font-size: 12px;
    font-weight: 400;
    color: #333;
}

.footer_contents_outer {
    flex: 1;
    min-height: 10px;
    float: left;
}

.footer_contents_outer h3 {
    width: 100%;
    font-size: 15px;
    font-weight: 500;
    color: #3bbcd9;
    float: left;
    margin: 0px;
    margin-bottom: 20px;
}

.footer_contents_outer a {
    width: 100%;
    font-size: 13px;
    font-weight: 500;
    color: #333;
    float: left;
    margin: 0px;
    margin-bottom: 7px;
    text-decoration: none;
}

.footer_contents_outer a i {
    width: 19px;
}

.footer_bottom_line {
    width: 100%;
    min-height: 10px;
    float: left;
    padding: 15px 0px;
    margin-bottom: -35px;
    font-size: 12px;
    font-weight: 300;
    color: #333;
}

.footer_bottom_line span {
    float: right;
}

.footer_bottom_line span a {
    color: #3bbcd9;
    text-decoration: none;
}

/* Footer */

/* Homepage */

.homepage_top_boxes_outer {
    width: 100%;
    min-height: 10px;
    float: left;
}

.homepage_top_boxes_inner {
    width: 100%;
    min-height: 10px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px;
    padding: 25px 0px;
}

.homepage_top_boxes_inner:before {
    content: "-----------------------------------------------------";
    flex: 1;
    height: 40px;
    clip-path: polygon(50% 0%,
            100% 0,
            calc(100% - 15px) 50%,
            100% 100%,
            0 100%,
            15px 50%,
            0 0);
    background-color: #0082c3;
    font-size: 17px;
    color: #7ac3e7;
    overflow: hidden;
    line-height: 20px;
    letter-spacing: 3px;
}

.homepage_top_boxes_inner:after {
    content: "-----------------------------------------------------";
    flex: 1;
    height: 40px;
    clip-path: polygon(50% 0%,
            100% 0,
            calc(100% - 15px) 50%,
            100% 100%,
            0 100%,
            15px 50%,
            0 0);
    background-color: #0082c3;
    font-size: 17px;
    color: #7ac3e7;
    overflow: hidden;
    line-height: 20px;
    letter-spacing: 3px;
}

.homepage_top_box_outer {
    width: 17%;
    min-height: 10px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.homepage_top_box_image_outer {
    width: 80%;
    min-height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.homepage_top_box_image_outer .rosette {
    width: 100%;
    float: left;
    position: relative;
    z-index: 1;
}

.rosette_icon {
    width: 34%;
    float: left;
    position: absolute;
    z-index: 3;
}

.homepage_top_box_outer h3 {
    font-size: 32px;
    font-weight: 600;
    color: #333;
    margin: 0px;
    font-family: "Bangers", system-ui;
    letter-spacing: 5px;
    margin-top: 5px;
}

.homepage_top_box_outer h4 {
    font-size: 20px;
    font-weight: 600;
    color: #333;
    margin: 0px;
    font-family: "Love Ya Like A Sister", cursive;
    margin-top: 5px;
}

.homepage_logins_outer {
    width: 100%;
    min-height: 10px;
    float: left;
}

.homepage_logins_inner {
    width: 100%;
    min-height: 10px;
    float: left;
    padding: 25px 0px;
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: 35px;
}

.homepage_login_btn {
    flex: 1;
    min-height: 10px;
    background-color: #3bbcd9;
    float: left;
    border-radius: 25px;
    padding: 30px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 20px;
    background-size: cover;
    background-position: center;
}

.homepage_login_btn img {
    width: 50%;
    float: left;
    margin: -32px 0px;
    margin-left: -55px;
}

.homepage_login_btn_contents {
    flex: 1;
    min-height: 10px;
    float: left;
}

.homepage_login_btn_contents h3 {
    width: 100%;
    font-size: 28px;
    color: #fff;
    font-family: "Bangers", system-ui;
    letter-spacing: 3px;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);
    margin-bottom: 17px;
}

.homepage_login_btn_contents p {
    width: 100%;
    font-size: 14px;
    color: #fff;
    font-family: "Love Ya Like A Sister", cursive;
    font-weight: 600;
    letter-spacing: 3px;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);
    margin: 0px;
}

.homepage_login_btn_bottom {
    width: 100%;
    min-height: 10px;
    float: left;
    background-color: #f2b705;
    display: flex;
    align-items: center;
    justify-content: Center;
    font-family: "Love Ya Like A Sister", cursive;
    padding: 8px;
    font-size: 17px;
    font-weight: 600;
    color: #333;
    border-radius: 12px;
    cursor: pointer;
    letter-spacing: 1px;
    text-decoration: none;
}

.homepage_lessons_outer {
    width: 100%;
    min-height: 20px;
    float: left;
    padding: 15px 0px;
}

.homepage_lessons_inner {
    width: 100%;
    min-height: 20px;
    background-color: #f5f5f5;
    float: left;
    padding: 15px;
    border-radius: 15px;
    border: 1px solid #dadada;
}

.homepage_lessons_title_outer {
    width: 100%;
    min-height: 10px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Bangers", system-ui;
    color: #333;
    font-size: 34px;
    letter-spacing: 3px;
    margin-bottom: 15px;
}

.homepage_lessons_boxes_outer {
    width: 100%;
    min-height: 10px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.homepage_lessons_box_outer {
    width: calc(100% / 4);
    min-height: 10px;
    float: left;
    padding: 14px;
}

.edit_account_outer .homepage_lessons_box_outer {
    width: calc(100% / 3);
    min-height: 10px;
    float: left;
    padding: 14px;
}

.homepage_lessons_box {
    width: 100%;
    height: 100%; /* Parent element'in tüm yüksekliğini kullan */
    min-height: 10px;
    float: left;
    background-color: #fff;
    border-radius: 10px;
    padding: 10px;
    -webkit-box-shadow: 0px 2px 16px -8px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px 2px 16px -8px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 2px 16px -8px rgba(0, 0, 0, 0.75);
}

.homepage_lessons_box_image {
    width: 100%;
    height: 200px;
    float: left;
    border-radius: 7px;
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lessonDelete {
    width: 30px;
    height: 30px;
    background-color: red;
    position: absolute;
    right: 10px;
    top: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    color: #fff;
    z-index: 99;
    border-radius: 50%;
    cursor: pointer;
    text-decoration: none;
}

.homepage_lessons_box_image_inner {
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    position: absolute;
    background-size: cover;
    background-position: center;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Bangers", system-ui;
    text-align: center;
    font-size: 35px;
    color: #fff;
    letter-spacing: 3px;
}

.homepage_lessons_box_image_btn {
    width: 35px;
    height: 35px;
    background-color: #f2b705;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: #333;
    border-radius: 20px;
    position: absolute;
    right: 10px;
    bottom: 10px;
    padding-top: 2px;
    padding-left: 6px;
    cursor: pointer;
}

.homepage_lessons_box_text {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    min-height: 70px;
    float: left;
    font-size: 16px;
    font-weight: 500;
    color: #333;
    margin-top: 10px;
    margin-bottom: 10px;
}

.homepage_lessons_box_text span {
    width: 100%;
    float: left;
    font-size: 15px;
    color: #dadada;
    margin: 5px 0px;
    bottom: 0px;
}

.homepage_lessons_box_text b {
    width: 100%;
    float: left;
}

.homepage_lessons_box_text p {
    width: 100%;
    float: left;
    font-size: 13px;
    font-weight: 400;
    color: #333;
    line-height: 23px;
    height: 140px;
    overflow: hidden;
    margin: 0px;
    margin-top: 5px;
}

.homepage_lessons_box_user_outer {
    width: 100%;
    min-height: 10px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.homepage_lessons_box_user_image {
    width: 40px;
    height: 40px;
    float: left;
    background-color: #ff0000;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 20px;
    padding-top: 1px;
}

.homepage_lessons_box_user_outer span {
    flex: 1;
    font-size: 14px;
    font-weight: 600;
    color: #333;
}

.homepage_lessons_bottom_outer {
    width: 100%;
    min-height: 10px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 20px;
}

.homepage_lessons_bottom_btn {
    min-width: 10px;
    min-height: 10px;
    float: left;
    background-color: #f2b705;
    display: flex;
    align-items: center;
    justify-content: Center;
    font-family: "Love Ya Like A Sister", cursive;
    padding: 12px 30px;
    font-size: 17px;
    font-weight: 600;
    color: #333;
    border-radius: 12px;
    cursor: pointer;
    letter-spacing: 1px;
    text-decoration: none;
}

.page_counter_btn_selected {
    width: 40px;
    height: 40px;
    float: left;
    background-color: #f2b705;
    display: flex;
    align-items: center;
    justify-content: Center;
    font-family: "Love Ya Like A Sister", cursive;
    padding: 12px;
    font-size: 17px;
    font-weight: 600;
    color: #333;
    border-radius: 12px;
    cursor: pointer;
    letter-spacing: 1px;
    margin: 0px 5px;
}

.page_counter_btn {
    width: 40px;
    height: 40px;
    float: left;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: Center;
    font-family: "Love Ya Like A Sister", cursive;
    padding: 12px;
    font-size: 17px;
    font-weight: 600;
    color: #333;
    border-radius: 12px;
    cursor: pointer;
    letter-spacing: 1px;
    margin: 0px 5px;
}

.package_contents_main {
    flex: 1; /* Ana içerik esnek olarak büyüyebilir */
}

.package_contents_bottom {
    margin-top: auto; /* Alt kısım her zaman ana içeriğin altında */
    margin-bottom: 10px;
}

.homepage_lessons_box_bottom_buttons {
    width: 100%;
    min-height: 10px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.homepage_lessons_box_bottom_btn {
    flex: 1;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #f2b705;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 600;
    color: #333;
    cursor: pointer;
    text-decoration: none;
}

.homepage_lessons_box_bottom_btn_detail {
    flex: 1;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #f2b705;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 600;
    color: #333;
    cursor: pointer;
    text-decoration: none;
}

.homepage_lessons_box_bottom_btn:first-child {
    background-color: #f2b705;
}

.homepage_packagetabs_outer {
    width: 100%;
    min-height: 10px;
    float: left;
    float: left;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 15px;
    padding: 0px 15px;
    margin-bottom: 15px;
}

.homepage_packagetab {
    min-width: 10px;
    min-height: 15px;
    float: left;
    background-color: #f3f3f3;
    padding: 10px 25px;
    color: #333;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    border-radius: 35px;
}

/* .homepage_packagetab_select {
    background-color: #f24141;
    color: #fff;
} */

.package_contents {
    width: 100%;
    min-height: 10px;
    float: left;
    margin-bottom: 15px;
    padding: 5px;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.package_contents h3 {
    width: 100%;
    text-align: center;
    font-size: 15px;
    font-weight: 600;
    color: #f24141;
    margin-bottom: 10px;
    float: left;
}

.package_contents h4 {
    width: 100%;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    color: #333;
    margin-bottom: 15px;
    float: left;
}

.package_contents p {
    width: 100%;
    font-size: 13px;
    font-weight: 400;
    color: #333;
    margin-bottom: 5px;
    float: left;
    position: relative;
    padding-left: 15px;
}

.package_contents p:before {
    content: "";
    width: 6px;
    height: 6px;
    position: absolute;
    left: 0px;
    top: 6px;
    background-color: #333;
    border-radius: 10px;
}

.package_contents h5 {
    width: 100%;
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin-bottom: 5px;
    float: left;
    margin-top: 30px;
    opacity: 0.6;
}

.package_contents h6 {
    width: 100%;
    text-align: center;
    font-size: 30px;
    font-weight: 600;
    color: #3bbcd9;
    margin-bottom: 15px;
    float: left;
}

.package_contents span {
    width: 100%;
    text-align: center;
    font-size: 12px;
    font-weight: 500;
    color: #333;
    margin-bottom: 3px;
    float: left;
}

/* Homepage */

/* Contract */

.contract_page_outer {
    width: 100%;
    min-height: 80vh;
    background-color: #fff;
    float: left;
    padding: 50px 0px;
}

/* Contract */

/* Contact */

.page_contents_outer {
    width: 100%;
    min-height: 250px;
    float: left;
}

.page_contents_inner {
    width: 100%;
    min-height: 250px;
    float: left;
    border-left: 1px solid #dadada;
    border-right: 1px solid #dadada;
    padding: 20px;
}

.contact_form_outer {
    width: 100%;
    float: left;
    position: relative;
    border: 1px solid #dadada;
}

.contact_form_inputs {
    width: 60%;
    min-height: 50px;
    float: left;
    padding: 10px;
}

.contact_form_image {
    width: 40%;
    height: 100%;
    position: absolute;
    right: 0px;
    top: 0px;
    float: left;
    background-size: cover;
    background-position: center;
    border-left: 1px solid #dadada;
}

.contact_form_image iframe {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
}

.contact_form_inputs h5 {
    width: 100%;
    font-size: 12px;
    font-weight: 300;
    color: #13024a;
    text-transform: uppercase;
    letter-spacing: 3px;
    margin: 0px;
    margin-bottom: 10px;
}

.contact_form_inputs h3 {
    width: 100%;
    float: left;
    font-size: 25px;
    font-weight: 300;
    color: #333;
    text-transform: uppercase;
    margin: 0px;
    letter-spacing: 3px;
    margin-bottom: 10px;
}

.contact_input_outer {
    width: 100%;
    min-height: 10px;
    float: left;
}

.contact_input_outer p {
    width: 100%;
    float: left;
    margin: 0px;
    font-size: 15px;
    font-weight: 400;
    margin-bottom: 5px;
}

.contact_input_outer input {
    width: 100%;
    float: left;
    height: 45px;
    border: 1px solid #dadada;
    outline: 0px !important;
    box-shadow: none !important;
    padding: 0px 10px;
    font-size: 14px;
    color: #333;
}

.contact_input_outer textarea {
    width: 100%;
    float: left;
    height: 145px;
    resize: none !important;
    border: 1px solid #dadada;
    outline: 0px !important;
    box-shadow: none !important;
    padding: 10px 10px;
    font-size: 14px;
    color: #333;
}

.contact_input_outer button {
    border: 0px !important;
    outline: 0px !important;
}

.contact_boxes_outer {
    width: 100%;
    min-height: 20px;
    float: left;
    border-top: 1px solid #dadada;
}

.contact_boxes_inner {
    width: 100%;
    min-height: 20px;
    border-left: 1px solid #dadada;
    border-right: 1px solid #dadada;
    display: -webkit-inline-flex;
    float: left;
}

.contact_box_outer {
    flex: 1;
    height: auto;
    float: left;
    border-right: 1px solid #dadada;
    padding: 20px;
}

.contact_box_outer:last-child {
    border-right: 0px;
}

.contact_box_outer h3 {
    width: 100%;
    float: left;
    font-size: 18px;
    margin: 0px;
    font-weight: 400;
    color: #333;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 5px;
}

.contact_box_outer p {
    width: 100%;
    float: left;
    font-size: 13px;
    margin: 0px;
    font-weight: 300;
    color: #525252;
    text-align: center;
    margin-top: 10px;
}

@media only screen and (max-width: 900px) {
    .contact_form_image {
        width: 100%;
        height: 250px;
        border-left: 0px;
        border-bottom: 1px solid #dadada;
        float: left;
        position: relative;
    }

    .contact_form_inputs {
        width: 100%;
    }

    .contact_boxes_inner {
        display: block;
    }

    .contact_box_outer {
        border-right: 0px;
        border-bottom: 1px solid #dadada;
    }

    .contact_box_outer:last-child {
        border-bottom: 0px;
    }
}

.slider_center_contents_inner_btn {
    min-width: 10px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 400;
    color: #1f264a;
    padding: 0px 20px;
    text-transform: uppercase;
    letter-spacing: 2px;
    transition: all 0.5s ease;
    position: relative;
    padding-top: 1px;
    cursor: pointer;
    float: left;
    background-color: #fff;
    text-decoration: none;
}

.slider_center_contents_inner_btn span {
    position: relative;
    z-index: 3;
    transition: all 0.5s ease;
}

.slider_center_contents_inner_btn:before {
    content: "";
    width: 0%;
    height: 40px;
    background-color: #13024a;
    position: absolute;
    left: 0px;
    top: 0px;
    transition: all 0.5s ease;
    z-index: 1;
}

.slider_center_contents_inner_btn:hover::before {
    width: 100%;
}

.slider_center_contents_inner_btn:hover span {
    color: #fff;
}

.slider_center_contents_inner_btn:hover {
    border-color: #13024a;
}

/* Contact */

/* Page Top Title */

.page_title_outer {
    width: 100%;
    min-height: 150px;
    float: left;
    position: relative;
    z-index: 1px;
}

.page_title_inner {
    width: 100%;
    min-height: 10px;
    float: left;
    position: relative;
    z-index: 2;
    border-bottom: 1px solid #dadada;
}

.page_title_inner_box {
    width: 100%;
    min-height: 20px;
    float: left;
    padding: 25px 20px;
    border-left: 1px solid #dadada;
    border-right: 1px solid #dadada;
}

.page_title_top_line {
    width: 100%;
    min-height: 20px;
    float: left;
    font-size: 13px;
    font-weight: 200;
    color: #333;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    margin-bottom: 20px;
}

.page_title_top_line a {
    text-decoration: none !important;
    color: #333;
}

.page_title_top_line i:first-child {
    font-size: 12px;
    margin-right: -5px;
}

.page_title_text {
    width: 100%;
    min-height: 10px;
    float: left;
}

.page_title_text h3 {
    width: 100%;
    float: left;
    font-size: 35px;
    font-weight: 200;
    color: #333;
    text-transform: uppercase;
    margin: 0px;
    letter-spacing: 5px;
}

.page_title_text p {
    width: 100%;
    font-size: 13px;
    font-weight: 300;
    color: #f24141;
    text-transform: uppercase;
    letter-spacing: 6px;
    margin: 0px;
    margin-bottom: 2px;
}

.page_contents_outer {
    width: 100%;
    min-height: 250px;
    float: left;
}

.page_contents_inner {
    width: 100%;
    min-height: 250px;
    float: left;
    border-left: 1px solid #dadada;
    border-right: 1px solid #dadada;
    padding: 20px;
}

.about_us_text {
    color: #1f264a;
    font-weight: 300;
}

.about_us_text b {
    color: #f24141;
}

.about_us_text b span {
    color: #333;
}

.calendarLine {
    width: 100%;
    float: left;
    margin: 0px;
    margin: 0px;
    margin-bottom: 0px;
    padding: 15px 0px;
    border-top: 1px solid #dadada;
    border-bottom: 1px solid #dadada;
    margin-top: -1px;
    color: #f24141;
}

.calendarLine span {
    float: right;
    color: #333;
}

.calendar_outer {
    width: 100%;
    min-height: 10px;
    float: left;
    border: 1px solid #dadada;
    border-right: 0px;
    border-bottom: 0px;
}

.calendar_top_line {
    width: calc(100% - 1px);
    min-height: 10px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid #dadada;
    border-right: 1px solid #dadada;
}

.calendar_top_line_btn {
    width: 50px;
    height: 50px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 500;
    color: #333;
    cursor: pointer;
}

.calendar_top_line_center {
    flex: 1;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 500;
    color: #333;
    border-right: 1px solid #dadada;
    border-left: 1px solid #dadada;
    float: left;
}

.calendar_days_outer {
    width: 100%;
    min-height: 10px;
    float: left;
}

.calendar_day {
    width: calc(100% / 7);
    aspect-ratio: 1;
    float: left;
    border-right: 1px solid #dadada;
    border-bottom: 1px solid #dadada;
    position: relative;
    cursor: pointer;
}

.calendar_day span {
    position: absolute;
    right: 10px;
    top: 10px;
    font-size: 18px;
    font-weight: 500;
    color: #333;
}

.calendar_circle {
    width: 10px;
    height: 10px;
    position: absolute;
    left: 17px;
    top: 18px;
    border-radius: 15px;
}

/* Page Top Title */

/* Filter */

.filter_outer {
    width: 100%;
    float: left;
    display: flex;
    justify-content: flex-end;
    padding: 10px;
    margin-bottom: 15px;
}

.custom-select {
    position: relative;
    overflow: hidden;
    padding: 0px 10px;
    float: left;
    flex-direction: row;
    display: flex;
}

.custom-select select {
    box-shadow: none !important;
    padding: 0px 10px;
    border: 1px solid #1f264a2f;
    color: #1f264a;
    background-image: none;
    cursor: pointer;
    outline: none !important;
    font-family: "Poppins" !important;
    font-weight: 300;
    letter-spacing: 1px;
    font-size: 13px;
    height: 40px;
}

.custom-select input {
    box-shadow: none !important;
    padding: 0px 10px;
    border: 1px solid #1f264a2f;
    color: #1f264a;
    background-image: none;
    cursor: pointer;
    outline: none !important;
    font-family: "Poppins" !important;
    font-weight: 300;
    letter-spacing: 1px;
    font-size: 13px;
    height: 40px;
}

.filter_inner {
    padding: 5px 25px;
    border: 1px solid #1f264a2f;
    cursor: pointer;
    float: left;
    padding-bottom: 7px;
}

.filter_inner span {
    font-weight: 300;
    color: #1f264a;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 13px;
}

@media only screen and (max-width: 991px) {
    .filter_outer {
        width: 100%;
        float: left;
        display: block;
    }

    .custom-select {
        width: 100%;
        float: left;
        padding: 0px;
    }

    .custom-select input {
        width: 100%;
        height: 40px;
        margin-bottom: 10px;
    }

    .custom-select select {
        width: 100%;
        height: 40px;
        margin-bottom: 10px;
    }

    .filter_inner {
        width: 100%;
        text-align: center;
    }
}

/* Filter */

/*Blog*/
.big_blog_outer {
    width: 100%;
    min-height: 50px;
    background-color: #f5f5f5;
    float: left;
    position: relative;
}

.big_blog_outer img {
    width: 40%;
    height: 100%;
    position: absolute;
    object-fit: cover;
    left: 0px;
    top: 0px;
}

.big_blog_contents {
    width: 60%;
    min-height: 50px;
    float: right;
    padding: 20px;
}

.big_blog_contents h5 {
    width: 100%;
    font-size: 12px;
    font-weight: 400;
    color: #ffa200;
    text-transform: uppercase;
    letter-spacing: 3px;
    margin: 0px;
    margin-bottom: 10px;
}

.big_blog_contents h3 {
    width: 100%;
    float: left;
    font-size: 28px;
    font-weight: 400;
    color: #333;
    text-transform: uppercase;
    margin: 0px;
    letter-spacing: 3px;
    margin-bottom: 20px;
}

.big_blog_contents p {
    width: 100%;
    float: left;
    font-size: 14px;
    font-weight: 400;
    color: #333;
    margin: 0px;
    letter-spacing: 1px;
    margin-bottom: 20px;
    line-height: 28px;
    display: -webkit-box;
    -webkit-line-clamp: 7;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.blog_list_outer {
    border-top: 1px solid #dadada;
    width: 100%;
    min-height: 250px;
    float: left;
}

.blog_list_inner {
    width: 100%;
    min-height: 250px;
    float: left;
    border-left: 1px solid #dadada;
    border-right: 1px solid #dadada;
    padding: 20px;
}

.blog_item {
    width: calc((100% / 4) - 10px);
    min-height: 350px;
    margin-right: 13px;
    background-color: #f5f5f5;
    float: left;
}

.blog_box_outer {
    width: calc((100% / 4) - 20px);
    min-height: 20px;
    background-color: #f5f5f5;
    float: left;
    margin: 10px;
}

.blog_box_image_outer {
    width: 100%;
    min-height: 90px;
    background-color: #dadada;
    float: left;
    background-size: cover;
    background-position: center;
}

.blog_box_image_outer:before {
    content: "";
    display: block;
    padding-bottom: 100%;
}

.blog_box_contents {
    width: 100%;
    min-height: 20px;
    padding: 15px;
    float: left;
    position: relative;
}

.blog_box_contents h5 {
    width: 100%;
    font-size: 11px;
    font-weight: 400;
    color: #ffa200;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin: 0px;
    margin-bottom: 10px;
}

.blog_box_contents h3 {
    width: 100%;
    float: left;
    font-size: 20px;
    font-weight: 400;
    color: #333;
    text-transform: uppercase;
    margin: 0px;
    letter-spacing: 3px;
    margin-bottom: 10px;
}

.blog_box_contents p {
    width: 100%;
    float: left;
    font-size: 12px;
    font-weight: 400;
    color: #333;
    margin: 0px;
    letter-spacing: 1px;
    margin-bottom: 0px;
    line-height: 23px;
    display: -webkit-box;
    -webkit-line-clamp: 7;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.blog_box_outer:hover .blog_box_contents .blog_box_btn_outer {
    height: 100%;
}

.blog_box_btn_outer {
    width: 100%;
    height: 0%;
    position: absolute;
    left: 0px;
    bottom: 0px;
    z-index: 9;
    background-color: #13024aca;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    transition: all 0.5s ease;
}

.blog_box_btn_inner {
    width: calc(100% - 30px);
    height: calc(100% - 30px);
    border: 1px solid #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
}

.blog_box_btn_inner .slider_center_contents_inner_btn:before {
    background-color: #fa9300;
}

.paging_outer {
    width: calc(100% - 20px);
    min-height: 20px;
    float: left;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 20px;
}

.paging_box_outer_active {
    width: 35px;
    height: 35px;
    border: 1px solid #13024a;
    background-color: #13024a;
    padding: 10px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 8px;
    cursor: pointer;
}

.paging_box_outer {
    width: 35px;
    height: 35px;
    border: 1px solid #dadada;
    padding: 10px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 8px;
    cursor: pointer;
}

.paging_box_inner_active_text {
    color: #fff;
    font-weight: 300;
    font-size: 15px;
}

.paging_box_inner {
    color: #333;
    font-weight: 300;
    font-size: 15px;
}

/*Blog*/

/*Blog Detay*/
.blog_detail_area {
    width: 100%;
    float: left;
    padding: 10px;
    min-height: 25px;
    margin-top: 10px;
}

.blog_detail_area h3 {
    width: 100%;
    float: left;
    font-size: 28px;
    font-weight: 400;
    color: #333;
    text-transform: uppercase;
    margin: 0px;
    letter-spacing: 3px;
    margin-bottom: 20px;
    text-align: center;
}

.blog_detail_area h5 {
    width: 100%;
    font-size: 12px;
    font-weight: 400;
    color: #ffa200;
    text-transform: uppercase;
    letter-spacing: 3px;
    margin: 0px;
    margin-bottom: 10px;
    text-align: center;
}

.blog_detail_area img {
    width: 100%;
    height: 650px;
    object-fit: cover;
    float: left;
    margin-bottom: 20px;
}

.blog_detail_area p {
    width: 100%;
    float: left;
    font-size: 15px;
    font-weight: 400;
    color: #333;
    margin: 0px;
    letter-spacing: 1px;
    margin-bottom: 20px;
    line-height: 28px;
}

.similar_blog_area_outer {
    width: 100%;
    float: left;
    min-height: 25px;
    border-top: 1px solid #dadada;
}

.similar_blog_list_inner {
    width: 100%;
    min-height: 250px;
    float: left;
}

.similar_blog_area_inner {
    width: 100%;
    min-height: 250px;
    float: left;
    border-left: 1px solid #dadada;
    border-right: 1px solid #dadada;
    padding: 20px;
}

.homepage_icons_boxes_title {
    width: 100%;
    min-height: 10px;
    float: left;
    margin-bottom: 20px;
}

.homepage_icons_boxes_title h3 {
    width: 100%;
    font-size: 35px;
    font-weight: 300;
    color: #1f264a;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 5px;
}

.homepage_icons_boxes_title p {
    width: 100%;
    font-size: 17px;
    font-weight: 300;
    color: #ffa200;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 7px;
    margin: 0px;
    margin-bottom: 5px;
}

.lessonPackageDetailOuter {
    flex: 1;
    padding: 15px;
}

.userCircle {
    width: 30px;
    height: 30px;
    float: left;
    object-fit: cover;
    object-position: center;
    border-radius: 50%;
    margin-right: 15px;
    margin-top: -5px;
}

/*Blog Detay*/

/* Mobile */

.menu_mobile_btn {
    width: 40px;
    height: 40px;
    background-color: #f2b705;
    float: left;
    display: none;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #fff;
    font-size: 16px;
}

.menu_right_btn_outer i {
    display: none;
}

@media only screen and (max-width: 950px) {
    .menu_topline_inner {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: row;
        flex-wrap: wrap;
    }

    .menu_top_line_contact_outer {
        width: 100%;
        margin: 0px;
    }

    .menu_topline_social {
        margin-top: 10px;
    }

    .menu_center_outer {
        display: none;
        position: absolute;
        top: 80px;
        background: #fff;
        z-index: 888;
        flex-direction: column;
        width: 100%;
        padding: 14px;
        border-top: 1px solid #dadada;
    }

    .menu_center_box {
        width: 100%;
        margin: 5px 0px;
    }

    .menu_right_btn_outer {
        width: 40px;
        height: 40px;
        padding: 0px;
        padding-bottom: 1px;
        font-size: 16px;
    }

    .menu_mobile_btn {
        display: flex;
    }

    .menu_right_btn_outer span {
        display: none;
    }

    .menu_right_btn_outer i {
        display: block;
    }

    .slider_box_outer img {
        display: none;
    }

    .slider_box_outer {
        flex-direction: column;
    }

    .slider_box_outer:before {
        display: none;
    }

    .slider_box_outer:after {
        width: 100%;
        height: 100%;
        aspect-ratio: auto;
        mask: none;
        -webkit-mask: none;
    }

    .slider_box_contents_outer p {
        width: 100%;
    }

    .slider_buttons_outer {
        flex-direction: column;
    }

    .slider_button {
        width: 100%;
        float: left;
    }

    .homepage_top_boxes_inner:before {
        display: none;
    }

    .homepage_top_boxes_inner:after {
        display: none;
    }

    .homepage_top_boxes_inner {
        flex-direction: row;
    }

    .homepage_top_box_outer {
        width: auto;
        flex: 1;
    }

    .homepage_top_box_outer h4 {
        text-align: center;
    }

    .homepage_logins_inner {
        flex-direction: column;
    }



    .homepage_packagetab {
        flex: auto;
        text-align: center;
    }

    .footer_top_contents_outer {
        flex-direction: column;
    }

    .footer_bottom_line {
        text-align: center;
    }

    .footer_bottom_line span {
        width: 100%;
        text-align: center;
        margin-top: 10px;
    }

    .blog_box_outer {
        width: 100%;
        margin: 10px 0px;
    }

    .blog_detail_area img {
        height: 350px;
    }
}

@media screen and (max-width: 991px) {
    .homepage_lessons_boxes_outer {
        flex-direction: column;
    }

    .homepage_lessons_box_outer {
        width: 100%;
    }
}

/* Mobile */
/* stay to packet start */
.packetStayLast {
    width: 100%;
    border: 1px dashed #dadada;
    border-bottom: none !important;
}

.dashedDetail {
    width: 100%;
    min-height: 100px;
    border-bottom: 1px dashed #dadada;
    display: flex;
    flex-direction: column;
    gap: 5px;
    justify-content: center;
    align-items: center;
}

.dashedDetail span {
    font-size: 16px;
    color: #333;
    text-align: center;
}

.dashedDetail h3 {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 24px;
}

.meetingButtonAlls {
    width: 100%;
    min-height: 70px;
    padding: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 1px dashed #dadada;
}

.meetingButtonAlls span {
    font-size: 15px;
}

.endIconMeetUsers {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
}

.iconsMetted {
    border: none !important;
    outline: 0 !important;
    display: flex;
    justify-content: center;
    align-items: center;
    background: none !important;
    color: #333 !important;
    text-decoration: none !important;
}

/* stay to packet end */
.labelCenterIcons {
    width: 100%;
    min-height: 120px;
    border: 1px dashed #dadada;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.circleAddVidepLesson {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: #f5f5f5;
    border: 1px solid #dadada;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px;
}

.thsnTable tr,
.thsnTable th {
    font-size: 14px !important;
}

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

.lessonTimes td {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 10px;
    flex: 1;
}

.addLessonDays {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.addLessonDays th {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

.lessonTimesDiv {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
    text-align: center;
}

.lessonTimesDiv input {
    width: 20px;
    height: 20px;
    border-radius: 5px;
}

.lessonTimesDiv input:checked {
    -webkit-appearance: none;
    appearance: none;
    background-color: #fad300;
    border-color: #fad300;
    color: #fff;
    position: relative;
}

.lessonTimesDiv input:checked::after {
    content: '✓';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    font-size: 14px;
}

.modalCenterComment {
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    background-color: #3333;
    display: none;
    justify-content: center;
    align-items: center;
}

.white_modalCenter {
    width: 30%;
    padding: 15px;
    background-color: #fff;
    border-radius: 5px;
    padding: 15px;
    position: relative;
}

.absModal_right {
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: none !important;
    outline: 0 !important;
    background-color: #dadada;
    border-radius: 50%;
}

.ModalCenterIcons {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-size: 15px;
}

@media screen and (max-width: 990px) {
    .white_modalCenter {
        width: 100%;
    }
}

.LastBuyPacketTexacher {
    width: 100%;
    margin-top: 15px;
    border: 1px dashed #dadada;
    padding: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.containerCommen {
    width: 100%;
    border: 1px dashed #dadada;
    padding: 15px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    justify-content: space-between;
    align-items: center;
}

.LastBuyPacketTexacher span {
    font-size: 14px;
}

.containerCommen span {
    font-size: 14px;
}

.StarsAndName {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.stars_outher {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.stars_outher i {
    font-size: 16px;
    color: gray;
}

.checkedStar {
    color: orange !important;
}

.form-check-input:checked {
    background-color: #fad300;
    border-color: #fad300;
}

.form-check-input:focus {
    box-shadow: none !important;
}

/*====================================================================================================
										===[ Teachers profile ]===
=====================================================================================================*/

.teacher-profile-detail header .header-body {
    background: url("../images/Single_cources/banner-bg.jpg") no-repeat center center;
    min-height: 360px;
    background-size: cover;
    position: relative;
}

.teacher-profile-detail header .header-body:before {
    background: rgba(0, 0, 0, 0.5);
    content: "";
    height: 100%;
    position: absolute;
    width: 100%;
    left: 0;
}

.teacher-profile-detail header .header-body .intro-text {
    text-align: center;
    margin-top: 80px;
}

.teacher-profile-detail header .header-body .intro-text h1 {
    font-family: "Montserrat", sans-serif;
    font-size: 45px;
    font-weight: 700;
    color: #ffffff;
    margin: 0;
}

.teacher-profile-detail header .header-body .intro-text p {
    margin-top: 15px;
}

.teacher-profile-detail header .header-body .intro-text p span {
    font-size: 14px;
    color: #ffffff;
}

.teacher-profile-detail header .header-body .intro-text p span a {
    color: #ffffff;
    text-decoration: none;
    transition: all 0.3s ease-in-out;
}

.teacher-profile-detail header .header-body .intro-text p span a:hover {
    color: #f2b705;
    transition: all 0.3s ease-in-out;
}

.teacher-profile-detail .teacher-profile {
    padding: 100px 0;
}

.teacher-profile-detail .teacher-profile .t-profile-left .teacher-contact h3 {
    padding: 25px 0px 10px;
    position: relative;
    margin-bottom: 10px;
    border-bottom: 1px solid #d7d7d7;
}

.teacher-profile-detail .teacher-profile .t-profile-left .teacher-contact h3:before {
    position: absolute;
    bottom: -1px;
    left: 0;
    height: 1px;
    width: 25%;
    background: #f2b705;
    content: "";
}

.teacher-profile-detail .teacher-profile .t-profile-left .teacher-contact p {
    margin: 0;
}

.teacher-profile-detail .teacher-profile .t-profile-left .teacher-contact ul {
    margin: 25px auto;
}

.teacher-profile-detail .teacher-profile .t-profile-left .teacher-contact ul li {
    display: inline-flex;
    margin: 0px 2px;
}

.teacher-profile-detail .teacher-profile .t-profile-left .teacher-contact ul li a {
    background: #f9f9f9;
    border-radius: 100%;
    color: #a7a7a7;
    display: block;
    font-size: 17px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    transition: all 0.4s ease 0s;
    width: 35px;
}

.teacher-profile-detail .teacher-profile .t-profile-left .teacher-contact ul li a:hover {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.13);
    transition: all 0.3s ease-in-out;
    background: #f2b705;
    color: #ffffff;
}

.teacher-profile-detail .teacher-profile .t-profile-right .all-corsess-wapper .all-courses h3 {
    padding: 0px 0px 10px;
    position: relative;
    margin-bottom: 15px;
    border-bottom: 1px solid #d7d7d7;
}

.teacher-profile-detail .teacher-profile .t-profile-right .all-corsess-wapper .all-courses h3:before {
    position: absolute;
    bottom: -1px;
    left: 0;
    height: 1px;
    width: 15%;
    background: #f2b705;
    content: "";
}

.teacher-profile-detail .teacher-profile .t-profile-right .all-corsess-wapper .all-courses .profile__courses__inner {
    display: flex;
    margin-bottom: 40px;
}

.teacher-profile-detail .teacher-profile .t-profile-right .all-corsess-wapper .all-courses .profile__courses__inner .profile__courses__list {
    min-width: 140px;
}

.teacher-profile-detail .teacher-profile .t-profile-right .all-corsess-wapper .all-courses .profile__courses__inner ul {
    margin: 0;
}

.teacher-profile-detail .teacher-profile .t-profile-right .all-corsess-wapper .all-courses .profile__courses__inner ul li {
    margin-bottom: 15px;
    color: #333;
    font-size: 15px;
}

.teacher-profile-detail .teacher-profile .t-profile-right .all-corsess-wapper .all-courses .profile__courses__inner ul li:last-child {
    margin-bottom: 0;
}

.teacher-profile-detail .teacher-profile .t-profile-right .all-corsess-wapper .all-courses .profile__courses__inner ul li i {
    color: #f2b705;
    font-size: 16px;
    margin-right: 10px;
    width: 20px;
}

.teacher-profile-detail .teacher-profile .t-profile-right .all-corsess-wapper .all-courses p {
    margin-bottom: 25px;
}

.teacher-profile-detail .teacher-profile .t-profile-right .all-corsess-wapper .all-courses p:last-child {
    margin-bottom: 0;
}

.teacher-profile-detail .teacher-profile .t-profile-right .teacher_skill {
    margin-top: 40px;
}

.teacher-profile-detail .teacher-profile .t-profile-right .teacher_skill h3 {
    padding: 25px 0px 10px;
    position: relative;
    margin-bottom: 25px;
    border-bottom: 1px solid #d7d7d7;
}

.teacher-profile-detail .teacher-profile .t-profile-right .teacher_skill h3:before {
    position: absolute;
    bottom: -1px;
    left: 0;
    height: 1px;
    width: 25%;
    background: #f2b705;
    content: "";
}

.teacher-profile-detail .teacher-profile .t-profile-right .teacher_skill .progress-bar-linear {
    margin-top: 15px;
    margin-bottom: 15px;
}

.teacher-profile-detail .teacher-profile .t-profile-right .teacher_skill .progress-bar-linear .progress-bar-text {
    display: inline-block;
    margin-left: 8px;
    margin-bottom: 6px;
    font-size: 15px;
    font-weight: 700;
}

.teacher-profile-detail .teacher-profile .t-profile-right .teacher_skill .progress-bar-linear .progress-cont {
    display: inline-block;
    float: right;
    margin-right: 10px;
}

.teacher-profile-detail .teacher-profile .t-profile-right .teacher_skill .progress-bar-linear .progress-bar-skills {
    position: relative;
    width: 100%;
    background-color: #efefef;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
}

.teacher-profile-detail .teacher-profile .t-profile-right .teacher_skill .progress-bar-linear .progress-bar-line {
    position: relative;
    width: 5%;
    height: 6px;
    -webkit-transition: all 1.6s ease-out;
    -o-transition: all 1.6s ease-out;
    -moz-transition: all 1.6s ease-out;
    transition: all 1.6s ease-out;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
}

.teacher-profile-detail .teacher-profile .t-profile-right .teacher_skill .progress_bar-2 h3 {
    padding: 25px 0px 10px;
    position: relative;
    margin-bottom: 25px;
    border-bottom: 1px solid #d7d7d7;
}

.teacher-profile-detail .teacher-profile .t-profile-right .teacher_skill .progress_bar-2 h3:before {
    position: absolute;
    bottom: -1px;
    left: 0;
    height: 1px;
    width: 25%;
    background: #f2b705;
    content: "";
}

.teacher-profile-detail .teacher-profile .t-profile-right .teacher_skill .progress_bar-2 .single_skill .progress {
    border-radius: 3px;
    box-shadow: none;
    height: 6px;
}

.teacher-profile-detail .teacher-profile .t-profile-right .teacher_skill .progress_bar-2 .single_skill .progress .progress-bar {
    border-radius: 10px;
    background: #f2b705;
}

.teacher-profile-detail .teacher-profile .t-profile-right .teacher_shedule_list h3 {
    padding: 25px 0px 10px;
    position: relative;
    margin-bottom: 25px;
    border-bottom: 1px solid #d7d7d7;
}

.teacher-profile-detail .teacher-profile .t-profile-right .teacher_shedule_list h3:before {
    position: absolute;
    bottom: -1px;
    left: 0;
    height: 1px;
    width: 25%;
    background: #f2b705;
    content: "";
}

.teacher-profile-detail .teacher-profile .t-profile-right .teacher_shedule_list ul {
    margin: 0;
}

.teacher-profile-detail .teacher-profile .t-profile-right .teacher_shedule_list ul li {
    color: #333333;
    font-size: 14px;
    text-transform: capitalize;
    margin-bottom: 20px;
    border-bottom: 1px solid #d7d7d7;
    padding-bottom: 8px;
}

.teacher-profile-detail .teacher-profile .t-profile-right .teacher_shedule_list ul li:last-child {
    margin-bottom: 0;
}

.teacher-profile-detail .teacher-profile .t-profile-right .teacher_shedule_list ul li span {
    color: #333333;
    float: right;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor {
    margin-top: 40px;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .courses-title {
    padding: 25px 0px 10px;
    position: relative;
    margin-bottom: 25px;
    border-bottom: 1px solid #d7d7d7;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .courses-title:before {
    position: absolute;
    bottom: -1px;
    left: 0;
    height: 1px;
    width: 30%;
    background: #f2b705;
    content: "";
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .item-margin {
    margin-bottom: 30px;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .item-margin:last-child {
    margin-bottom: 0;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.13);
    transition: all 0.3s ease-in-out;
    z-index: 2;
    background: #ffffff;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single:hover {
    box-shadow: 0 1px 30px rgba(0, 0, 0, 0.25);
    transition: all 0.3s ease-in-out;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single:hover h3 a {
    text-decoration: none;
    color: #f2b705;
    transition: all 0.3s ease-in-out;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single:hover img {
    transform: scale(1.1);
    transition: all 0.3s ease-in-out;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single .img-box {
    overflow: hidden;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single .img-box img {
    width: 100%;
    transition: all 0.3s ease-in-out;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single .instractor-courses-text .instractor-parson {


    font-size: 20px !important;
    opacity: 0.8;
    align-items: center;
    display: flex;
    justify-content: center;
    height: 60px;
    padding: 0px 20px;
    position: relative;
    z-index: 2;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single .instractor-courses-text .instractor-parson .parson-img {
    height: 45px;
    width: 45px;
    float: left;
    margin-right: 25px;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single .instractor-courses-text .instractor-parson .parson-img img {
    width: 100%;
    transition: all 0.3s ease-in-out;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single .instractor-courses-text .instractor-parson p {
    color: #ffffff;
    margin: 0;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single .instractor-courses-text .instractor-parson p a {
    color: #ffffff;
    text-decoration: none;
    transition: all 0.3s ease-in-out;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single .instractor-courses-text .instractor-parson p a:hover {
    color: #f2b705;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single .instractor-courses-text .instractor-parson p span {
    font-size: 13px;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single .instractor-courses-text .text-bottom {
    padding: 30px 25px;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single .instractor-courses-text .text-bottom h3 {
    padding: 0;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single .instractor-courses-text .text-bottom h3 a {
    color: #333333;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single .instractor-courses-text .text-bottom p {
    padding-top: 15px;
    margin: 0;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single .price {
    background: #fafafa;
    padding: 15px 25px;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single .price ul {
    margin: 0;
    text-align: left;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single .price ul li {
    display: inline-block;
    color: #b2b2b2;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single .price ul li:last-child {
    float: right;
    color: #f2b705;
    font-weight: 600;
}

.teacher-profile-detail .teacher-profile .t-profile-right .courses-instuctor .instractor-courses-single .price ul li i {
    padding-right: 10px;
}

.instractor-parson-btn {
    flex: 1;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #f2b705;
    border-radius: 10px;
    font-size: 16px;
    font-weight: 600;
    color: #333;
    cursor: pointer;
    text-decoration: none;
}

.wrapper {


    border-radius: 10px;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.12);
}

.wrapper header {
    display: flex;
    align-items: center;
    padding: 25px 30px 10px;
    justify-content: space-between;
}

.calendar {
    padding: 10px;
}

.calendar ul {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    text-align: center;
}

.calendar .days {
    margin-bottom: 20px;
}

.calendar li {
    color: #333;
    /* for black */
    /* color: #fff; */
    width: calc(100% / 7);
    font-size: 1.07rem;
}

.calendar .weeks li {
    font-weight: 500;
    cursor: default;
}

.calendar .days li {
    z-index: 1;
    cursor: pointer;
    position: relative;
    margin-top: 30px;
}

.days li.inactive {
    color: #aaa;
}

.days li.active {
    color: #fff;
}

.days li::before {
    position: absolute;
    content: "";
    left: 50%;
    top: 50%;
    height: 40px;
    width: 40px;
    z-index: -1;
    border-radius: 50%;
    transform: translate(-50%, -50%);
}

.days li.active::before {
    background: #3cafcf;
}

.days li:not(.active):hover::before {
    background: #f2f2f2;
    /*  for black */
    /*  background: #333; */
}

.accordion-button:not(.collapsed) {
    background-color: #f2b705 !important;
    box-shadow: none !important;
}

/* whatsapp btn start */
.whatsapp-btn {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 40px;
    right: 40px;
    background-color: #25d366;
    color: #FFF;
    border-radius: 50px;
    text-align: center;
    font-size: 30px;
    box-shadow: 2px 2px 3px #999;
    z-index: 100;
}

.whatsapp-btn-icon {
    margin-top: 16px;
}

/* whatsapp btn end */

.video-delete-btn {
    position: absolute;
    top: 20px;
    right: -10px;
    background: red;
    color: white;
    border: none;
    border-radius: 50%;
    width: 28px;
    height: 28px;
    cursor: pointer;
}

.pdfbox_image_outer {
    width: 100%;
    min-height: 90px;
    background-color: #dadada;
    float: left;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pdfbox_image_outer i {
    font-size: 3rem;
    color: #333;
}

/* 29-11-2024 */

.custom-file-input {
    position: relative;
    width: 100%;
}

.custom-file-input input[type="file"] {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.custom-file-input .file-label {
    display: block;
    padding: 8px 12px;
    color: #757575;
    cursor: pointer;
    font-size: 12px;
}

.expertiseFormSelect {
    font-size: 12px !important;
    border-width: 0px !important;
}

.expertiseFormSelect:focus {
    border-width: 0px !important;
    box-shadow: none !important;
}

.expertiseFormSelect option {
    padding: 8px 12px;
    font-size: 12px;
}

#profilePicture[type="file"] {
    display: none;
}

.message_box_image_content_box {
    width: 100%;
    max-width: 300px;
    height: auto;
    aspect-ratio: 1/1;
    border-radius: 20px;
    background-color: #232323;
    display: flex;
    align-items: center;
    justify-content: center;
}

.message_box_image_content {
    width: 100%;
    height: 100%;
    border-radius: 20px;
    background-size: cover;
    background-position: center;
    float: left;
}

.multipleSelectOuter {
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 5px;
    background-color: #fff;

}

.multipleSelectOuter p {
    width: 100%;
    float: left;
    font-size: 13px;
    font-weight: 400;
    color: #60210f;
    letter-spacing: 1px;
    margin-bottom: 7px;
}

.expertiseFormSelect {
    width: 100% !important;
}

.expertiseFormSelect .placeholder {
    display: none !important;
}

.expertiseFormSelectRegister {
    width: 100% !important;
}

.expertiseFormSelectRegister span {
    font-size: 12px !important;
}

.expertiseFormSelectRegister .placeholder {
    display: none !important;
}


.ms-drop.bottom li label {
    display: flex !important;
    align-items: center !important;
    overflow: visible !important;
}

/* 04-12-2024 START */

.nav-tabs {
    border-bottom: 2px solid #f0f0f0;
}

.nav-tabs .nav-link {
    border: none;
    color: #666;
    font-weight: 500;
    padding: 12px 20px;
    margin-right: 10px;
    transition: all 0.3s ease;
}

.nav-tabs .nav-link.active {
    color: #3bbcd9;
    border-bottom: 2px solid #3bbcd9;
    background: transparent;
}

.package-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    border: 1px solid #eee;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
}

.package-header {
    padding: 20px;
    background: #f8f9fa;
    border-bottom: 1px solid #eee;
}

.package-body {
    padding: 20px;
    flex-grow: 1;
}

.package-features {
    list-style: none;
    padding: 0;
    margin: 0;
}

.package-features li {
    margin-bottom: 10px;
}

.package-footer {
    padding: 20px;
    border-top: 1px solid #eee;
    background: #fff;
    margin-top: auto;
}

.package-price {
    text-align: center;
    margin-bottom: 15px;
}

.amount {
    font-size: 24px;
    font-weight: bold;
    color: #333;
}

.btn-purchase-student-packets {
    display: block;
    width: 100%;
    padding: 10px;
    text-align: center;
    background: #3bbcd9;
    color: white;
    border-radius: 5px;
    text-decoration: none;
    transition: background 0.3s ease;
}

.btn-purchase-student-packets:hover {
    background: #2da8c5;
    color: white;
}

.package-card:hover {
    transform: translateY(-5px);
}

.package-card.featured {
    border: 2px solid #3bbcd9;
    position: relative;
}

.featured-badge-student-packets {
    position: absolute;
    top: 10px;
    right: 10px;
    background: #3bbcd9;
    color: white;
    padding: 5px 15px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
}

.package-header h3 {
    margin: 0;
    color: #333;
    font-size: 24px;
}

.credits {
    background: #f2b705;
    color: white;
    display: inline-block;
    padding: 5px 15px;
    border-radius: 20px;
    margin-top: 10px;
}

.credits-student-packets {
    background: #3bbcd9;
    color: white;
    display: inline-block;
    padding: 5px 15px;
    border-radius: 20px;
    margin-top: 10px;
}

.package-body {
    padding: 20px;
}

.package-features {
    list-style: none;
    padding: 0;
    margin: 0 0 20px 0;
}

.package-features li {
    margin-bottom: 10px;
    color: #666;
}

.package-features i {
    color: #3bbcd9;
    margin-right: 10px;
}

.package-price {
    text-align: center;
    margin-bottom: 20px;
}

.package-price .amount {
    font-size: 32px;
    font-weight: bold;
    color: #333;
}

.package-price .period {
    color: #666;
}

.package-footer {
    bottom:0;
    padding: 20px;
    text-align: center;
}

.btn-purchase {
    display: inline-block;
    background: #3bbcd9;
    color: white;
    padding: 12px 30px;
    border-radius: 25px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.btn-purchase:hover {
    background: #2da7c4;
    color: white;
}

.smsInputsOuter {
    width: 100%;
    height: 45px;
    float: left;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sms-input {
    width: 55px !important;
    height: 55px !important;
    text-align: center !important;
    font-size: 18px !important;
    margin: 0 5px;
    border-radius: 4px;
    border: 1px solid #ccc;
}

.sms-input:focus {
    border-color: #3bbcd9 !important;
    box-shadow: none !important;
    outline: none !important;
}

.biography-input {
    height: auto;
    min-height: 120px;
}

.biography-input textarea {
    flex: 1;
    min-height: 120px;
    background-color: transparent;
    float: left;
    border: 0px !important;
    outline: 0px !important;
    box-shadow: none !important;
    font-size: 12px;
    font-weight: 400;
    color: #333;
    padding: 12px 0;
    resize: vertical;
    font-family: "Poppins", sans-serif;
    line-height: 1.5;
}

.biography-input textarea:focus~.login_input_bottom_line {
    width: 100%;
    transition: 0.7s;
}

.studentRegisterSelect {
    flex: 1;
    background-color: transparent;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    font-size: 12px;
    font-weight: 400;
    color: #7a7a7a;
    padding: 8px 0;
    cursor: pointer;
    font-family: "Poppins", sans-serif;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23333' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0px center;
    background-size: 15px;
    padding-right: 20px;
}

.studentRegisterSelect:focus~.login_input_bottom_line {
    width: 100%;
    transition: 0.7s;
}

.studentRegisterSelect option {
    background-color: white;
    color: #7a7a7a;
    padding: 8px 12px;
    margin-left: 10px;
    padding-left: 20px !important;
}

.studentRegisterSelect option:first-child {
    color: #7a7a7a;
}

.availability-controls {
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.availability-controls h4 {
    margin-bottom: 20px;
    color: #333;
}

#calendar {
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.fc-event {
    cursor: pointer;
}

.fc-event.private-lesson {
    background-color: #4CAF50;
    border-color: #45a049;
}

.fc-event.group-lesson {
    background-color: #2196F3;
    border-color: #1e88e5;
}


.fc .fc-col-header-cell-cushion {
    color: #7a7a7a;
}

.fc-daygrid-event-harness * {
    color: white;
}

.fc-daygrid-event-dot {
    color: white;
    background-color: white;
    border-color: white;
}

.credit-info-box {
    padding: 15px;
    border-radius: 8px;
    background-color: #f2b7056b;
    text-align: center;
    height: 100%;
}

.credit-info-box-student-packages {
    padding: 15px;
    border-radius: 8px;
    background-color: #3bbcd9;
    text-align: center;
    height: 100%;
}

.credit-info-box-student-packages * {
    color: #fff !important;
}

.info-label {
    display: block;
    font-size: 14px;
    color: #666;
    margin-bottom: 8px;
}

.info-value {
    font-size: 24px;
    color: #333;
    margin: 0;
    font-weight: 500;
}

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

.subscription {
    font-size: 16px;
    color: #666;
    margin-top: 10px;
    background-color: #3bbcd9;
    color: #fff;
    padding: 5px 15px;
    border-radius: 20px;
    max-width: fit-content;
}

.package-card {
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    padding: 20px;
    height: 100%;
    transition: all 0.3s ease;
    background-color: #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.package-card:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.btn-purchase {
    display: inline-block;
    padding: 10px 30px;
    background-color: #f2b705;
    color: #fff;
    text-decoration: none;
    border-radius: 8px;
    font-weight: 500;
    transition: all 0.3s ease;
}

.btn-purchase:hover {
    background-color: #dba504;
    color: #fff;
}

.btn-purchase-student-packets {
    display: inline-block;
    padding: 10px 30px;
    background-color: #3bbcd9;
    color: #fff;
    text-decoration: none;
    border-radius: 8px;
    font-weight: 500;
    transition: all 0.3s ease;
}

.btn-purchase-student-packets:hover {
    background-color: #3bbcd9;
    color: #fff;
}

/* Package Styles */
.homepage_packagetabs_outer {
    width: 100%;
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
}

.homepage_packagetab {
    flex: 1;
    padding: 15px;
    background-color: #f5f5f5;
    border-radius: 5px;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
    color: #333;
    font-weight: 500;
}

.homepage_packagetab_select {
    background-color: #f2b705;
    color: #fff;
}

.package_contents {
    padding: 20px;
}

.package_contents h3 {
    font-size: 24px;
    color: #333;
    margin-bottom: 10px;
    text-align: center;
}

.package_contents .credits {
    font-size: 18px;
    color: #ffffff;
    text-align: center;
    margin-bottom: 20px;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
}

.package-features {
    list-style: none;
    padding: 0;
    margin: 0 0 20px 0;
}

.package-features li {
    padding: 8px 0;
    color: #666;
    display: flex;
    align-items: center;
    gap: 10px;
}

.package-features li i {
    color: #3bbcd9;
}

.package-price {
    text-align: center;
    margin: 20px 0;
}

.package-price h5 {
    font-size: 14px;
    color: #666;
    margin-bottom: 5px;
    letter-spacing: 1px;
}

.package-price h6 {
    font-size: 28px;
    color: #333;
    font-weight: 600;
    margin: 0;
}

.homepage_lessons_box.featured {
    position: relative;
    border: 2px solid #f2b705;
    border-radius: 8px;
}

.featured-badge {
    position: absolute;
    top: -12px;
    right: 10px;
    background: #f2b705;
    color: white;
    padding: 5px 15px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
}

/* Hide Group Packages by default */
#groupPackages {
    display: none;
}

.homepagePackagesOuterContainer {
    width: 100%;
    min-height: 10px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.homepagePackagesOuter {
    min-height: 10px;
    display: flex;
}

.homepagePackagesOuterContainer .row {
    transition: all 0.3s ease-in-out;
}

.homepage_lessons_box {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.package-features {
    flex: 1;
}

.flatpickr-time.time24hr .numInputWrapper:nth-child(3) {
    display: none !important;
}

.flatpickr-time.time24hr .flatpickr-time-separator {
    display: none !important;
}

.teacherBoostBoxOuter {
    margin: 1rem 0rem;
}

.homepagePackagesOuter .fas.fa-check {
    color: #f2b705;
}

.credit-box {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 15px;
    text-align: center;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.credit-box h6 {
    margin-bottom: 10px;
    color: #666;
}

.credit-amount {
    font-size: 24px;
    font-weight: bold;
    color: #333;
}

.zoom-link {
    word-break: break-all;
}

.customSecondaryButton {
    background-color: #f2b705 !important;
    color: #fff !important;
    border-radius: 8px !important;
    border: 1px solid transparent !important;
    padding: 10px 20px !important;
}

.customPrimaryButton {
    background-color: #3bbcd9 !important;
    color: #fff !important;
    border-radius: 8px !important;
    border: 1px solid transparent !important;
    padding: 10px 20px !important;
}


.fc .fc-daygrid-day-number {
    padding: 4px;
    position: relative;
    z-index: 4;
    color: #777;
    text-decoration-line: none;
}

.custom_profile_contents_mini_title {
    display: block;
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 10px;
    background-color: #3bbcd9;
    color: #fff;
    padding: 10px 15px;
    border-radius: 8px;
}

.fc-scroller.fc-scroller-liquid-absolute {
    overflow: visible !important;
}

.studentLessons-card {
    background: white;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
    text-decoration: none;
    display: block;
}


.studentLessons-card:hover {
    transform: translateY(-5px);
}

.studentLessons-image {
    height: 200px;
    background-size: cover;
    background-position: center;
    position: relative;
}

.studentLessons-content {
    padding: 20px;
}

.studentLessons-content h4 {
    margin: 0 0 10px 0;
    color: #333;
    font-size: 18px;
}

.studentLessons-content p {
    color: #666;
    margin-bottom: 15px;
    word-break: break-all;
}

.studentLessons-date {
    display: flex;
    align-items: center;
    color: #3bbcd9;
    font-size: 14px;
}

.studentLessons-date i {
    margin-right: 5px;
}

.studentLessons-footer {
    width: 100%;
    padding: 10px;
    border-top: 1px solid #eee;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.studentLessons-btn {
    padding: 8px 15px;
    background: #3bbcd9;
    color: white;
    border-radius: 20px;
    text-decoration: none;
    font-size: 13px;
    transition: background 0.3s ease;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    gap: 5px;
}

.studentLessons-btn:hover {
    background: #2da7c4;
    color: white;
}

.studentLessons-subject {
    padding: 8px 15px;
    background: #f2f2f2;
    border-radius: 15px;
    color: #666;
    font-size: 13px;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.custom-tabs {
    border-bottom: 2px solid #e9ecef;
}

.custom-tabs .nav-link {
    color: #6c757d;
    border: none;
    padding: 1rem 2rem;
    font-weight: 500;
    transition: all 0.3s ease;
}

.custom-tabs .nav-link:hover {
    color: #F24141;
    border: none;
}

.custom-tabs .nav-link.active {
    color: #F24141;
    border: none;
    border-bottom: 2px solid #F24141;
    background-color: transparent;
}

.video-title {
    color: #333;
    font-size: 1.25rem;
    font-weight: 600;
}

.video-description {
    color: #6c757d;
    font-size: 0.95rem;
}

.video-container {
    background: #fff;
    padding: 1.5rem;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

#lessonTabs .nav-item {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

#lessonTabs .nav-link {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

@media (max-width: 768px) {
    .fc .fc-toolbar {
        display: block !important;
    }
}


.thsnTable table {
    --bs-table-striped-bg: #fff !important;
}

.filter_outer.form-control div,
.filter_outer.form-control select,
.filter_outer.form-control input {
    border-radius: 5px !important;
}

.filter_outer.form-control button {
    border-radius: 5px !important;
    background-color: white;
}

/* .allTeachersImage {
    background-size: contain !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
} */

.studentLessons-cancelButton {
    padding: 8px 15px;
    background: crimson;
    border-radius: 20px;
    color: white;
    font-size: 13px;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    border: none;
}

.studentLessonsTeacher {
    text-decoration: none;
    color: #333;
}

.studentLessonsTeacher img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    margin-right: 10px;
}

.studentLessons-card * {
    word-break: break-all;
}

.choose_class_outer {
    width: 100%;
    height: 40px;
    border: 1px solid #dadada;
    outline: 0px !important;
    box-shadow: 0px !important;
    font-size: 13px;
    font-weight: 300;
    padding: 0px 10px;
    padding-bottom: 1px;
    border-radius: 5px;
    appearance: none;
}

.table input[type="time"] {
    border: 1px solid #ddd;
    padding: 4px 8px;
    border-radius: 4px;
}

.form-switch {
    padding-left: 2.5em;
}

.form-check-input {
    cursor: pointer;
}

.table td {
    vertical-align: middle;
}

.time-slots {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 10px;
}

.time-slot {
    display: flex;
    align-items: center;
    gap: 5px;
    background-color: #f8f9fa;
    padding: 5px 10px;
    border-radius: 4px;
}

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

.time-input::-webkit-calendar-picker-indicator {
    display: none;
}

.time-input::-moz-calendar-picker-indicator {
    display: none;
}

.time-input::-ms-calendar-picker-indicator {
    display: none;
}

.time-input::-o-calendar-picker-indicator {
    display: none;
}

.time-input::calendar-picker-indicator {
    display: none;
}

.workingHoursCheckboxes {
    -webkit-appearance: none;
    appearance: none;
    transform: scale(1.4);
    margin-right: 5px;
    position: relative;
    width: 14px;
    height: 14px;
    border: 1px solid #f2b705;
    border-radius: 3px;
    cursor: pointer;
}

.workingHoursCheckboxes:checked {
    background-color: #f2b705;
}

.workingHoursCheckboxes:checked::after {
    content: '✓';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    font-size: 12px;
}

.menu_iconbox_notification_count {
    position: absolute;
    top: 0px;
    right: 0px;
    background-color: #F24141;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    width: 20px;
    height: 20px;
}


/* 04-12-2024 END */