/* Google Font Import - Poppins */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500;9..40,600;9..40,700;9..40,800;9..40,900&display=swap');
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    /* font-family: 'Poppins', sans-serif; */
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
}

a,
a:hover,
a:focus,
a:visited {
    text-decoration: none;
}

:root {
    /* ===== Colors ===== */
    --body-color: #1e1f21;
    --sidebar-color: #404042;
    --primary-color: #1e1f21;
    --primary-color-light: #F6F5FF;
    --toggle-color: #DDD;
    --text-color: #707070;
    /* ====== Transition ====== */
    --tran-03: all 0.2s ease;
    --tran-03: all 0.3s ease;
    --tran-04: all 0.3s ease;
    --tran-05: all 0.3s ease;
}

.mb10 {
    margin-bottom: 10px;
}

.mb20 {
    margin-bottom: 20px;
}

.mb30 {
    margin-bottom: 30px;
}

.mb40 {
    margin-bottom: 40px;
}

.mb50 {
    margin-bottom: 50px;
}

.mb60 {
    margin-bottom: 60px;
}

.mb70 {
    margin-bottom: 70px;
}

.mb80 {
    margin-bottom: 80px;
}

.mb90 {
    margin-bottom: 90px;
}

.mt10 {
    margin-top: 10px;
}

.mt20 {
    margin-top: 20px;
}

.mt30 {
    margin-top: 30px;
}

.mt40 {
    margin-top: 40px;
}

.mt50 {
    margin-top: 50px;
}

.mt60 {
    margin-top: 60px;
}

.mt70 {
    margin-top: 70px;
}

.mt80 {
    margin-top: 80px;
}

.mt90 {
    margin-top: 90px;
}

body {
    min-height: 100vh;
    background-color: var(--body-color);
    transition: var(--tran-05);
}

a {
    text-decoration: none;
}

.dashbaord p,
.dashbaord li,
.dashbaord a,
.dashbaord div {
    font-family: 'DM Sans', sans-serif;
    font-size: 14px;
}

::selection {
    background-color: var(--primary-color);
    color: #fff;
}

main.dark {
    --body-color: #1e1f21;
    --sidebar-color: #2E2E30;
    --primary-color: #1e1f21;
    --primary-color-light: #404042;
    --toggle-color: #fff;
    --text-color: #ccc;
}


/* ===== Sidebar ===== */

.sidebaropentrd {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    height: 100%;
    width: 280px;
    padding: 60px 5px;
    background: var(--sidebar-color);
    transition: var(--tran-05);
    z-index: 100;
    overflow-x: hidden;
}

.sidebaropentrd.close {
    width: 88px;
}

.sidebaropentrd::-webkit-scrollbar {
    width: 4px;
}

.sidebaropentrd::-webkit-scrollbar-track {
    background-color: #ebebeb;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

.sidebaropentrd::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: #6d6d6d;
}

.hav_sub_menu {
    flex-direction: column;
}


/* ===== Reusable code - Here ===== */

.side_menu_links li {
    min-height: 50px;
    list-style: none;
    display: flex;
    align-items: center;
    margin-top: 10px;
}

.sidebarmenu_bar .side_menu_links li {
    flex-direction: column;
}

.sidebaropentrd.close ul li a .menu_text,
.sidebaropentrd.close .side_sub_menu .txt {
    opacity: 0;
    display: none;
}

.sidebaropentrd.close ul li a .menu_text,
.sidebaropentrd.close .menu_icon {
    width: 100%;
}

.sidebaropentrd .head_part .logo_img {
    justify-content: center;
}

.sidebaropentrd .head_part .logo_img img {
    display: inline-block;
}

.sidebaropentrd .head_part .image,
.sidebaropentrd .icon {
    min-width: 60px;
    border-radius: 6px;
}

.sidebaropentrd .icon {
    min-width: 60px;
    border-radius: 6px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

.sidebaropentrd .text,
.sidebaropentrd .icon {
    color: var(--text-color);
    transition: var(--tran-03);
}

.sidebaropentrd .text {
    font-weight: 500;
    white-space: nowrap;
    opacity: 1;
}

.sidebaropentrd.close .text {
    opacity: 0;
}


/* =========================== */

.sidebaropentrd .head_part {
    position: relative;
}

.head_nav {
    padding-bottom: 30px;
    border-bottom: solid 1px #404042;
}

.side_menu_links .menu_icon {
    min-width: 60px;
    border-radius: 6px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

.side_menu_links .menu_text {
    display: flex;
    justify-content: space-between;
    color: #fff;
    align-items: center;
    width: 100%;
    padding-right: 15px;
}

.side_menu_links .menu_text span.sub_menu_icon.active {
    transform: rotate(90deg);
}

.side_menu_links .menu_text span.sub_menu_icon {
    transition: 0.2s;
}

.side_menu_links .side_sub_menu {
    display: none;
    height: 0px;
    flex-direction: column;
    width: 100%;
    color: #fff;
    padding-left: 0;
    list-style-type: disc;
    list-style: disc;
    transition: height 0.3s;
}

.side_menu_links .side_sub_menu.active {
    height: auto;
    display: block;
}

.side_menu_links .side_sub_menu li {
    min-height: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    margin-top: 10px;
    flex-direction: column;
    color: #fff;
    list-style: disc;
    list-style-type: disc;
    align-items: center;
    display: flex;
    position: relative;
}

.side_menu_links .side_sub_menu li a {
    color: #fff;
    height: inherit;
    min-height: inherit;
    padding-left: 60px;
    position: relative;
}

.side_menu_links .side_sub_menu li a span.dot {
    position: absolute;
    left: 30px;
    top: auto;
    bottom: auto;
}

.side_menu_links .side_sub_menu.active {
    height: auto;
}

.sidebaropentrd .head_part .image-text {
    display: flex;
    align-items: center;
    justify-content: center
}

.sidebaropentrd .head_part .logo-text {
    display: flex;
    flex-direction: column;
}

.head_part .image-text .name {
    margin-top: 2px;
    font-size: 18px;
    font-weight: 600;
}

.head_part .image-text .profession {
    font-size: 16px;
    margin-top: -2px;
    display: block;
}

.sidebaropentrd .head_part .image {
    display: flex;
    align-items: center;
    justify-content: center;
}

.sidebaropentrd .head_part .image img {
    width: 40px;
    border-radius: 6px;
}

.sidebaropentrd .head_part .toggle {
    position: absolute;
    top: -40px;
    right: 12px;
    height: 25px;
    width: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: var(--tran-05);
}

.dark .sidebaropentrd .head_part .toggle {
    color: var(--text-color);
}

.sidebaropentrd.close .toggle {
    transform: translateY(-50%) rotate(180deg);
    /* transform: translateY(-50%) rotate(0deg); */
}

.sidebaropentrd .menu {
    margin-top: 20px;
}

.side_menu_links li a {
    list-style: none;
    height: 100%;
    background-color: transparent;
    display: flex;
    align-items: center;
    height: 100%;
    width: 100%;
    border-radius: 4px;
    text-decoration: none;
    transition: var(--tran-03);
    min-height: inherit;
}

.side_menu_links li a:hover {
    background-color: #454547
}

.side_menu_links li a:hover .icon,
.side_menu_links li a:hover .text {
    color: var(--sidebar-color);
}

.dark .side_menu_links li a:hover .icon,
.dark .side_menu_links li a:hover .text {
    color: var(--text-color);
}

.sidebaropentrd .sidebarmenu_bar {
    height: calc(100% - 250px);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    /* overflow-y: scroll; */
}

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

.sidebaropentrd .sidebarmenu_bar .mode {
    border-radius: 6px;
    background-color: var(--primary-color-light);
    position: relative;
    transition: var(--tran-05);
}

.sidebarmenu_bar .mode .sun-moon {
    height: 50px;
    width: 60px;
}

.mode .sun-moon i {
    position: absolute;
}

.mode .sun-moon i.sun {
    opacity: 0;
}

.dark .mode .sun-moon i.sun {
    opacity: 1;
}

.dark .mode .sun-moon i.moon {
    opacity: 0;
}

.sidebarmenu_bar .bottom-content .toggle-switch {
    position: absolute;
    right: 0;
    height: 100%;
    min-width: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    cursor: pointer;
}

.toggle-switch .switch {
    position: relative;
    height: 22px;
    width: 40px;
    border-radius: 25px;
    background-color: var(--toggle-color);
    transition: var(--tran-05);
}

.switch::before {
    content: '';
    position: absolute;
    height: 15px;
    width: 15px;
    border-radius: 50%;
    top: 50%;
    left: 5px;
    transform: translateY(-50%);
    background-color: var(--sidebar-color);
    transition: var(--tran-04);
}

.dark .switch::before {
    left: 20px;
}

.home {
    position: absolute;
    top: 0;
    top: 0;
    left: 250px;
    height: 100vh;
    width: calc(100% - 250px);
    background-color: var(--body-color);
    transition: var(--tran-05);
}

.home .text {
    font-size: 30px;
    font-weight: 500;
    color: var(--text-color);
    padding: 12px 60px;
}

.sidebaropentrd.close~.home {
    left: 78px;
    height: 100vh;
    width: calc(100% - 78px);
}

.logo-collapse {
    display: none;
}

.sidebaropentrd.close .logo-open {
    display: none!important;
}

.sidebaropentrd.close .logo-collapse {
    display: block!important;
}

.dark .home .text {
    color: var(--text-color);
}

.content_body {
    width: calc(100% - 280px);
    padding: 64px;
    left: 280px;
    position: relative;
    transition: left 0.5s;
}

.content_body.expand {
    left: 88px;
    width: calc(100% - 88px);
}

.searchBar {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    min-width: 240px;
    max-width: 240px;
    background-color: transparent;
    border: solid 1px #424244;
    position: relative;
    border-radius: 20px;
    max-height: 40px;
}

.search_rfq {
    max-width: 290px;
    min-width: 290px;
}

#searchQueryInput {
    width: 100%;
    height: 40px;
    background: transparent;
    outline: none;
    border: none;
    border-radius: 1.625rem;
    padding: 0 1.5rem 0 0;
    font-size: 14px;
    color: #fff;
}

#searchQuerySubmit {
    width: 3.5rem;
    height: 40px;
    background: none;
    border: none;
    outline: none;
}

#searchQuerySubmit:hover {
    cursor: pointer;
}

.main_content_body {}

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

.header_nav_prof_row .breadcrumb_col {
    flex: 1;
}

.header_nav_prof_row .breadcrumb_col ul {
    display: flex;
    list-style-type: none;
    padding: 0px;
    margin: 0px;
}

.header_nav_prof_row .breadcrumb_col ul li {
    display: inline-flex;
    list-style-type: none;
    list-style: none;
}

.header_nav_prof_row .breadcrumb_col ul li a {
    color: #A2A0A2;
    text-decoration: none;
    ;
}

.header_nav_prof_row .profile_col {
    flex: 1;
}

.header_nav_prof_row .profile_col .right_cont {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.header_nav_prof_row .profile_col .right_cont .create_btn {
    margin: 0 18px;
}

.header_nav_prof_row .profile_col .right_cont #profile_menu_btn,
.header_nav_prof_row .profile_col .right_cont #create_menu_btn {
    display: block;
}

.header_nav_prof_row .profile_col .right_cont ul {
    list-style-type: none;
    list-style: none;
    padding: 0px;
    margin: 0px;
}

.header_nav_prof_row .profile_col .right_cont ul li {
    list-style-type: none;
    list-style: none;
}

.menu_pro {
    position: relative;
}

.menu_pro .sub_menu_pro {
    display: none;
    background-color: #1e1f21;
    width: 210px;
    position: absolute;
    top: 100%;
    border: solid 1px #424244;
    right: 0;
}

.profile_btn .sub_menu_pro.active {
    display: block;
}

.create_btn .sub_menu_pro.active {
    display: block;
}

.menu_pro .sub_menu_pro li {
    margin: 0px!important;
}

.menu_pro .sub_menu_pro li a {
    height: 100%;
    width: 100%;
    min-height: inherit;
}

.menu_pro .sub_menu_pro li:last-child {
    border-top: solid 1px #424244;
}

.menu_pro>li>a>img {
    max-height: 40px;
}

.home_dash {
    margin-top: 40px;
}

.home_dash .customise_row {
    display: flex;
    justify-content: space-between;
}

.home_dash .customise_row .welcome_msg {
    flex: 1;
}

.home_dash .customise_row .welcome_msg .date_txt {
    color: #fff;
}

.home_dash .customise_row .welcome_msg .date_txt h3 {
    margin-bottom: 10px;
    font-weight: 400;
}

.home_dash .customise_row .welcome_msg .date_txt h2 {
    font-weight: 500;
}

.sub_heading {
    font-size: 20px;
    line-height: 1.3;
}

.main_heading {
    font-size: 30px;
    line-height: 1.3;
}

.home_dash .customise_row .theme_custom {
    flex: 1;
    justify-content: flex-end;
    display: flex;
}

.home_dash .customise_row .theme_custom .theme_custom_btn button {
    outline: none;
    border: solid 1px #424244;
    background-color: #2a2b2d;
    padding: 16px 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 2px;
}

.home_dash .customise_row .theme_custom .theme_custom_btn button span.icn {
    margin-right: 10px;
    display: inline-flex;
}

.home_dash .customise_row .theme_custom .theme_custom_btn button span.txt {
    color: #fff;
    font-size: 14px;
    display: inline-flex;
}

.getting_started_box {
    background-color: ;
    border: ;
    text-align: center;
    padding: 50px 50px 20px 50px;
    margin-top: 40px;
}

.getting_started_box .top_head h3 {
    color: #fff;
    font-weight: 400;
    margin-bottom: 10px;
}

.getting_started_box .top_head h4 {
    color: #A2A0A2;
    font-weight: 300;
}

.getting_started_box .started_row {
    display: flex;
    margin-top: 40px;
    justify-content: space-between;
}

.getting_started_box .started_row .started_col {
    flex: 1;
    margin-bottom: 30px;
    display: flex;
    justify-content: center;
    width: 33.333%;
}

.getting_started_box .started_row .started_col .icon_box {
    border: #424244 solid 1px;
    border-radius: 2px;
    padding: 40px;
    width: 300px;
    margin: auto;
    display: block;
    max-width: 100%;
}

.getting_started_box .started_row .started_col .icon_box .icn {
    margin-bottom: 20px;
}

.getting_started_box .started_row .started_col .txt_box h5 {
    color: #fff;
    font-size: 20px;
    margin-bottom: 10px;
    font-weight: 500;
}

.getting_started_box .started_row .started_col .txt_box p {
    color: #A2A0A2;
    font-weight: 300;
}

.widget_box_area .flex_row {
    display: flex;
    justify-content: space-between;
}

.widget_box_area .flex_row .flex_col {
    flex: 1;
}

.widget_box_area .flex_row .flex_col:first-child {
    margin-right: 20px;
}

.widget_box_area .flex_row .flex_col:last-child {
    margin-left: 20px;
}

.widget_box_area .flex_row .flex_col .widget_box {
    background-color: #2A2B2D;
    border: solid 1px #424244;
    text-align: center;
    padding: 30;
    min-height: 400px;
    margin: 40px 0;
}

.rfq_list_table {
    margin-top: 40px;
    width: 100%;
}

.table_area {
    width: ;
    margin: 0;
}

.table_area.margin_table {
    margin: 0 -64px;
}

.table_area table {
    width: 100%;
}

.table_area table tr {
    border-bottom: solid 1px #424244;
}

.table_area table tr th {
    padding: 16px;
    color: #fff;
    background-color: #26282C;
    font-size: 12px;
}

.table_area table tr td {
    padding: 16px;
    color: #A2A0A2;
    font-size: 12px;
}

.table_area table tr td .edit_btn {
    display: block;
    padding-left: 15px;
}

.table_area table tr td span.status_badge {
    padding: 2px 10px 2px 10px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    border: solid 1px #A2A0A2;
    width: 128px;
    font-weight: 500;
    font-size: 12px;
}

.table_area table tr td span.status_badge i {
    margin-right: 6.25px;
    font-size: 12px;
}

.table_area table tr td span.status_badge.active {
    background-color: #162321;
    border-color: #162321;
    color: #3BC27B;
}

.table_area table tr td span.status_badge.active_trans {
    background-color: transparent;
    border-color: #3BC27B;
    color: #3BC27B;
}

.table_area table tr td span.status_badge.awarded {
    background-color: #382912;
    border-color: #382912;
    color: #FFAC21;
}

.table_area table tr td span.status_badge.in_progress {
    background-color: #29085B;
    border-color: #29085B;
    color: #C19AFF;
}

.table_area table tr td span.status_badge.expired {
    background-color: #3E1319;
    border-color: #3E1319;
    color: #FF5C79;
}

.table_area table tr td span.status_badge.archived {
    background-color: #131B2D;
    border-color: #131B2D;
    color: #618DFF;
}

.table_area table tr td span.status_badge.onboarding {
    background-color: transparent;
    border-color: #FFAC21;
    color: #FFAC21;
}

.table_area table tr td span.status_badge.inactive {
    background-color: transparent;
    border-color: #FF5C79;
    color: #FF5C7A;
}

.table_area table tr td span.status_badge.withdrawn {
    background-color: #1B1D20;
    border-color: #1B1D20;
    color: #848C9D;
}

.table_area table tr td span.status_badge.notified {
    background-color: transparent;
    border-color: #C19AFF;
    color: #C19AFF
}

.table_area table tr td span.status_badge.locked {
    background-color: transparent;
    border-color: #A2A0A2;
    color: #A2A0A2;
}

.table_area table tr td span.status_badge.paid {
    background-color: #ABB1DA;
    border-color: #ABB1DA;
    color: #1E1F21;
}

.table_area table tr td span.status_badge.partially_paid {
    background-color: #EFFBDA;
    border-color: #EFFBDA;
    color: #1E1F21;
}

.table_area table tr td span.status_badge.unpaid {
    background-color: #DCE2E9;
    border-color: #DCE2E9;
    color: #1E1F21;
}

.table_area table tr td span.status_badge.expiring_soon {
    background-color: #F6DDD4;
    border-color: #F6DDD4;
    color: #1E1F21;
}

.table_area table tr input[type="checkbox"] {
    cursor: pointer;
    position: relative;
    height: 16px;
    width: 16px;
    border-radius: 2px;
}

.table_area table tr input[type="checkbox"]:before {
    transition-timing-function: cubic-bezier(.075, .820, .165, 1);
    border: 2px solid;
    border-radius: 2px;
    background-color: #1e1f21;
    border-color: transparent;
    box-sizing: border-box;
    color: #A2A0A2;
    content: close-quote;
    display: inline-block;
    height: 16px;
    outline: 2px solid #A2A0A2;
    transition-duration: .5s;
    transition-property: background-color, border-color;
    width: 16px;
}

.table_area table tr input[type="checkbox"]:checked:before {
    background-color: #a2a0a2;
    border-color: #000;
}

.table_area table tr td.edit_cell {
    position: relative;
}

.table_area table tr td.edit_cell .rfq_edit_menu {
    background-color: #1e1f21;
    width: 210px;
    position: absolute;
    top: auto;
    border: solid 1px #424244;
    right: 50%;
    display: none;
    z-index: 999;
    padding-left: 0px!important;
}

.table_area table tr td.edit_cell .rfq_edit_menu.active {
    display: block;
}

.table_area table tr td.edit_cell .rfq_edit_menu li {
    min-height: 40px;
    list-style: none;
    display: flex;
    align-items: center;
    padding: 2px;
}

.table_area table tr td.edit_cell .rfq_edit_menu li a {
    list-style: none;
    height: 100%;
    background-color: transparent;
    display: flex;
    align-items: center;
    height: 100%;
    width: 100%;
    border-radius: 4px;
    text-decoration: none;
    transition: var(--tran-03);
    min-height: inherit;
}

.table_area table tr td.edit_cell .rfq_edit_menu li a:hover {
    background-color: #404041;
}

.table_area table tr td.edit_cell .rfq_edit_menu li a .menu_icon {
    min-width: 40px;
    border-radius: 6px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

.table_area table tr td.edit_cell .rfq_edit_menu li a .menu_text {
    display: flex;
    justify-content: space-between;
    color: #A2A0A2;
    align-items: center;
    width: 100%;
    padding-right: 10px;
    font-size: 12px;
}

.bottom_right_btn_area {
    display: flex;
    width: 100%;
    justify-content: flex-end;
    margin-top: 40px;
}

.bottom_right_btn_area .btn_right {
    display: flex;
    align-items: center;
}

.bottom_right_btn_area .btn_right a,
.bottom_right_btn_area .btn_right button {
    display: inline-flex;
    margin: 4px;
    padding: 13px 26px;
    color: #424244;
    font-family: DM Sans;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 13.25px;
    /* 110.413% */
    ;
    border-radius: 2.539px;
    border: 0.846px solid #424244;
}

.bottom_right_btn_area .btn_right a:last-child,
.bottom_right_btn_area .btn_right button:last-child {
    margin-right: 0px;
}

.bottom_right_btn_area .btn_right .blue_border_btn:hover {
    border-color: #0081C4;
    background: #1C1D1F;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.12);
}

.btn_bg_transparent {
    display: inline-flex;
    margin: 4px;
    padding: 13px 26px;
    color: #F5F4F3;
    font-family: DM Sans;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 13.25px;
    /* 110.413% */
    ;
    border-radius: 2.539px;
    border: 0.846px solid #424244;
}

.btn_bg_transparent:hover {
    border-color: #0081C4;
    background: #1C1D1F;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.12);
}

.bottom_right_btn_area .btn_right .blue_bg_btn {
    background-color: #284BAA;
    color: #F5F4F3;
    border-color: #284BAA;
}

.bottom_right_btn_area .btn_right .blue_bg_btn:hover {
    background-color: #2a2b2d;
    border-color: #FFAC21;
}

.bottom_right_btn_area .btn_right .inactive_btn {
    background-color: #252628;
    color: #6A696A;
    border-color: transparent;
}

.blue_bg_btn {
    background-color: #284BAA;
    color: #F5F4F3;
    border-color: #284BAA;
    display: inline-flex;
    margin: 4px;
    padding: 13px 26px;
    color: #F5F4F3;
    font-family: DM Sans;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 13.25px;
    border-radius: 2.539px;
}

.blue_bg_btn:hover {
    background-color: #2a2b2d;
    border-color: #FFAC21;
}

.btn_dark_opentrd {
    display: inline-flex;
    margin: 4px;
    padding: 13px 26px;
    color: #F5F4F3;
    font-family: DM Sans;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 13.25px;
    /* 110.413% */
    ;
    border-radius: 2.539px;
    border: 0.846px solid #424244;
    background-color: transparent!important;
}

.btn_dark_opentrd:hover {
    border-color: #0081C4;
    background: #1C1D1F;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.12);
}

.rfq_history_area h3 {
    margin-bottom: 16px;
}

.rfq_history_area table {
    width: 100%;
}

.rfq_history_area table td {
    padding: 16px 8px;
}

.rfq_history_area table tr:last-child td {
    vertical-align: top;
}

.rfq_history_area .communication_history_box {
    display: flex;
    justify-content: space-between;
}

.rfq_history_area .communication_history_box .date_rfq {
    color: #F5F4F3;
    font-family: DM Sans;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    width: 70px;
    display: inline-flex;
}

.rfq_history_area .communication_history_box .action_on_rfq {
    color: #FFF;
    font-family: DM Sans;
    font-size: 12px;
    font-style: italic;
    font-weight: 400;
    line-height: normal;
}

.rfq_history_area .communication_history_box .time_rfq {
    color: #A2A0A2;
    font-family: DM Sans;
    font-size: 12px;
    font-style: italic;
    font-weight: 400;
    line-height: normal;
}

.sorting_area_row {
    display: flex;
    justify-content: space-between;
    width: 100%;
    ;
}

.sorting_area_row .sort_col {
    color: #fff;
}

.sorting_area_row .sort_col h3 {
    color: #fff;
    margin-bottom: 20px;
}

.sorting_area {}

.sorting_area .sort_btns {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.sorting_area .sort_btns ul {
    margin: 0px;
}

.sorting_area .sort_btns>div {
    position: relative;
}

.sorting_area .sort_btns .show_all_btn {
    margin-right: 20px;
    position: relative;
}

.sorting_area .sort_btns button {
    background-color: transparent;
    outline: none;
    display: flex;
    align-items: center;
    color: #A2A0A2;
    border: none;
}

.sorting_area .sort_btns button span {
    display: inline-flex;
}

.sorting_area .sort_btns button span.txt {
    margin: 0 10px;
}

.sorting_area .category_selected span {
    display: inline-block;
    padding: 5px 15px;
    border: solid 1px #424244;
    color: #A2A0A2;
    border-radius: 2px;
    font-size: 12px;
}

.sorting_area_row .search_col {
    padding-top: 50px;
    display: flex;
    align-items: center;
}

.sorting_area_row .search_rfq {
    border-radius: 0px;
    border-top: 0px;
    border-left: 0px;
    border-right: 0px;
    margin-left: 15px;
}

.sorting_area_row .new_rfq_btn a {
    display: flex;
    align-items: stretch;
}

.sorting_area_row .new_rfq_btn a .text {
    color: #A2A0A2;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 25.667px;
    /* 183.336% */
    letter-spacing: -0.084px;
    margin-left: 8px;
}

.sorting_area_row .new_rfq_btn a .img_icon img {
    height: 16px;
    width: 16px;
}

.sorting_area_sub_menu {
    display: none;
    position: absolute;
    top: calc(100% + 2px);
    width: 220px;
    background-color: #1E1F21;
    list-style-type: none;
    list-style: none;
    background-color: #1e1f21;
    border: solid 1px #424244;
    z-index: 999;
    left: 0;
}

.sorting_area_sub_menu.active {
    display: block;
}

.sorting_area_sub_menu li {
    min-height: 40px;
    list-style: none;
    display: flex;
    align-items: center;
    padding: 2px;
}

.sorting_area_sub_menu li a {
    list-style: none;
    height: 100%;
    background-color: transparent;
    display: flex;
    align-items: center;
    height: 100%;
    width: 100%;
    border-radius: 4px;
    text-decoration: none;
    transition: var(--tran-03);
    min-height: inherit;
    padding-left: 16px;
    padding-right: 16px;
    cursor: context-menu;
}

.sorting_area_sub_menu li a:hover {
    background-color: #404041;
}

.sorting_area_sub_menu li a .menu_check {
    display: inline-flex;
    margin-right: 8px;
}

.sorting_area_sub_menu li a .menu_check input {
    margin: 0px;
}

.sorting_area_sub_menu li a .menu_check input[type="checkbox"] {
    cursor: pointer;
    position: relative;
    height: 16px;
    width: 16px;
    border-radius: 2px;
}

.sorting_area_sub_menu li a .menu_check input[type="checkbox"]:before {
    transition-timing-function: cubic-bezier(.075, .820, .165, 1);
    border: 2px solid;
    border-radius: 2px;
    background-color: #1e1f21;
    border-color: transparent;
    box-sizing: border-box;
    color: #A2A0A2;
    content: close-quote;
    display: inline-block;
    height: 16px;
    outline: 2px solid #A2A0A2;
    transition-duration: .5s;
    transition-property: background-color, border-color;
    width: 16px;
}

.sorting_area_sub_menu li a .menu_check input[type="checkbox"]:checked:before {
    background-color: #a2a0a2;
    border-color: #1e1f21;
}

.sorting_area_sub_menu li a .menu_text {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.sorting_area_sub_menu li a .menu_text .txt {
    color: #A2A0A2
}

.form_group h4 {
    color: #F5F4F3;
    font-family: Poppins;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin-bottom: 24px;
    margin-top: 0px;
}

.form_group p {
    color: #A2A0A2;
    font-feature-settings: 'clig' off, 'liga' off;
    font-family: DM Sans;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 24px;
}

.form_group .form_field {
    width: 100%;
    background: ;
    position: relative;
    margin-bottom: 16px;
}

.form_group .form_field label.float_label {
    color: #A2A0A2;
    font-family: DM Sans;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 15.658px;
    /* 130.484% */
    ;
    padding: 5px 8px;
    border-radius: 0px;
    background-color: #1c1d1f;
    display: inline-flex;
    position: absolute;
    top: 18px;
    z-index: 99;
    left: 20px;
    transition: all 200ms ease-in-out;
}

.form_group .form_field .float_label.active {
    top: -12px!important;
}

.form_group .form_field input {
    width: 100%;
    background: #1c1d1f;
    outline: none;
    padding: 18px 30px 18px 20px;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.05);
    border: solid 1px #424244;
    position: relative;
    border-radius: 3px;
    color: #A2A0A2;
}

.input_and_txt input {
    width: 50%!important;
}

.form_group .form_field select {
    width: 100%;
    background: #1c1d1f;
    outline: none;
    padding: 18px 30px 18px 20px;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.05);
    border: solid 1px #424244;
    position: relative;
    border-radius: 3px;
    color: #A2A0A2;
}

.form_group .form_field textarea {
    width: 100%;
    background: #1c1d1f;
    outline: none;
    padding: 18px 30px 18px 20px;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.05);
    border: solid 1px #424244;
    position: relative;
    border-radius: 3px;
    color: #A2A0A2;
}

.form_group .form_field button {
    background: #1c1d1f;
    outline: none;
    padding: 18px 30px 18px 20px;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.05);
    border: solid 1px #424244;
    position: relative;
    border-radius: 3px;
    color: #A2A0A2;
    display: inline-flex;
    align-items: center;
    gap: var(--4, 4px);
    margin-right: 8px;
}


/* .form_group .form_field button span{height: 14px;} */

.form_group .form_field button span img {
    width: 12px;
    height: 12px;
}

.form_group .form_field input:focus {
    border-color: #0081C4;
}

.form_group .form_field input:foucs~.float_label {
    top: -10px!important;
    color: #000;
}

.modal_opentrd .modal-dialog {
    max-width: 1000px;
}

.modal_opentrd_short .modal-dialog {
    max-width: 540px;
}

.modal_opentrd_short .modal-dialog .modal-content .modal-body {
    text-align: center;
    padding: 30px 64px!important;
}

.modal_opentrd_short .modal-dialog .modal-content .modal-body h3 {
    text-align: center;
    color: #FFF;
    text-align: center;
    font-family: Poppins;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin-bottom: 8px;
    ;
}

.modal_opentrd_short .modal-dialog .modal-content .modal-body p {
    color: #A2A0A2;
    text-align: center;
    font-family: DM Sans;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.modal_opentrd_short .modal-dialog .modal-content .modal-body .btn_area {
    margin: 40px 0 0 0;
}

.modal_opentrd .modal-dialog .modal-content {
    background-color: #1e1f21!important;
    border-radius: 3px!important;
    margin-top: 200px;
}

.modal_opentrd .modal-dialog .modal-content .modal-header {
    padding: 40px 64px 0px 64px!important;
    border: none!important;
    position: relative;
}

.modal_opentrd .modal-dialog .modal-content .modal-header .btn-close {
    background: none!important;
    position: absolute;
    right: 15px;
    top: 15px;
}

.modal_opentrd .modal-dialog .modal-content .modal-body {
    padding: 0 64px;
}

.modal_opentrd .modal-dialog .modal-content .modal-footer {
    padding: 0 64px 40px 64px!important;
    border: none!important;
}