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

Bootstrap 4 Admin Template

https://bootstrapious.com/p/admin-template

==========================================================
==========================================================
*/
/*
* ==========================================================
*     GENERAL STYLES
* ==========================================================
*/
/*Responsiveness*/
@media only screen and (max-width: 1200){
  .right_quantity_changer{
    display: none !important;
  }
  .right_quantity_changer_sc1{
    display: none;
  }
    }
  @media only screen and (max-width: 571px){

    }
  @media only screen and (max-width: 360px){
    .ip4_mbl_cls{
      font-size: 15px !important;
    }
    .per_item_style{
      font-size: 15px !important;
    }
    }
    .font_sml{
      font-size: 12px !important;
    }
    .font_smll{
      font-size: 20px !important;
    }
    @media(min-width: 320px) and (max-width: 768px){
      .zrmtopadinre{
        padding-left: 35px !important;
        padding-right: 35px !important;
      }
      .sqbhtkl{
        padding-top: 0px;
        padding-bottom: 0px;
      }
      .pbqlmjtgrd{
        margin-top: 5px;
      }
      .whpsmihmycu{
        width: 70% !important;
        position: relative;
      }
      .firnritcstmsishkc{
        width: 30%;
        float: left;
      }
      .nritcstmsishkcsec{
        width: 70% !important;
        float: right !important;
        padding-right: 0px !important;
      }
      .nritcstmsishkc{
        display: block !important;
        padding-bottom: 27px;
        width: 100%;
      }
      .kjvsbpirdf {
        right: 0px !important;
        max-width: 200px !important;
        min-width: 200px !important;
        box-shadow: 2px 2px 2px rgb(0 0 0 / 10%), -1px 0 2px rgb(0 0 0 / 5%);
    }
      .fokdgsajg{
        left: 0px !important;
      }
      .nskfkldlpi{
        margin-left: 0px !important;
      }
      .btn_search_icrtf{
        top: 11px !important;
        right: 11px !important;
        padding: 10px 0px 10px !important;
        width: 10% !important;
      }
      .cnosbkclmazkh{
        width: 100% !important;
        padding: 10px 10px !important;
      }
      .whpsmtklfd{
        width: 45% !important;
      }
      .whpsmtklsd{
        width: 50% !important;
        float: right !important;
      }
      .psasmhhompbnk{
        position: unset !important;
      }
      .fntsrbhijg{
        font-size: 14px !important;
      }
      .bulk_title .btn_bulk_change button#productpriceupdate {
        font-size: 10px !important;
      }
      .hffshvl{
        font-size: 14px !important;
      }
      .div_mdl_cen{
        width: 295px !important;
        margin: auto;
      }
      .flhbiftbk{
        float: left !important;
      }
      .martprphg{
        margin-top: 8px;
      }
      .firscuswid{
        display: contents;

      }
      .bulkmbl_fntnew{
        position: unset !important;
        font-size: 10px !important;
        padding: 5px 6px !important;
      }
      .btn{
        font-size: 13px !important;
      }
      .bulkmbl_fntnetxtw{
        font-size: 10px !important;
        padding: 5px 6px !important;
      }
      h1, .h1{
        font-size: 20px !important;
      }
      .navbar-toggler.purchaser_header_navdis{
        display: none;

      }
      .right-col.col-lg-4.col-xl-5.col-md-6.col-12.my-auto.order_series_next {
        top: -11px;
    }
    .icons_delete_edit {
      position: absolute;
      bottom: 9px !important;
    }
      .Total_price{
        font-size: 16px !important;
      }
      .project .right-col {
        margin-top: -3px !important;
        margin-left: 0px;
      }
      .right-col.col-lg-2.col-xl-1.col-md-2.col-12.my-auto.order_edit_appnd{
        position: absolute;
        right: 20px;
        padding-top: 13px;
      }
      .project-title.d-flex.align-items-center.order_edit_appndimg{
        padding-bottom: 12px;
      }
      .full_row_btn{
        margin-top: 15px;
      }
    }
    @media (min-width: 320px) and (max-width: 1023px){
      .project div[class*='col-']{
        border-right: 1px solid transparent !important;
      }
    }
    /*responsiveness end*/
    /*my css*/
    .side-navbar{
      display: none;
    }
    input[type=number]::-webkit-inner-spin-button,
    input[type=number]::-webkit-outer-spin-button {
       opacity: 1;
    }
    .row.bg-white.has-shadow.h-100.main_order_page{
      margin: 0;
      padding: 35px 0;
      margin-bottom: 35px;
    }


    .logo_img{
      width: 50px;
      border-radius: 50%;
    }
    .logo_img1{
      width: 150px;
    }
    .Total_price{
      font-weight: bold;
      font-size: 20px;
    }
    .change_quantity{
      margin-left: 0px;
      width: 42%;
    }
    .order_series_next{
      margin-left: 40px;
    }
    .order_status_tag{

    }
    .left-col.col-lg-6.col-xl-5.col-md-4.col-12.d-flex.align-items-center.justify-content-between.my-auto.orders_logo_text {
      top: -10px;
    }
    .next_order_now{
      margin: 20px;
      margin-right: 0px;
      display: flex;
    }
    .img_onow{
      width: 24px;
      position: absolute;
      top: -3px;
      left: 0
    }
    .onow_txt{
      display: block;
      font-size: 12px;
    }
    .ordernowwrapper {
      position: relative;
    }
    .right_atag_cls{
      padding: 0px 6px 10px 27px;
      margin-left: 13px;
      border-radius: 5px;
      text-decoration: none;
    }
    .next_dte_cls{
      margin-right: 8px;
    }
    .posi_real_cls{
      position: relative;
    }
    .row_home_pge{
      margin-bottom: 65px !important;
    }
    .action_needed{
      background: #00c4cc;
      padding: 9px 40px 9px;
      position: absolute;
      right: -4px;
      top: -61px;
      color: white;
      margin-top: 20px;
    }
    .newacnedded{
      right: 28px !important;
      top: 62px !important;
    }
    .newacneddednew{
      right: 28px !important;
      top: 83px !important;
    }
    span.action_needed::before {
      content: '';
      position: absolute;
      width: 9px;
      height: 43px;
      background: #00c4cc;
      right: -9px;
      top: 0;
      z-index: 999;
    }
    span.action_needed::after {
      content: '';
      position: absolute;
      right: -9px;
      bottom: -10px;
      z-index: 999;
      width: 0;
      height: 0;
      border-top: 10px solid #00c4cc;
      border-right: 12px solid transparent;
    }
    .ordernowwrapper::after {
      content: "";
      position: absolute;
      width: 2px;
      height: 28px;
      background: #797b7d;
      left: 0;
      top: -4px;
    }
    .os_log_create{
      position: absolute;
      right: 30px;
    }

    .icons_delete_edit {
      position: absolute;
      bottom: 13px;
    }
    .row_os_pge{
      display: flex;
      width: 210px;
    }
    .btn-circle_deleteindex{
      width: 45px;
      height: 45px;
      text-align: center;
      padding: 8px 0;
      font-size: 20px;
      line-height: 1.428571429;
      border-radius: 22px;
      border: none;
      background-color: #d31515;
    }
    .btn-circle_pause{
      width: 45px;
      height: 45px;
      text-align: center;
      padding: 10px 0;
      font-size: 17px !important;
      line-height: 1.428571429;
      border-radius: 22px;
      border: none;
      background-color: #283142;
    }
    .order_id_small{
      margin-top: 40px;
      margin-bottom: -15px;
      padding-left: 0px;
      font-weight: bold;
      font-size: 30px;
    }
    .order_right_now{
      color: #000000;
      /* text-decoration: underline; */
      font-weight: 600;
      position: relative;

    }
    .order_right_now:hover{
      color: #000000;
      text-decoration: underline;
      font-weight: 600;

    }
    .order_id_show{
      margin-top: 40px;
      padding-left: 30px;
      font-size: 30px;
      margin-bottom: 40px;
    }
    .order_logo{
      width: 67px;
    }
    .prsed_screen_h{
      margin-left: 0px !important;
    }
    /*end*/
    /*Status*/
    .status_Delivered{
      color: #ffc800;
      font-size: 12px;
      font-weight: 500;
    }
    .status_Processing{
      color: #FAAD14;
      font-size: 12px;
      font-weight: 500;

    }
    .status_Pending1 {
      color: white;
      font-size: 14px;
      background-color: #FFA500;
      padding: 5px 15px;
      border-radius: 50px;
      border: none;
      width: 100%;
    }
    .status_Pending1os{
      color: white !important;
      font-size: 14px;
      background-color: #FFA500;
      padding: 5px 20px;
      border-radius: 50px;
      border: none;
      width: auto;
      cursor: pointer;
      margin-top: 10px;
      width: 100%;
      display: block;
    }
    .status_pendings{
      color: #86C986;
      font-size: 12px;
      font-weight: 500;
    }
    .status_Cancelled{
      color: #FF4D4F;
      font-size: 12px;
      font-weight: 500;

    }
    .estmate_padding{
      padding-top: 6px;
      display: block;
    }
    .status_Shipped{
      color: #1890FF;
      font-size: 12px;
      font-weight: 500;
    }
    .status_Cancelledac{
      font-size: 12px !important;
    }
    .req_act_cls{
      background: yellow;
      color: #000000e8 !important;
      border-radius: 11px;
      padding: 8px;
      font-weight: bold;
    }
    .status_pendingp{
      color: maroon;
      font-size: 12px;
      font-weight: 500;
    }
    .status_pendingpac{
      color: #68A968;
      font-size: 12px;
      font-weight: 500;
    }
    .btn-circle_edit {
      width: 45px;
      height: 45px;
      text-align: center;
      padding: 8px 0;
      font-size: 12px;
      line-height: 1.428571429;
      border-radius: 22px;
      border: none;
      background-color: #01DCE5;
    }
    .btn-circle_delete {
      width: 45px;
      height: 45px;
      text-align: center;
      padding: 8px 0;
      font-size: 12px;
      line-height: 1.428571429;
      border-radius: 22px;
      border: none;
      background-color: #d31515;
    }
    .span_icons_txt{
      font-size: 10px;
      display: inline-block;
      text-align: center;
      width: 50%;
    }
    .btn-circle_oseries {
      width: 30px;
      height: 30px;
      text-align: center;
      padding: 4px 0;
      font-size: 12px;
      line-height: 1.428571429;
      border-radius: 22px;
      border: none;
      background-color: #00C4CC;
    }
    .fa_fa_orderedit{
      /* position: absolute;
      left: 15px;
      top: 21px; */
      color: white;
      font-size: 20px;
    }
    .fa_orderdelete{
      /* position: absolute;
      left: 70px;
      top: 21px; */
      color: white;
      font-size: 20px;
    }
    .home_page_btn{
      color: white;
      font-size: 15px;
    }
    .status_Pending{
      color: rgb(0, 0, 0);
      position: absolute;
      bottom: 1px;
      right: -30px;
      background-color:#FFA500;
      border-radius: 50px;
       border: none;
      padding: 12px 0px;
      font-weight: 700 !important;
    }
    .home_page_search{
      position: absolute;
      max-width: 190px;
    }
    .btn-circle_editoswh {
      width: 40px;
      height: 40px;
      text-align: center;
      padding: 8px 0;
      font-size: 19px;
      line-height: 1.428571429;
      border-radius: 22px;
      border: none;
      background-color: #00C4CC;
    }

    .last_seen{
      color: green !important;
      font-weight: 600;
    }
    .never_open{
      color: purple !important;
    }
    .btn-circle_eye {
      width: 40px;
      height: 40px;
      text-align: center;
      padding: 8px 0;
      font-size: 19px;
      line-height: 1.428571429;
      border-radius: 22px;
      border: none;
      background-color: purple ;
    }
    .btn-circle_editos {
      width: 40px;
      height: 40px;
      text-align: center;
      padding: 7px 0;
      font-size: 19px;
      line-height: 1.428571429;
      border-radius: 22px;
      border: none;
      background-color: #19a136;
    }
    .btn-circle_editosmore {
      width: 40px;
      height: 40px;
      text-align: center;
      padding: 0px 0;
      font-size: 19px;
      line-height: 1.428571429;
      border-radius: 22px;
      border: none;
      cursor: pointer;
    }
    .btn-circle_editoschrn{
      width: 30px;
      height: 30px;
      text-align: center;
      padding: 4px 0;
      font-size: 15px;
      line-height: 1.428571429;
      border-radius: 22px;
      border: none;
      background-color: #19a136;
    }
    .btn-circle_delete {
      width: 40px;
      height: 40px;
      text-align: center;
      padding: 8px 0;
      font-size: 19px;
      line-height: 1.428571429;
      border-radius: 22px;
      border: none;
      background-color: #d31515;
    }
    .border_page {
      width: 100%;
      padding:10px 0px !important;
      margin: 0 !important;
      border-bottom: 1px solid #f3ecec;
      padding-bottom: 10px !important;
      margin-bottom: 10px !important;
    }
    .border_pagenew{
      border-bottom: 1px solid #f3ecec;
    }
    .gry_bck{
      background: #e9ecef;
      border: white;
    }
    .uom_class{
      padding-left: 8px;
    }
    .uom_class_n{
      margin-top: 4px;
      padding-right: 6px;
      padding-left: 8px;
    }
    .small_uom{
      padding-top: 6px;
      display: block;
    }
    .upload_btn_mr{
      margin-right: 6px;
    }.dol_pro_add{
      position: absolute;
      left: 0;
      top: 8px;
      font-weight: 600;
    }
    .btn_form{
      width: 100%;
    }
    .btn_formss{
      width: 100%;
    }
    .btnslist{
      width: 75%;
      float: left;
    }
    .btn_search_ic{
      position: absolute;
      top: 0;
      right: 0;
      border-radius: 0;
    }
    .btn_search_icss{
      position: absolute;
      top: 0;
      right: 0;
      border-radius: 0;
    }
    .btnslist a {
      background: #01DCE5;
      padding: 7px 12px;
      color: #fff;
      display: inline-block;
      margin-right: 10px;
    }
    .frm_sea{
      width:25%;
      float:left;
    }
    .frm_seass{
      width:25%;
      float:right;
    }
    .pro_div_pur{
      margin-left: 14px;
      font-size: 14px;
    }
    .font_sze{
      font-size: 14px !important;
    }
    .status_purchaser_mbl{
      color: #FFA500;
       font-size: 14px;
    }
    @media only screen and (max-device-width: 352px) {
      .change_or_mbl{
        margin-top: 8px;
      }
      .re_orders_of_order {
        font-size: 10px !important;
    }
    .quantity_mbl_sc {
      max-width: 81px !important;
    }
    }

    /*Status end*/
    @media only screen and (max-device-width: 480px) {
      .cata_indexresissue{
        padding-bottom: 50px !important;
      }
      .all-order-frm {
        font-size: 14px !important;
    }
      .order_detail_sepbaar{
        display: none;
          }
      .font_sze{
        font-size: 12px !important;
        display: block !important;
      }
      .status_purchaser_mbl{
         font-size: 12px;
      }
      .col-lg-6.col-xl-6.col-md-6.col-sm-12.col-xs-12.header_buttonss{
        padding-top: 15px;
      }
      .mob_disp{
        display: none;
      }
      .img_order_parent{
        padding-bottom: 25px;
      }
      .view_all_order {
        margin-left: 0;
        bottom: -3px !important;
        right: 0;
    }

      .mb-1.ml-xl-2.ml-lg-2.ml-md-2.text-white.order_detail_propur{
        display: inline-block;
        white-space: inherit;
        font-size: 15px !important;
        font-weight: 400;
      }
      .order_detail_statuses{
        display: inline-block;
        white-space: nowrap;
      }

      .order_detail_eta{
        color: #aaa;
        display: inline-block;
        white-space: nowrap;
        overflow: hidden;
        padding-top: 4px;
        font-size: 70%;
      }
      .col-lg-6.col-xl-6.col-md-12.col-sm-12.col-xs-12.header_buttonss{
        padding-top: 15px;
      }
      .main_span {
        font-size: 10px !important;
    }
    .spntotal {
      font-size: small !important;
    }
      .col-lg-6.col-xl-6.col-md-6.col-sm-12.col-xs-12.header_buttonss button{

        width: 48%;
        float: left;
        margin: 1% !important;
        font-size: 10px !important;
        padding: 6px 10px;
        white-space: nowrap;

      }
      .Total_price.mt-1.text-xl-right.text-md-right.text-lg-right.total_price_proindex{
        text-align: right;

      }

      .order_detail_txtquan
      {
        width: 15%;
      }
      .col-lg-6.col-xl-6.col-md-12.col-sm-12.col-xs-12.header_buttonss button{
        width: 48%;
        float: left;
        margin: 1% !important;
        font-size: 11px !important;
        padding: 6px 10px;
      }
      .right-col.col-lg-2.col-xl-1.col-md-2.col-12.c.my-auto{
        position: absolute;
        right: 7px;

      }


    .order_status_tag {

    }
    .status_Delivered{
      top: 46px;
      color: #ffc800;

    }
    .status_Processing{
      top: 46px;
      color: #FAAD14;
    }
    .status_pendings{
      top: 46px;
      color: #86C986;
    }
    .status_Cancelled{
      top: 46px;
      color: #FF4D4F;
    }
    .status_Shipped{
      top: 46px;
      color: #1890FF;
    }
    .status_pendingp{
      top: 46px;
      color:maroon;
    }

    .form-control {
      font-size: 13px;
    }
    .col-sm-3.text-left.add_product_arrows{
      text-align: left;
        width: 10%;
        padding: 0
    }
    .col-sm-6.add_pro_prnarrow{
      width: 90%;
        float: left;
    }
    .right-col.col-lg-2.col-xl-1.col-md-2.col-12.my-auto.order_detail_rembtn{
      position: absolute;
      padding-top: 19px;
      left: -10px;

    }


    }

    .details{
      color: #999;
        font-size: 0.9em;
    }

    .brand-text{
      color: #212529;
    }




    body {
      overflow-x: hidden;
    }

    a,
    i,
    span {
      display: inline-block;
      text-decoration: none;
      -webkit-transition: all 0.3s;
      transition: all 0.3s;
    }

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

    section {
      padding: 20px 0;
    }

    canvas {
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
    }

    .container-fluid {
      padding: 0 30px;
    }
    .padd_ri_in{
      padding-right: 0px;
    }

    @media (max-width: 575px) {
      .container-fluid {
        padding: 0 15px;
      }
    }

    header.page-header {
      padding: 20px 0;
    }

    table, .table {
      font-size: 0.9em;
      color: #666;
    }

    .card-close {
      position: absolute;
      top: 15px;
      right: 15px;
    }

    .card-close .dropdown-toggle {
      color: #999;
      background: none;
      border: none;
    }

    .card-close .dropdown-toggle:after {
      display: none;
    }

    .card-close .dropdown-menu {
      border: none;
      min-width: auto;
      font-size: 0.9em;
      border-radius: 0;
      -webkit-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1), -2px -2px 3px rgba(0, 0, 0, 0.1);
      box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1), -2px -2px 3px rgba(0, 0, 0, 0.1);
    }

    .card-close .dropdown-menu a {
      color: #999 !important;
    }

    .card-close .dropdown-menu a:hover {
      background: #796AEE;
      color: #fff !important;
    }

    .card-close .dropdown-menu a i {
      margin-right: 10px;
      -webkit-transition: none;
      transition: none;
    }

    .content-inner {
      position: relative;
      width: calc(100% - 0px);
      min-height: calc(100vh - 70px);
      padding-bottom: 60px;
    }

    .content-inner.active {
      width: calc(100% - 90px);
    }

    .page-header {
      background: #fff;
      padding: 20px;
      -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1);
      box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1);
      position: relative;
      z-index: 8;
    }

    /**[class*="icon-"] {
      -webkit-transform: translateY(3px);
      transform: translateY(3px);
    }*/

    button,
    input {
      outline: none !important;
    }

    .card {
      margin-bottom: 30px;
      -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1), -1px 0 2px rgba(0, 0, 0, 0.05);
      box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1), -1px 0 2px rgba(0, 0, 0, 0.05);
    }

    .card-header {
      -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.05);
      box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.05);
    }

    .card-header h1,
    .card-header h2,
    .card-header h3,
    .card-header h4,
    .card-header h5,
    .card-header h6 {
      margin-bottom: 0;
    }

    .breadcrumb-holder {
      background: #fff;
    }

    .breadcrumb {
      background: #fff;
      position: relative;
      z-index: 7;
      border-radius: 0;
      padding: 15px 0;
      margin-bottom: 0;
    }

    .breadcrumb li.breadcrumb-item {
      color: #aaa;
      font-weight: 300;
    }

    /*=== Helpers ===*/
    .text-bold {
      font-weight: 700;
    }

    .text-small {
      font-size: 0.9rem;
    }

    .text-xsmall {
      font-size: 0.8rem;
    }

    .bg-red {
      background: #ff7676 !important;
      color: #fff;
    }

    .bg-red:hover {
      color: #fff;
    }

    .bg-blue {
      background: #85b4f2 !important;
      color: #fff;
    }

    .bg-blue:hover {
      color: #fff;
    }

    .bg-yellow {
      background: #eef157 !important;
      color: #fff;
    }

    .bg-yellow:hover {
      color: #fff;
    }

    .bg-green {
      background: #54e69d !important;
      color: #fff;
    }

    .bg-green:hover {
      color: #fff;
    }

    .bg-orange {
      background: #ffc36d !important;
      color: #fff;
    }

    .bg-orange:hover {
      color: #fff;
    }

    .bg-violet {
      background: #796AEE !important;
      color: #fff;
    }

    .bg-violet:hover {
      color: #fff;
    }

    .bg-gray {
      background: #ced4da !important;
    }

    .bg-white {
      background: #fff !important;
    }

    .text-red {
      color: #ff7676;
    }

    .text-red:hover {
      color: #ff7676;
    }

    .text-yellow {
      color: #eef157;
    }

    .text-yellow:hover {
      color: #eef157;
    }

    .text-green {
      color: #54e69d;
    }

    .text-green:hover {
      color: #54e69d;
    }

    .text-orange {
      color: #ffc36d;
    }

    .text-orange:hover {
      color: #ffc36d;
    }

    .text-violet {
      color: #796AEE;
    }

    .text-violet:hover {
      color: #796AEE;
    }

    .text-blue {
      color: #85b4f2;
    }

    .text-blue:hover {
      color: #85b4f2;
    }

    .text-gray {
      color: #ced4da;
    }

    .text-gray:hover {
      color: #ced4da;
    }

    .text-uppercase {
      letter-spacing: 0.2em;
    }

    .lh-2 {
      line-height: 2;
    }

    .page {
      background: #f8f8f8;
    }

    .page .text-white {
      color: #fff;
    }

    .no-padding {
      padding: 0 !important;
    }

    .no-padding-bottom {
      padding-bottom: 0 !important;
    }

    .no-padding-top {
      padding-top: 0 !important;
    }

    .no-margin {
      margin: 0 !important;
    }

    .no-margin-bottom {
      margin-bottom: 0 !important;
    }

    .no-margin-top {
      margin-top: 0 !important;
    }

    .page {
      overflow-x: hidden;
    }

    .has-shadow {
      -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1), -1px 0 2px rgba(0, 0, 0, 0.05);
      box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1), -1px 0 2px rgba(0, 0, 0, 0.05);
    }

    .badge {
      font-weight: 400;
    }

    .badge-rounded {
      border-radius: 50px;
    }

    .list-group-item {
      border-right: 0;
      border-left: 0;
    }

    .list-group-item:first-child, .list-group-item:last-child {
      border-radius: 0;
    }

    .overflow-hidden {
      overflow: hidden;
    }

    .tile-link {
      position: absolute;
      cursor: pointer;
      width: 100%;
      height: 100%;
      left: 0;
      top: 0;
      z-index: 30;
    }

    /*
    * ==========================================================
    *     SIDEBAR
    * ==========================================================
    */
    nav.side-navbar {
      background: #fff;
      min-width: 250px;
      max-width: 250px;
      color: #686a76;
      -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
      box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
      z-index: 9;
      /*==== Sidebar Header ====*/
      /*==== Sidebar Menu ====*/
      /*==== Shrinked Sidebar ====*/
    }

    nav.side-navbar a {
      color: inherit;
      position: relative;
      font-size: 0.9em;
    }

    nav.side-navbar a[data-toggle="collapse"]::before {
      content: '\f104';
      display: inline-block;
      -webkit-transform: translateY(-50%);
      transform: translateY(-50%);
      font-family: 'FontAwesome';
      position: absolute;
      top: 50%;
      right: 20px;
    }

    nav.side-navbar a[aria-expanded="true"] {
      background: #EEF5F9;
    }

    nav.side-navbar a[aria-expanded="true"]::before {
      content: '\f107';
    }

    nav.side-navbar a i {
      font-size: 1.2em;
      margin-right: 10px;
      -webkit-transition: none;
      transition: none;
    }

    nav.side-navbar a .badge {
      vertical-align: middle;
    }

    nav.side-navbar .sidebar-header {
      padding: 30px 15px;
    }

    nav.side-navbar .avatar {
      width: 55px;
      height: 55px;
    }

    nav.side-navbar .title {
      margin-left: 10px;
    }

    nav.side-navbar .title h1 {
      color: #333;
    }

    nav.side-navbar .title p {
      font-size: 0.9em;
      font-weight: 200;
      margin-bottom: 0;
      color: #aaa;
    }

    nav.side-navbar span.heading {
      text-transform: uppercase;
      font-weight: 400;
      margin-left: 20px;
      color: #ccc;
      font-size: 0.8em;
    }

    nav.side-navbar ul {
      padding: 15px 0;
    }

    nav.side-navbar ul li {
      /* submenu item active */
    }

    nav.side-navbar ul li a {
      padding: 10px 15px;
      text-decoration: none;
      display: block;
      font-weight: 300;
      border-left: 4px solid transparent;
    }

    nav.side-navbar ul li a:hover {


      color: black;
      font-weight: bold;
    }

    nav.side-navbar ul li li a {
      padding-left: 50px;
      background: #EEF5F9;
    }

    nav.side-navbar ul li.active > a {

      color: black;
      font-weight: bold;

    }

    nav.side-navbar ul li.active > a:hover {
      color: black;
    }

    nav.side-navbar ul li li.active > a {
      color: black;
    }

    nav.side-navbar ul li ul {
      padding: 0;
    }

    nav.side-navbar.shrinked {
      min-width: 90px;
      max-width: 90px;
      text-align: center;
    }

    nav.side-navbar.shrinked span.heading {
      margin: 0;
    }

    nav.side-navbar.shrinked ul li a {
      padding: 15px 2px;
      border: none;
      font-size: 0.8em;
      color: #aaa;
      -webkit-transition: color 0.3s, background 0.3s;
      transition: color 0.3s, background 0.3s;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    nav.side-navbar.shrinked ul li a[data-toggle="collapse"]::before {
      content: '\f107';
      -webkit-transform: translateX(50%);
      transform: translateX(50%);
      position: absolute;
      top: auto;
      right: 50%;
      bottom: 0;
      left: auto;
    }

    nav.side-navbar.shrinked ul li a[data-toggle="collapse"][aria-expanded="true"]::before {
      content: '\f106';
    }

    nav.side-navbar.shrinked ul li a:hover {
      color: #fff;
      border: none;
    }

    nav.side-navbar.shrinked ul li a:hover i {
      color: #fff;
    }

    nav.side-navbar.shrinked ul li a i {
      margin-right: 0;
      margin-bottom: 2px;
      display: block;
      font-size: 1rem;
      color: #333;
      -webkit-transition: color 0.3s;
      transition: color 0.3s;
    }

    nav.side-navbar.shrinked ul li.active > a {
      color: #fff;
    }

    nav.side-navbar.shrinked ul li.active > a i {
      /* color: #fff; */
    }

    nav.side-navbar.shrinked .sidebar-header .title {
      display: none;
    }

    /* SIDEBAR MEDIAQUERIES ----------------------------------- */
    @media (max-width: 1199px) {
      nav.side-navbar {
        margin-left: -90px;
        min-width: 90px;
        max-width: 90px;
        text-align: center;
        overflow: hidden;
      }
      nav.side-navbar span.heading {
        margin: 0;
      }
      nav.side-navbar ul li a {
        padding: 15px 2px;
        border: none;
        font-size: 0.8em;
        color: #aaa;
        -webkit-transition: color 0.3s, background 0.3s;
        transition: color 0.3s, background 0.3s;
      }
      nav.side-navbar ul li a[data-toggle="collapse"]::before {
        content: '\f107';
        -webkit-transform: translateX(50%);
        transform: translateX(50%);
        position: absolute;
        top: auto;
        right: 50%;
        bottom: 0;
        left: auto;
      }
      nav.side-navbar ul li a[data-toggle="collapse"][aria-expanded="true"]::before {
        content: '\f106';
      }
      nav.side-navbar ul li a:hover {
        color: #fff;
        border: none;
      }
      nav.side-navbar ul li a:hover i {
        color: #fff;
      }
      nav.side-navbar ul li a i {
        margin-right: 0;
        margin-bottom: 5px;
        display: block;
        font-size: 1.6em;
        color: #333;
        -webkit-transition: color 0.3s;
        transition: color 0.3s;
      }
      nav.side-navbar ul li.active > a {
        color: #fff;
      }
      nav.side-navbar ul li.active > a i {
        color: #fff;
      }
      nav.side-navbar .sidebar-header .title {
        display: none;
      }
      nav.side-navbar.shrinked {
        margin-left: 0;
      }
      .content-inner {
        width: 100%;
      }
      .content-inner.active {
        width: calc(100% - 90px);
      }
    }

    /*
    * ==========================================================
    *     MAIN NAVBAR
    * ==========================================================
    */
    @media (min-width: 992px){
      .navbar-expand-lg .navbar-nav .nav-link {
        padding-right: 1rem;
        padding-left: 1rem;
    }
    }

    nav.navbar {
      background: white;
      padding-top: 15px;
      padding-bottom: 15px;
      color: #fff;
      position: relative;
      border-radius: 0;
      -webkit-box-shadow: 2px 2px 2px rgb(0 0 0 / 20%);
      box-shadow: 2px 2px 2px rgb(0 0 0 / 20%);
      z-index: 10;
      padding-left: 15px;
      padding-right: 15px;
    }
    nav.navbar.purchaser_navbarr_sc {
      background: white;
      /* padding-top: 15px; */
      /* padding-bottom: 30px; */
      color: #fff;
      position: relative;
      border-radius: 0;
      -webkit-box-shadow:unset;
      z-index: 10;
      margin: 16px 30px 8px 30px;
      padding: 0;
      /*==== Toggle Sidebar Btn ====*/
      /*==== Navbar Items ====*/
      /*==== Search Box ====*/
      /*==== Dropdowns ====*/
    }

    nav.navbar .badge {
      width: 22px;
      height: 22px;
      line-height: 22px;
      text-align: center;
      padding: 0;
      border-radius: 50%;
    }

    nav.navbar .navbar-holder {
      width: 100%;
    }

    nav.navbar a {
      color: #212529;
    }

    nav.navbar .container-fluid {
      width: 100%;
    }

    nav.navbar .menu-btn {
      margin-right: 20px;
      font-size: 1.2em;
      -webkit-transition: all 0.7s;
      transition: all 0.7s;
    }

    nav.navbar .menu-btn span {
      width: 20px;
      height: 2px;
      background: #212529;
      display: block;
      margin: 4px auto 0;
      -webkit-transition: all 0.3s cubic-bezier(0.81, -0.33, 0.345, 1.375);
      transition: all 0.3s cubic-bezier(0.81, -0.33, 0.345, 1.375);
    }

    nav.navbar .menu-btn span:nth-of-type(2) {
      position: relative;
      width: 35px;
      -webkit-transform: rotateY(180deg);
      transform: rotateY(180deg);
    }

    nav.navbar .menu-btn span:nth-of-type(2)::before, nav.navbar .menu-btn span:nth-of-type(2)::after {
      content: '';
      width: 6px;
      height: 2px;
      display: block;
      background: #212529;
      -webkit-transform: rotate(45deg);
      transform: rotate(45deg);
      position: absolute;
      top: 2px;
      left: 0;
      -webkit-transition: all 0.7s;
      transition: all 0.7s;
    }

    nav.navbar .menu-btn span:nth-of-type(2)::after {
      -webkit-transform: rotate(145deg);
      transform: rotate(145deg);
      position: absolute;
      top: -2px;
      left: 0;
    }

    nav.navbar .menu-btn.active span:first-of-type {
      -webkit-transform: translateY(12px);
      transform: translateY(12px);
    }

    nav.navbar .menu-btn.active span:nth-of-type(2) {
      -webkit-transform: none;
      transform: none;
    }

    nav.navbar .menu-btn.active span:last-of-type {
      -webkit-transform: translateY(-12px);
      transform: translateY(-12px);
    }

    nav.navbar .nav-link {
      position: relative;
    }

    nav.navbar .nav-link span.badge-corner {
      position: absolute;
      top: 0;
      right: 0;
      font-weight: 400;
      font-size: 0.7em;
    }

    nav.navbar .nav-link.language span {
      margin-left: .3rem;
      vertical-align: middle;
    }

    nav.navbar .nav-link.logout i {
      margin-left: 10px;
    }

    nav.navbar .nav-menu {
      margin-bottom: 0;
    }

    nav.navbar .search-box {
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      right: 0;
      padding: 0;
      background: #fff;
      z-index: 12;
      border-radius: 0;
      display: none;
    }

    nav.navbar .search-box .dismiss {
      position: absolute;
      top: 50%;
      right: 20px;
      -webkit-transform: translateY(-50%);
      transform: translateY(-50%);
      background: none;
      border: none;
      cursor: pointer;
      font-size: 1.5em;
      color: #999;
    }

    nav.navbar .search-box form {
      height: 100%;
    }

    nav.navbar .search-box form input {
      height: 100%;
      border: none;
      padding: 20px;
    }

    nav.navbar .dropdown-toggle::after {
      border: none !important;
      content: '\f107';
      vertical-align: baseline;
      font-family: 'FontAwesome';
      margin-left: .3rem;
    }

    nav.navbar .dropdown-menu {
      right: 0;
      min-width: 250px;
      left: auto;
      margin-top: 15px;
      margin-bottom: 0;
      padding: 15px 0;
      max-width: 400px;
      border-radius: 0;
      border: none;
      -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1), -2px 0 2px rgba(0, 0, 0, 0.1);
      box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1), -2px 0 2px rgba(0, 0, 0, 0.1);
    }

    nav.navbar .dropdown-menu .dropdown-item {
      background: #fff;
      padding: 10px 20px;
      font-size: 0.8rem;
      color: #777;
      width: 100%;
    }

    nav.navbar .dropdown-menu .dropdown-item:hover {
      background: #f5f5f5;
    }

    nav.navbar .dropdown-menu .dropdown-item i {
      width: 30px;
      height: 30px;
      line-height: 30px;

      text-align: center;
      color: #fff;
      border-radius: 50%;
      margin-right: 10px;
    }

    nav.navbar .dropdown-menu .dropdown-item small {
      margin-left: 40px;
    }

    nav.navbar .dropdown-menu span {
      position: static;
      font-size: 0.9em;
      color: #999;
    }

    nav.navbar .dropdown-menu strong {
      font-weight: 700;
    }

    nav.navbar .dropdown-menu .msg-profile {
      width: 45px;
      height: 45px;
      margin-right: 10px;
    }

    nav.navbar .dropdown-menu h3 {
      font-weight: 500;
    }

    /* MAIN NAVBAR MEDIAQUERIES ----------------------------------- */
    @media (max-width: 1199px) {
      nav.navbar {
        /*==== Toggle Sidebar Btn ====*/
      }
      nav.navbar .menu-btn {
        margin-right: 20px;
        font-size: 1.2em;
        -webkit-transition: all 0.7s;
        transition: all 0.7s;
      }
      nav.navbar .menu-btn span:first-of-type {
        -webkit-transform: translateY(12px);
        transform: translateY(12px);
      }
      nav.navbar .menu-btn span:nth-of-type(2) {
        -webkit-transform: none;
        transform: none;
      }
      nav.navbar .menu-btn span:nth-of-type(2)::before, nav.navbar .menu-btn span:nth-of-type(2)::after {
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
      }
      nav.navbar .menu-btn span:nth-of-type(2)::after {
        -webkit-transform: rotate(145deg);
        transform: rotate(145deg);
        position: absolute;
        top: -2px;
        left: 0;
      }
      nav.navbar .menu-btn span:last-of-type {
        -webkit-transform: translateY(-12px);
        transform: translateY(-12px);
      }
      nav.navbar .menu-btn.active span:first-of-type {
        -webkit-transform: none;
        transform: none;
      }
      nav.navbar .menu-btn.active span:nth-of-type(2) {
        -webkit-transform: rotateY(180deg);
        transform: rotateY(180deg);
      }
      nav.navbar .menu-btn.active span:last-of-type {
        -webkit-transform: none;
        transform: none;
      }
    }

    @media (max-width: 575px) {
      nav.navbar {
        font-size: 14px;
      }
      nav.navbar .badge {
        width: 19px;
        height: 19px;
      }
      nav.navbar .nav-item > a {
        font-size: 13px;
      }
      nav.navbar .dropdown {
        position: static;
      }
      nav.navbar .dropdown-menu {
        width: 90vw;
        right: 2.5vw;
        left: 2.5vw;
        margin: 0 auto;
      }
    }

    /*
    * ==========================================================
    *     DASHBOARD COUNTS SECTION
    * ==========================================================
    */
    section.dashboard-counts .icon {
      width: 40px;
      height: 40px;
      line-height: 40px;
      text-align: center;
      min-width: 40px;
      max-width: 40px;
      border-radius: 50%;
    }

    section.dashboard-counts .title {
      font-size: 1.1em;
      font-weight: 300;
      color: #777;
      margin: 0 20px;
    }

    section.dashboard-counts .progress {
      margin-top: 10px;
      height: 4px;
    }

    section.dashboard-counts .number {
      font-size: 1.8em;
      font-weight: 300;
    }

    section.dashboard-counts .number strong {
      font-weight: 700;
    }

    section.dashboard-counts .row {
      padding: 30px 15px;
      margin: 0;
    }

    section.dashboard-counts div[class*='col-'] .item {
      border-right: 1px solid #eee;
      padding: 15px 0;
    }

    section.dashboard-counts div[class*='col-']:last-of-type .item {
      border-right: none;
    }

    /*  DASHBOARD COUNTS MEDIAQUERIES ------------------------ */
    @media (max-width: 1199px) {
      section.dashboard-counts div[class*='col-']:nth-of-type(2) .item {
        border-right: none;
      }
    }

    @media (max-width: 575px) {
      section.dashboard-counts div[class*='col-'] .item {
        border-right: none;
      }
    }

    /*
    * ==========================================================
    *     DASHBOARD HEADER SECTION
    * ==========================================================
    */
    .statistic {
      padding: 20px 15px;
      margin-bottom: 15px;
    }

    .statistic:last-of-type {
      margin-bottom: 0;
    }

    .statistic strong {
      font-size: 1.5em;
      color: #333;
      font-weight: 700;
      line-height: 1;
    }

    .statistic small {
      color: #aaa;
      text-transform: uppercase;
    }

    .statistic .icon {
      width: 40px;
      height: 40px;
      line-height: 40px;
      text-align: center;
      min-width: 40px;
      max-width: 40px;
      color: #fff;
      border-radius: 50%;
      margin-right: 15px;
    }

    .chart .title {
      padding: 15px 0 0 15px;
    }

    .chart .title strong {
      font-weight: 700;
      font-size: 1.2em;
    }

    .chart .title small {
      color: #aaa;
      text-transform: uppercase;
    }

    .chart .line-chart {
      width: 100%;
      height: 100%;
      padding: 20px 0;
    }

    .chart .line-chart canvas {
      width: calc(100% - 30px) !important;
    }

    .chart .bar-chart {
      margin-bottom: 15px;
    }

    .chart .bar-chart canvas {
      padding: 15px;
      width: 100%;
      margin: 0;
    }

    /*  DASHBOARD HEADER  MEDIAQUERIES ------------------------*/
    @media (max-width: 991px) {
      section.dashboard-header div[class*='col-'] {
        margin-bottom: 20px;
      }
    }

    /*
    * ==========================================================
    *     PROJECTS SECTION
    * ==========================================================
    */
    .project .row {
      margin: 0;
      padding: 15px 0;
      margin-bottom: 35px;
    }

    .project div[class*='col-'] {
      border-right: 1px solid #eee;
    }

    .project .text h3 {
      margin-bottom: 0;
      color: #555;
    }

    .project .text small {
      color: #aaa;
      font-size: 0.75em;
    }

    .project .project-date span {
      font-size: 0.9em;
      color: #999;
      font-weight: bold;
    }

    .project .image {
      max-width: 50px;
      min-width: 50px;
      height: 50px;
      margin-right: 15px;
    }

    .project .time,
    .project .comments,
    .project .project-progress {
      color: #999;
      font-size: 0.9em;


    }

    .project .time i,
    .project .comments i,
    .project .project-progress i {
      margin-right: 5px;
    }

    .project .project-progress {
      width: 200px;
    }

    .project .project-progress .progress {
      height: 4px;
    }

    .project .card {
      margin-bottom: 0;
    }

    /* PROJECTS SECTION ------------------------------------- */
    @media (max-width: 991px) {
      .project .right-col {
        margin-top: 0px;
        margin-left: 0px;
      }
      .project .project-progress {
        width: 150px;
      }
    }

    @media (max-width: 480px) {
      .project .project-progress {
        display: none;
      }
    }

    /*
    * ==========================================================
    *     CLIENT SECTION
    * ==========================================================
    */
    /*====== Work Amount Box ======*/
    .work-amount .chart {
      margin: 40px auto;
      position: relative;
    }

    .work-amount .chart .text {
      display: inline-block;
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
    }

    .work-amount .chart strong {
      font-size: 1.5rem;
    }

    .work-amount .chart span {
      color: #999;
      font-weight: 300;
    }

    .work-amount li span {
      font-size: 0.85em;
      margin-bottom: 10px;
      color: #777;
      display: block;
    }

    .work-amount li span::before {
      content: '';
      display: inline-block;
      margin-right: 10px;
      width: 7px;
      height: 7px;
      line-height: 7px;
      background: #85b4f2;
      border-radius: 50%;
    }

    /*====== Client Profile Box ======*/
    .client .client-avatar {
      width: 100px;
      height: 100px;
      margin: 0 auto;
      position: relative;
    }

    .client .client-avatar .status {
      content: '';
      display: block;
      width: 18px;
      height: 18px;
      border: 3px solid #fff;
      border-radius: 50%;
      position: absolute;
      right: 4px;
      bottom: 4px;
    }

    .client .client-title {
      margin-top: 20px;
    }

    .client .client-title h3 {
      font-weight: 500;
      color: #555;
    }

    .client .client-title span {
      font-size: 0.9em;
      color: #aaa;
      display: block;
    }

    .client .client-title a {
      padding: 2px 30px;
      border-radius: 40px;
      background: #54e69d;
      color: #fff;
      margin-top: 5px;
      font-size: 0.9em;
      text-decoration: none;
    }

    .client .client-title a:hover {
      background: #85b4f2;
    }

    .client .client-info {
      margin-top: 20px;
    }

    .client .client-info strong {
      font-weight: 700;
    }

    .client .client-social {
      margin-top: 20px;
    }

    .client .client-social a {
      color: #aaa;
    }

    /*====== Total Overdue Box ======*/
    .overdue .chart canvas {
      width: 100% !important;
      z-index: 1;
    }

    .overdue .card {
      margin-bottom: 0;
    }

    .overdue .card-body {
      padding: 20px;
    }

    .overdue .card-body small {
      font-weight: 300;
      color: #aaa;
    }

    .overdue .card-body h3 {
      margin-bottom: 5px;
    }

    .overdue .number {
      font-size: 1.8em;
      font-weight: 400;
      color: #555;
      margin: 35px 0;
    }

    /*
    * ==========================================================
    *     FEEDS SECTION
    * ==========================================================
    */
    /*====== Checklist Box ======*/
    .checklist label {
      font-size: 0.8em;
      color: #999;
      line-height: 1.8em;
      margin-bottom: 0;
    }

    .checklist .item {
      padding: 20px;
    }

    .checklist .item:nth-of-type(even) {
      background: #fafafa;
    }

    /*====== Trending Articles Box ======*/
    .articles a {
      text-decoration: none !important;
      display: block;
      margin-bottom: 0;
      color: #555;
    }

    .articles .badge {
      font-size: 0.7em;
      padding: 5px 10px;
      line-height: 1;
      margin-left: 10px;
    }

    .articles .item {
      padding: 20px;
    }

    .articles .item:nth-of-type(even) {
      background: #fafafa;
    }

    .articles .item .image {
      min-width: 50px;
      max-width: 50px;
      height: 50px;
      margin-right: 15px;
    }

    .articles .item img {
      padding: 3px;
      border: 1px solid #28a745;
    }

    .articles .item h3 {
      color: #555;
      font-weight: 400;
      margin-bottom: 0;
    }

    .articles .item small {
      color: #aaa;
      font-size: 0.75em;
    }

    /*
    * ==========================================================
    *     UPDATES SECTION
    * ==========================================================
    */
    /*====== Recent Updates Box ======*/
    .recent-updates .item {
      padding: 20px;
    }

    .recent-updates .item:nth-of-type(even) {
      background: #fafafa;
    }

    .recent-updates .icon {
      margin-right: 10px;
    }

    .recent-updates h5 {
      margin-bottom: 5px;
      color: #333;
      font-weight: 400;
    }

    .recent-updates p {
      font-size: 0.8em;
      color: #aaa;
      margin-bottom: 0;
    }

    .recent-updates .date {
      font-size: 0.9em;
      color: #adadad;
    }

    .recent-updates .date strong {
      font-size: 1.4em;
      line-height: 0.8em;
      display: block;
    }

    .recent-updates .date span {
      font-size: 0.9em;
      font-weight: 300;
    }

    /*====== Daily Feeds Box ======*/
    .daily-feeds .item {
      padding: 20px;
      border-bottom: 1px solid #eee;
    }

    .daily-feeds .feed-profile {
      max-width: 50px;
      min-width: 50px;
      margin-right: 10px;
    }

    .daily-feeds h5 {
      margin-bottom: 0;
      color: #555;
    }

    .daily-feeds span {
      font-size: 0.8em;
      color: #999;
    }

    .daily-feeds .full-date {
      font-size: 0.85em;
      color: #aaa;
      font-weight: 300;
    }

    .daily-feeds .CTAs {
      margin-top: 5px;
    }

    .daily-feeds .CTAs a {
      font-size: 0.7em;
      padding: 3px 8px;
      margin-right: 5px;
    }

    .daily-feeds .CTAs a i {
      margin-right: 5px;
    }

    .daily-feeds .quote {
      background: #fafafa;
      margin-top: 5px;
      border-radius: 0;
      padding: 15px;
      margin-left: 60px;
    }

    .daily-feeds .quote small {
      font-size: 0.75em;
      color: #777;
    }

    .daily-feeds .date {
      font-size: 0.9em;
      color: #aaa;
    }

    /*====== Recent Activities Box ======*/
    .recent-activities .item {
      padding: 0 15px;
      border-bottom: 1px solid #eee;
    }

    .recent-activities .item div[class*='col-'] {
      padding: 15px;
    }

    .recent-activities h5 {
      font-weight: 400;
      color: #333;
    }

    .recent-activities p {
      font-size: 0.75em;
      color: #999;
    }

    .recent-activities .icon {
      width: 35px;
      height: 35px;
      line-height: 35px;
      background: #f5f5f5;
      text-align: center;
      display: inline-block;
    }

    .recent-activities .date {
      font-size: 0.75em;
      color: #999;
      padding: 10px;
    }

    .recent-activities .date-holder {
      padding: 0 !important;
      border-right: 1px solid #eee;
    }

    /*
    * ==========================================================
    *     FOOTER
    * ==========================================================
    */
    footer.main-footer {
      position: absolute;
      bottom: 0;
      width: 100%;
      background: #2f333e;
      color: #fff;
      padding: 20px 10px;
    }

    footer.main-footer a {
      color: inherit;
    }

    footer.main-footer p {
      margin: 0;
      font-size: 0.8em;
    }

    /* FOOTER MEDIAQUERIES  --------------------------------- */
    @media (max-width: 575px) {
      footer.main-footer div[class*='col'] {
        text-align: center !important;
      }
    }

    /*
    * ==========================================================
    *       UTILITIES
    * ==========================================================
    */
    .bg-cover {
      background-size: cover;
    }

    section.charts div[class*="col-"] {
      margin-bottom: 30px;
    }

    section.charts header {
      padding: 30px 0;
    }

    section.charts div[class*="col-"] {
      margin-bottom: 0;
    }

    /*
    * ==========================================================
    *     LINE CHART
    * ==========================================================
    */
    .line-chart-example .card-block {
      padding: 20px;
    }

    /*
    * ==========================================================
    *     POLAR CHART
    * ==========================================================
    */
    /*
    * ==========================================================
    *     POLAR CHART
    * ==========================================================
    */
    .polar-chart-example canvas {
      max-width: 350px;
      max-height: 350px;
      margin: 20px auto;
    }

    /*
    * ==========================================================
    *     PIE CHART
    * ==========================================================
    */
    .pie-chart-example canvas {
      max-width: 350px;
      max-height: 350px;
      margin: 15px auto;
    }

    /*
    * ==========================================================
    *     RADAR CHART
    * ==========================================================
    */
    .radar-chart-example canvas {
      max-width: 350px;
      max-height: 350px;
      margin: 20px auto;
    }

    /* FORMS MEDIAQUERIES -------------------------- */
    @media (max-width: 991px) {
      section.charts h2 {
        font-size: 1rem;
      }
    }

    /*
    * ==========================================================
    *     FORMS
    * ==========================================================
    */
    .form-control {
      height: calc(2.25rem + 2px);
      border: 1px solid #dee2e6;
      border-radius: 0;
      padding: 0.375rem 0.75rem;
    }

    .form-control::-moz-placeholder {
      font-size: 0.9em;
      font-weight: 300;
      font-family: "Poppins", sans-serif;
      color: #aaa;
    }

    .form-control::-webkit-input-placeholder {
      font-size: 0.9em;
      font-weight: 300;
      font-family: "Poppins", sans-serif;
      color: #aaa;
    }

    .form-control:-ms-input-placeholder {
      font-size: 0.9em;
      font-weight: 300;
      font-family: "Poppins", sans-serif;
      color: #aaa;
    }

    .form-control:focus {
      color: #495057;
      background-color: #fff;
      border-color: #796AEE;
      outline: none;
      -webkit-box-shadow: 0 0 0 0.2rem rgba(121, 106, 238, 0.25);
      box-shadow: 0 0 0 0.2rem rgba(121, 106, 238, 0.25);
    }

    .form-control-sm {
      height: calc(1.8125rem + 2px);
      padding: 0.25rem 0.5rem;
      font-size: 0.875rem;
      line-height: 1.5;
    }

    .form-control-lg {
      height: calc(2.875rem + 2px);
      padding: 0.5rem 1rem;
      font-size: 1.25rem;
      line-height: 1.5;
    }

    textarea.form-control {
      height: auto;
    }

    select.form-control[size], select.form-control[multiple] {
      height: auto;
    }

    select.form-control option {
      color: #999;
    }

    .input-group .dropdown-menu {
      padding: 15px;
      color: #777;
      border-radius: 0;
    }

    .input-group .dropdown-menu a {
      padding: 5px 0;
      color: inherit;
      text-decoration: none;
    }

    .input-group .dropdown-menu a:hover {
      color: #796AEE;
      background: none;
    }

    .input-group-text {
      color: #868e96;
      background: #f8f9fa;
      border-color: #dee2e6;
      border-radius: 0;
    }

    .input-group-text .checkbox-template, .input-group-text .radio-template {
      -webkit-transform: none;
      transform: none;
    }

    .form-control-label {
      font-size: .9rem;
      color: #777;
    }

    button, input[type='submit'] {
      cursor: pointer;
      font-family: inherit;
      font-weight: 300 !important;
    }

    .input-group .dropdown-toggle {
      background: #f5f5f5;
      color: #777;
    }

    .checkbox-template, .radio-template {
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      cursor: pointer;
      position: relative;
    }

    .checkbox-template + label, .radio-template + label {
      margin-left: 10px;
    }

    .checkbox-template::before, .radio-template::before {
      margin-right: 10px;
      content: '';
      display: inline-block;
      -webkit-transform: translate(-2px, -2px);
      transform: translate(-2px, -2px);
      width: 18px;
      height: 18px;
      line-height: 18px;
      text-align: center;
      background: #dae2e7;
      -webkit-transition: all 0.2s;
      transition: all 0.2s;
    }

    .checkbox-template::after, .radio-template::after {
      content: '\f00c';
      width: 12px;
      height: 12px;
      line-height: 12px;
      text-align: center;
      display: block;
      font-family: 'FontAwesome';
      position: absolute;
      top: 1px;
      left: 1px;
      font-size: 0.7em;
      opacity: 0;
      -webkit-transition: all 0.2s;
      transition: all 0.2s;
      color: #fff;
    }

    .checkbox-template:checked::before, .radio-template:checked::before {
      background: #796AEE;
    }

    .checkbox-template:checked::after, .radio-template:checked::after {
      opacity: 1;
    }

    .radio-template::before {
      border-radius: 50%;
      -webkit-transform: translate(-3px, -3px);
      transform: translate(-3px, -3px);
    }

    .radio-template::after {
      width: 6px;
      height: 6px;
      line-height: 6px;
      text-align: center;
      position: absolute;
      top: 3px;
      left: 3px;
      border-radius: 50%;
      content: '';
    }

    .radio-template:checked::after {
      background: #fff;
    }

    input.input-material {
      width: 100%;
      border: none;
      border-bottom: 1px solid #eee;
      padding: 10px 0;
    }

    input.input-material.is-invalid {
      border-color: #dc3545 !important;
    }

    input.input-material:focus {
      border-color: #796AEE;
    }

    input.input-material ~ label {
      color: #aaa;
      position: absolute;
      top: 14px;
      left: 0;
      cursor: text;
      -webkit-transition: all 0.2s;
      transition: all 0.2s;
      font-weight: 300;
    }

    input.input-material ~ label.active {
      font-size: 0.8rem;
      top: -10px;
      color: #796AEE;
    }

    input.input-material.is-invalid ~ label {
      color: #dc3545;
    }

    .form-group-material {
      position: relative;
      margin-bottom: 30px;
    }

    .modal-content {
      border-radius: 0;
    }

    /*
    * ==========================================================
    *     FORM PAGE
    * ==========================================================
    */
    .forms p {
      font-size: 0.9em;
      color: #555;
    }

    .forms form small {
      font-size: 0.8em;
      color: #999;
      font-weight: 300;
    }

    .forms .line {
      width: 100%;
      height: 1px;
      border-bottom: 1px dashed #eee;
      margin: 30px 0;
    }

    /*
    * ==========================================================
    *     LOGIN PAGE
    * ==========================================================
    */
    .login-page {
      position: relative;
    }

    .login-page::before {
      content: '';
      width: 100%;
      height: 100%;
      display: block;
      z-index: -1;
      background: url(../img/imgpurchez21.png);
      background-size: cover;
      -webkit-filter: blur(10px);
      filter: blur(4px);
      z-index: 1;
      position: absolute;
      top: 0;
      right: 0;
    }

    .login-page .container {
      min-height: 100vh;
      z-index: 999;
      padding: 20px;
      position: relative;
      padding-left: 90px;
      padding-right: 90px;
    }

    .login-page .form-holder {
      width: 100%;
      border-radius: 5px;
      overflow: hidden;
      margin-bottom: 50px;
    }

    .login-page .form-holder .info, .login-page .form-holder .form {
      min-height: 40vh;
      padding: 40px;
      height: 100%;
    }

    .login-page .form-holder div[class*='col-'] {
      padding: 0;
    }

    .login-page .form-holder .info {
      background: rgba(0, 191, 243, 0.9);
      color: #fff;
    }

    .login-page .form-holder .info h1 {
      font-size: 2.5em;
      font-weight: 600;
    }

    .login-page .form-holder .info p {
      font-weight: 300;
    }

    .login-page .form-holder .form .form-group {
      position: relative;
      margin-bottom: 12px;
    }
    .form-group{
      margin-bottom: 2rem;
    }
    .login-page .form-holder .form .content {
      width: 100%;
    }

    .login-page .form-holder .form form {
      width: 100%;
      max-width: 400px;
    }

    .login-page .form-holder .form #login, .login-page .form-holder .form #register {
      margin-bottom: 20px;
      cursor: pointer;
    }

    .login-page .form-holder .form a.forgot-pass, .login-page .form-holder .form a.signup {
      font-size: 0.9em;
      color: #85b4f2;
    }

    .login-page .form-holder .form small {
      color: #aaa;
    }

    .login-page .form-holder .form .terms-conditions label {
      cursor: pointer;
      color: #aaa;
      font-size: 0.9em;
    }

    .login-page .copyrights {
      width: 100%;
      z-index: 9999;
      position: absolute;
      bottom: 0;
      left: 0;
      color: #fff;
    }

    @media (max-width: 991px) {
      .login-page .info, .login-page .form {
        min-height: auto !important;
      }
      .login-page .info {
        padding-top: 100px !important;
        padding-bottom: 100px !important;
      }
    }

    /*

    =====================
    STYLE SWITCHER FOR DEMO
    =====================

    */
    #style-switch-button {
      position: fixed;
      top: 120px;
      right: 0px;
      border-radius: 0;
      z-index: 12;
    }

    #style-switch {
      width: 300px;
      padding: 20px;
      position: fixed;
      top: 160px;
      right: 0;
      background: #fff;
      border: solid 1px #ced4da;
      z-index: 12;
    }

    #style-switch h4 {
      color: #495057;
    }

    /* =========================================
       THEMING OF BOOTSTRAP COMPONENTS
       ========================================= */
    /*
     * 1. NAVBAR
     */
    .navbar {
      padding: 0.5rem 1rem;
    }

    .navbar-brand {
      display: inline-block;
      padding-top: 0.3125rem;
      padding-bottom: 0.3125rem;
      margin-right: 1rem;
      font-size: 1.25rem;
    }

    .navbar-toggler {
      padding: 0.25rem 0.75rem;
      font-size: 1.25rem;
      line-height: 1;
      border: 1px solid transparent;
      border-radius: 0.25rem;
    }

    .navbar-light .navbar-brand {
      color: rgba(0, 0, 0, 0.9);
    }

    .navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover {
      color: rgba(0, 0, 0, 0.9);
    }

    .navbar-light .navbar-nav .nav-link {
      color: rgba(0, 0, 0, 0.5);
    }

    .navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
      color: rgba(0, 0, 0, 0.7);
    }

    .navbar-light .navbar-nav .nav-link.disabled {
      color: rgba(0, 0, 0, 0.3);
    }

    .navbar-light .navbar-nav .show > .nav-link,
    .navbar-light .navbar-nav .active > .nav-link,
    .navbar-light .navbar-nav .nav-link.show,
    .navbar-light .navbar-nav .nav-link.active {
      color: rgba(0, 0, 0, 0.9);
    }

    .navbar-light .navbar-toggler {
      color: rgba(0, 0, 0, 0.5);
      border-color: rgba(0, 0, 0, 0.1);
    }

    .navbar-light .navbar-toggler-icon {
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
    }

    .navbar-light .navbar-text {
      color: rgba(0, 0, 0, 0.5);
    }

    .navbar-dark .navbar-brand {
      color: #fff;
    }

    .navbar-dark .navbar-brand:focus, .navbar-dark .navbar-brand:hover {
      color: #fff;
    }

    .navbar-dark .navbar-nav .nav-link {
      color: rgba(255, 255, 255, 0.5);
    }

    .navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
      color: rgba(255, 255, 255, 0.75);
    }

    .navbar-dark .navbar-nav .nav-link.disabled {
      color: rgba(255, 255, 255, 0.25);
    }

    .navbar-dark .navbar-nav .show > .nav-link,
    .navbar-dark .navbar-nav .active > .nav-link,
    .navbar-dark .navbar-nav .nav-link.show,
    .navbar-dark .navbar-nav .nav-link.active {
      color: #fff;
    }

    .navbar-dark .navbar-toggler {
      color: rgba(255, 255, 255, 0.5);
      border-color: rgba(255, 255, 255, 0.1);
    }

    .navbar-dark .navbar-toggler-icon {
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
    }

    .navbar-dark .navbar-text {
      color: rgba(255, 255, 255, 0.5);
    }

    /*
     * 2. BUTTONS
     */
    .btn {
      font-weight: 400;
      border: 1px solid transparent;
      padding: 0.375rem 0.75rem;
      font-size: 1rem;
      line-height: 1.5;
      border-radius: 0.25rem;
      -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
      transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
      transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
      transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
    }

    .btn:focus, .btn.focus {
      outline: 0;
      -webkit-box-shadow: 0 0 0 0.2rem rgba(121, 106, 238, 0.25);
      box-shadow: 0 0 0 0.2rem rgba(121, 106, 238, 0.25);
    }

    .btn.disabled, .btn:disabled {
      opacity: .65;
    }

    .btn:not([disabled]):not(.disabled):active, .btn:not([disabled]):not(.disabled).active {
      background-image: none;
    }

    .btn-primary {
      color: color-yiq(#00C4CC);
      background-color: #00C4CC;
      border-color: #00C4CC;
    }

    .btn-primary:hover {
      color: color-yiq(#01DCE5);
      background-color: #01DCE5;
      border-color: #01DCE5;
    }

    .btn-primary:focus, .btn-primary.focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(11, 239, 255, 0.5) !important;
      box-shadow: 0 0 0 0.2rem rgba(11, 239, 255, 0.5);
      background-color: #01DCE5;
    }

    .btn-primary.disabled, .btn-primary:disabled {
      color: color-yiq(#01DCE5);
      background-color: #01DCE5;
      border-color: #01DCE5;
    }

    .btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
    .show > .btn-primary.dropdown-toggle {
      color: color-yiq(#01DCE5);
      background-color: #01DCE5;
      border-color: #01DCE5;
    }

    .btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus,
    .show > .btn-primary.dropdown-toggle:focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(11, 239, 255, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(11, 239, 255, 0.5);
    }

    .btn-secondary {
      color: color-yiq(#868e96);
      background-color: #868e96;
      border-color: #868e96;
    }

    .btn-secondary:hover {
      color: color-yiq(#727b84);
      background-color: #727b84;
      border-color: #6c757d;
    }

    .btn-secondary:focus, .btn-secondary.focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5);
    }

    .btn-secondary.disabled, .btn-secondary:disabled {
      color: color-yiq(#868e96);
      background-color: #868e96;
      border-color: #868e96;
    }

    .btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active,
    .show > .btn-secondary.dropdown-toggle {
      color: color-yiq(#6c757d);
      background-color: #6c757d;
      border-color: #666e76;
    }

    .btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus,
    .show > .btn-secondary.dropdown-toggle:focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5);
    }

    .btn-success {
      color: color-yiq(#28a745);
      background-color: #28a745;
      border-color: #28a745;
    }

    .btn-success:hover {
      color: color-yiq(#218838);
      background-color: #218838;
      border-color: #1e7e34;
    }

    .btn-success:focus, .btn-success.focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
    }

    .btn-success.disabled, .btn-success:disabled {
      color: color-yiq(#28a745);
      background-color: #28a745;
      border-color: #28a745;
    }

    .btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active,
    .show > .btn-success.dropdown-toggle {
      color: color-yiq(#1e7e34);
      background-color: #1e7e34;
      border-color: #1c7430;
    }

    .btn-success:not(:disabled):not(.disabled):active:focus, .btn-success:not(:disabled):not(.disabled).active:focus,
    .show > .btn-success.dropdown-toggle:focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
    }

    .btn-info {
      color: color-yiq(#17a2b8);
      background-color: #17a2b8;
      border-color: #17a2b8;
    }

    .btn-info:hover {
      color: color-yiq(#138496);
      background-color: #138496;
      border-color: #117a8b;
    }

    .btn-info:focus, .btn-info.focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
    }

    .btn-info.disabled, .btn-info:disabled {
      color: color-yiq(#17a2b8);
      background-color: #17a2b8;
      border-color: #17a2b8;
    }

    .btn-info:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled).active,
    .show > .btn-info.dropdown-toggle {
      color: color-yiq(#117a8b);
      background-color: #117a8b;
      border-color: #10707f;
    }

    .btn-info:not(:disabled):not(.disabled):active:focus, .btn-info:not(:disabled):not(.disabled).active:focus,
    .show > .btn-info.dropdown-toggle:focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
    }

    .btn-warning {
      color: color-yiq(#ffc107);
      background-color: #ffc107;
      border-color: #ffc107;
    }

    .btn-warning:hover {
      color: color-yiq(#e0a800);
      background-color: #e0a800;
      border-color: #d39e00;
    }

    .btn-warning:focus, .btn-warning.focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
    }

    .btn-warning.disabled, .btn-warning:disabled {
      color: color-yiq(#ffc107);
      background-color: #ffc107;
      border-color: #ffc107;
    }

    .btn-warning:not(:disabled):not(.disabled):active, .btn-warning:not(:disabled):not(.disabled).active,
    .show > .btn-warning.dropdown-toggle {
      color: color-yiq(#d39e00);
      background-color: #d39e00;
      border-color: #c69500;
    }

    .btn-warning:not(:disabled):not(.disabled):active:focus, .btn-warning:not(:disabled):not(.disabled).active:focus,
    .show > .btn-warning.dropdown-toggle:focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
    }

    .btn-danger {
      color: color-yiq(#dc3545);
      background-color: #dc3545;
      border-color: #dc3545;
    }

    .btn-danger:hover {
      color: color-yiq(#c82333);
      background-color: #c82333;
      border-color: #bd2130;
    }

    .btn-danger:focus, .btn-danger.focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
    }

    .btn-danger.disabled, .btn-danger:disabled {
      color: color-yiq(#dc3545);
      background-color: #dc3545;
      border-color: #dc3545;
    }

    .btn-danger:not(:disabled):not(.disabled):active, .btn-danger:not(:disabled):not(.disabled).active,
    .show > .btn-danger.dropdown-toggle {
      color: color-yiq(#bd2130);
      background-color: #bd2130;
      border-color: #b21f2d;
    }

    .btn-danger:not(:disabled):not(.disabled):active:focus, .btn-danger:not(:disabled):not(.disabled).active:focus,
    .show > .btn-danger.dropdown-toggle:focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
    }

    .btn-light {
      color: color-yiq(#f8f9fa);
      background-color: #f8f9fa;
      border-color: #f8f9fa;
    }

    .btn-light:hover {
      color: color-yiq(#e2e6ea);
      background-color: #e2e6ea;
      border-color: #dae0e5;
    }

    .btn-light:focus, .btn-light.focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
    }

    .btn-light.disabled, .btn-light:disabled {
      color: color-yiq(#f8f9fa);
      background-color: #f8f9fa;
      border-color: #f8f9fa;
    }

    .btn-light:not(:disabled):not(.disabled):active, .btn-light:not(:disabled):not(.disabled).active,
    .show > .btn-light.dropdown-toggle {
      color: color-yiq(#dae0e5);
      background-color: #dae0e5;
      border-color: #d3d9df;
    }

    .btn-light:not(:disabled):not(.disabled):active:focus, .btn-light:not(:disabled):not(.disabled).active:focus,
    .show > .btn-light.dropdown-toggle:focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
    }

    .btn-dark {
      color: color-yiq(#343a40);
      background-color: #343a40;
      border-color: #343a40;
    }

    .btn-dark:hover {
      color: color-yiq(#23272b);
      background-color: #23272b;
      border-color: #1d2124;
    }

    .btn-dark:focus, .btn-dark.focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
    }

    .btn-dark.disabled, .btn-dark:disabled {
      color: color-yiq(#343a40);
      background-color: #343a40;
      border-color: #343a40;
    }

    .btn-dark:not(:disabled):not(.disabled):active, .btn-dark:not(:disabled):not(.disabled).active,
    .show > .btn-dark.dropdown-toggle {
      color: color-yiq(#1d2124);
      background-color: #1d2124;
      border-color: #171a1d;
    }

    .btn-dark:not(:disabled):not(.disabled):active:focus, .btn-dark:not(:disabled):not(.disabled).active:focus,
    .show > .btn-dark.dropdown-toggle:focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
    }

    .btn-default {
      color: color-yiq(#ced4da);
      background-color: #ced4da;
      border-color: #ced4da;
    }

    .btn-default:hover {
      color: color-yiq(#b8c1ca);
      background-color: #b8c1ca;
      border-color: #b1bbc4;
    }

    .btn-default:focus, .btn-default.focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5);
    }

    .btn-default.disabled, .btn-default:disabled {
      color: color-yiq(#ced4da);
      background-color: #ced4da;
      border-color: #ced4da;
    }

    .btn-default:not(:disabled):not(.disabled):active, .btn-default:not(:disabled):not(.disabled).active,
    .show > .btn-default.dropdown-toggle {
      color: color-yiq(#b1bbc4);
      background-color: #b1bbc4;
      border-color: #aab4bf;
    }

    .btn-default:not(:disabled):not(.disabled):active:focus, .btn-default:not(:disabled):not(.disabled).active:focus,
    .show > .btn-default.dropdown-toggle:focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5);
    }

    .btn-outline-primary {
      color: #796AEE;
      background-color: transparent;
      background-image: none;
      border-color: #796AEE;
    }

    .btn-outline-primary:hover {
      color: #fff;
      background-color: #796AEE;
      border-color: #796AEE;
    }

    .btn-outline-primary:focus, .btn-outline-primary.focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(121, 106, 238, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(121, 106, 238, 0.5);
    }

    .btn-outline-primary.disabled, .btn-outline-primary:disabled {
      color: #796AEE;
      background-color: transparent;
    }

    .btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active,
    .show > .btn-outline-primary.dropdown-toggle {
      color: color-yiq(#796AEE);
      background-color: #796AEE;
      border-color: #796AEE;
    }

    .btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus,
    .show > .btn-outline-primary.dropdown-toggle:focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(121, 106, 238, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(121, 106, 238, 0.5);
    }

    .btn-outline-secondary {
      color: #868e96;
      background-color: transparent;
      background-image: none;
      border-color: #868e96;
    }

    .btn-outline-secondary:hover {
      color: #fff;
      background-color: #868e96;
      border-color: #868e96;
    }

    .btn-outline-secondary:focus, .btn-outline-secondary.focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5);
    }

    .btn-outline-secondary.disabled, .btn-outline-secondary:disabled {
      color: #868e96;
      background-color: transparent;
    }

    .btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active,
    .show > .btn-outline-secondary.dropdown-toggle {
      color: color-yiq(#868e96);
      background-color: #868e96;
      border-color: #868e96;
    }

    .btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .btn-outline-secondary:not(:disabled):not(.disabled).active:focus,
    .show > .btn-outline-secondary.dropdown-toggle:focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5);
    }

    .btn-outline-success {
      color: #28a745;
      background-color: transparent;
      background-image: none;
      border-color: #28a745;
    }

    .btn-outline-success:hover {
      color: #fff;
      background-color: #28a745;
      border-color: #28a745;
    }

    .btn-outline-success:focus, .btn-outline-success.focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
    }

    .btn-outline-success.disabled, .btn-outline-success:disabled {
      color: #28a745;
      background-color: transparent;
    }

    .btn-outline-success:not(:disabled):not(.disabled):active, .btn-outline-success:not(:disabled):not(.disabled).active,
    .show > .btn-outline-success.dropdown-toggle {
      color: color-yiq(#28a745);
      background-color: #28a745;
      border-color: #28a745;
    }

    .btn-outline-success:not(:disabled):not(.disabled):active:focus, .btn-outline-success:not(:disabled):not(.disabled).active:focus,
    .show > .btn-outline-success.dropdown-toggle:focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
    }

    .btn-outline-info {
      color: #17a2b8;
      background-color: transparent;
      background-image: none;
      border-color: #17a2b8;
    }

    .btn-outline-info:hover {
      color: #fff;
      background-color: #17a2b8;
      border-color: #17a2b8;
    }

    .btn-outline-info:focus, .btn-outline-info.focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
    }

    .btn-outline-info.disabled, .btn-outline-info:disabled {
      color: #17a2b8;
      background-color: transparent;
    }

    .btn-outline-info:not(:disabled):not(.disabled):active, .btn-outline-info:not(:disabled):not(.disabled).active,
    .show > .btn-outline-info.dropdown-toggle {
      color: color-yiq(#17a2b8);
      background-color: #17a2b8;
      border-color: #17a2b8;
    }

    .btn-outline-info:not(:disabled):not(.disabled):active:focus, .btn-outline-info:not(:disabled):not(.disabled).active:focus,
    .show > .btn-outline-info.dropdown-toggle:focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
    }

    .btn-outline-warning {
      color: #ffc107;
      background-color: transparent;
      background-image: none;
      border-color: #ffc107;
    }

    .btn-outline-warning:hover {
      color: #fff;
      background-color: #ffc107;
      border-color: #ffc107;
    }

    .btn-outline-warning:focus, .btn-outline-warning.focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
    }

    .btn-outline-warning.disabled, .btn-outline-warning:disabled {
      color: #ffc107;
      background-color: transparent;
    }

    .btn-outline-warning:not(:disabled):not(.disabled):active, .btn-outline-warning:not(:disabled):not(.disabled).active,
    .show > .btn-outline-warning.dropdown-toggle {
      color: color-yiq(#ffc107);
      background-color: #ffc107;
      border-color: #ffc107;
    }

    .btn-outline-warning:not(:disabled):not(.disabled):active:focus, .btn-outline-warning:not(:disabled):not(.disabled).active:focus,
    .show > .btn-outline-warning.dropdown-toggle:focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
    }

    .btn-outline-danger {
      color: #dc3545;
      background-color: transparent;
      background-image: none;
      border-color: #dc3545;
    }

    .btn-outline-danger:hover {
      color: #fff;
      background-color: #dc3545;
      border-color: #dc3545;
    }

    .btn-outline-danger:focus, .btn-outline-danger.focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
    }

    .btn-outline-danger.disabled, .btn-outline-danger:disabled {
      color: #dc3545;
      background-color: transparent;
    }

    .btn-outline-danger:not(:disabled):not(.disabled):active, .btn-outline-danger:not(:disabled):not(.disabled).active,
    .show > .btn-outline-danger.dropdown-toggle {
      color: color-yiq(#dc3545);
      background-color: #dc3545;
      border-color: #dc3545;
    }

    .btn-outline-danger:not(:disabled):not(.disabled):active:focus, .btn-outline-danger:not(:disabled):not(.disabled).active:focus,
    .show > .btn-outline-danger.dropdown-toggle:focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
    }

    .btn-outline-light {
      color: #f8f9fa;
      background-color: transparent;
      background-image: none;
      border-color: #f8f9fa;
    }

    .btn-outline-light:hover {
      color: #fff;
      background-color: #f8f9fa;
      border-color: #f8f9fa;
    }

    .btn-outline-light:focus, .btn-outline-light.focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
    }

    .btn-outline-light.disabled, .btn-outline-light:disabled {
      color: #f8f9fa;
      background-color: transparent;
    }

    .btn-outline-light:not(:disabled):not(.disabled):active, .btn-outline-light:not(:disabled):not(.disabled).active,
    .show > .btn-outline-light.dropdown-toggle {
      color: color-yiq(#f8f9fa);
      background-color: #f8f9fa;
      border-color: #f8f9fa;
    }

    .btn-outline-light:not(:disabled):not(.disabled):active:focus, .btn-outline-light:not(:disabled):not(.disabled).active:focus,
    .show > .btn-outline-light.dropdown-toggle:focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
    }

    .btn-outline-dark {
      color: #343a40;
      background-color: transparent;
      background-image: none;
      border-color: #343a40;
    }

    .btn-outline-dark:hover {
      color: #fff;
      background-color: #343a40;
      border-color: #343a40;
    }

    .btn-outline-dark:focus, .btn-outline-dark.focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
    }

    .btn-outline-dark.disabled, .btn-outline-dark:disabled {
      color: #343a40;
      background-color: transparent;
    }

    .btn-outline-dark:not(:disabled):not(.disabled):active, .btn-outline-dark:not(:disabled):not(.disabled).active,
    .show > .btn-outline-dark.dropdown-toggle {
      color: color-yiq(#343a40);
      background-color: #343a40;
      border-color: #343a40;
    }

    .btn-outline-dark:not(:disabled):not(.disabled):active:focus, .btn-outline-dark:not(:disabled):not(.disabled).active:focus,
    .show > .btn-outline-dark.dropdown-toggle:focus {
      -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
    }

    .btn-lg {
      padding: 0.5rem 1rem;
      font-size: 1.25rem;
      line-height: 1.5;
      border-radius: 0.3rem;
    }

    .btn-sm {
      padding: 0.25rem 0.5rem;
      font-size: 0.875rem;
      line-height: 1.5;
      border-radius: 0.2rem;
    }

    /*
     * 3. TYPE
     */
    body {
      font-family: "Poppins", sans-serif;
      font-size: 1rem;
      font-weight: 400;
      line-height: 1.5;
      color: #212529;
      background-color: #fff;
    }

    a {
      color: #00C4CC;
      text-decoration: none;
    }

    a:focus, a:hover {
      /* color: #3b25e6; */
      /* text-decoration: underline; */
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    .h1,
    .h2,
    .h3,
    .h4,
    .h5,
    .h6 {
      margin-bottom: 0.5rem;
      font-family: inherit;
      font-weight: 700;
      line-height: 1.1;
      color: inherit;
    }

    h1,
    .h1 {
      font-size: 1.5rem;
    }

    h2,
    .h2 {
      font-size: 1.3rem;
    }

    h3,
    .h3 {
      font-size: 1.2rem;
    }

    h4,
    .h4 {
      font-size: 14px;
    }

    h5,
    .h5 {
      font-size: 1rem;
    }

    h6,
    .h6 {
      font-size: 0.95rem;
    }

    .lead {
      font-size: 1.25rem;
      font-weight: 300;
    }

    .display-1 {
      font-size: 6rem;
      font-weight: 300;
      line-height: 1.1;
    }

    .display-2 {
      font-size: 5.5rem;
      font-weight: 300;
      line-height: 1.1;
    }

    .display-3 {
      font-size: 4.5rem;
      font-weight: 300;
      line-height: 1.1;
    }

    .display-4 {
      font-size: 3.5rem;
      font-weight: 300;
      line-height: 1.1;
    }

    hr {
      border-top: 1px solid rgba(0, 0, 0, 0.1);
    }

    small,
    .small {
      font-size: 70%;
      font-weight: 400;
    }

    mark,
    .mark {
      padding: 0.2em;
      background-color: #fcf8e3;
    }

    .blockquote {
      padding: 0.5rem 1rem;
      margin-bottom: 2rem;
      font-size: 1.25rem;
      border-left: 5px solid #796AEE;
    }

    .blockquote-footer {
      color: #868e96;
    }

    .blockquote-footer::before {
      content: "\2014 \00A0";
    }

    .text-primary {
      color: #796AEE !important;
    }

    a.text-primary:focus, a.text-primary:hover {
      color: #503ce9 !important;
    }

    /*
     * 4. PAGINATION
     */
    .page-item:first-child .page-link {
      border-top-left-radius: 0.25rem;
      border-bottom-left-radius: 0.25rem;
    }

    .page-item:last-child .page-link {
      border-top-right-radius: 0.25rem;
      border-bottom-right-radius: 0.25rem;
    }

    .page-item.active .page-link {
      color: #fff;
      background-color: #796AEE;
      border-color: #796AEE;
    }

    .page-item.disabled .page-link {
      color: #868e96;
      background-color: #fff;
      border-color: #ddd;
    }

    .page-link {
      padding: 0.5rem 0.75rem;
      margin-left: -1px;
      line-height: 1.25;
      color: #796AEE;
      background-color: #fff;
      border: 1px solid #ddd;
    }

    .page-link:hover {
      z-index: 2;
      color: #3b25e6;
      background-color: #e9ecef;
      border-color: #ddd;
    }

    .page-link:focus {
      z-index: 2;
      outline: 0;
      -webkit-box-shadow: none;
      box-shadow: none;
      text-decoration: none;
    }

    .pagination-lg .page-link {
      padding: 0.75rem 1.5rem;
      font-size: 1.25rem;
      line-height: 1.5;
    }

    .pagination-lg .page-item:first-child .page-link {
      border-top-left-radius: 0.3rem;
      border-bottom-left-radius: 0.3rem;
    }

    .pagination-lg .page-item:last-child .page-link {
      border-top-right-radius: 0.3rem;
      border-bottom-right-radius: 0.3rem;
    }

    .pagination-sm .page-link {
      padding: 0.25rem 0.5rem;
      font-size: 0.875rem;
      line-height: 1.5;
    }

    .pagination-sm .page-item:first-child .page-link {
      border-top-left-radius: 0.2rem;
      border-bottom-left-radius: 0.2rem;
    }

    .pagination-sm .page-item:last-child .page-link {
      border-top-right-radius: 0.2rem;
      border-bottom-right-radius: 0.2rem;
    }

    /*
    * 5. UTILITIES
    */
    .bg-primary {
      background-color: #796AEE !important;
    }

    a.bg-primary:focus, a.bg-primary:hover {
      background-color: #503ce9 !important;
    }

    .bg-secondary {
      background-color: #868e96 !important;
    }

    a.bg-secondary:focus, a.bg-secondary:hover {
      background-color: #6c757d !important;
    }

    .bg-success {
      background-color: #28a745 !important;
    }

    a.bg-success:focus, a.bg-success:hover {
      background-color: #1e7e34 !important;
    }

    .bg-info {
      background-color: #17a2b8 !important;
    }

    a.bg-info:focus, a.bg-info:hover {
      background-color: #117a8b !important;
    }

    .bg-warning {
      background-color: #ffc107 !important;
    }

    a.bg-warning:focus, a.bg-warning:hover {
      background-color: #d39e00 !important;
    }

    .bg-danger {
      background-color: #dc3545 !important;
    }

    a.bg-danger:focus, a.bg-danger:hover {
      background-color: #bd2130 !important;
    }

    .bg-light {
      background-color: #f8f9fa !important;
    }

    a.bg-light:focus, a.bg-light:hover {
      background-color: #dae0e5 !important;
    }

    .bg-dark {
      background-color: #343a40 !important;
    }

    a.bg-dark:focus, a.bg-dark:hover {
      background-color: #1d2124 !important;
    }

    .border-primary {
      border-color: #796AEE !important;
    }

    .border-secondary {
      border-color: #868e96 !important;
    }

    .border-success {
      border-color: #28a745 !important;
    }

    .border-info {
      border-color: #17a2b8 !important;
    }

    .border-warning {
      border-color: #ffc107 !important;
    }

    .border-danger {
      border-color: #dc3545 !important;
    }

    .border-light {
      border-color: #f8f9fa !important;
    }

    .border-dark {
      border-color: #343a40 !important;
    }

    .text-primary {
      color: #796AEE !important;
    }

    a.text-primary:focus, a.text-primary:hover {
      color: #503ce9 !important;
    }

    .text-secondary {
      color: #868e96 !important;
    }

    a.text-secondary:focus, a.text-secondary:hover {
      color: #6c757d !important;
    }

    .text-success {
      color: #28a745 !important;
    }

    a.text-success:focus, a.text-success:hover {
      color: #1e7e34 !important;
    }

    .text-info {
      color: #17a2b8 !important;
    }

    a.text-info:focus, a.text-info:hover {
      color: #117a8b !important;
    }

    .text-warning {
      color: #ffc107 !important;
    }

    a.text-warning:focus, a.text-warning:hover {
      color: #d39e00 !important;
    }

    .text-danger {
      color: #dc3545 !important;
    }

    a.text-danger:focus, a.text-danger:hover {
      color: #bd2130 !important;
    }

    .text-light {
      color: #f8f9fa !important;
    }

    a.text-light:focus, a.text-light:hover {
      color: #dae0e5 !important;
    }

    .text-dark {
      color: #343a40 !important;
    }

    a.text-dark:focus, a.text-dark:hover {
      color: #1d2124 !important;
    }

    .badge-primary {
      color: color-yiq(#796AEE);
      background-color: #796AEE;
    }

    .badge-primary[href]:focus, .badge-primary[href]:hover {
      color: color-yiq(#796AEE);
      text-decoration: none;
      background-color: #503ce9;
    }

    .badge-secondary {
      color: color-yiq(#868e96);
      background-color: #868e96;
    }

    .badge-secondary[href]:focus, .badge-secondary[href]:hover {
      color: color-yiq(#868e96);
      text-decoration: none;
      background-color: #6c757d;
    }

    .badge-success {
      color: color-yiq(#28a745);
      background-color: #28a745;
    }

    .badge-success[href]:focus, .badge-success[href]:hover {
      color: color-yiq(#28a745);
      text-decoration: none;
      background-color: #1e7e34;
    }

    .badge-info {
      color: color-yiq(#17a2b8);
      background-color: #17a2b8;
    }

    .badge-info[href]:focus, .badge-info[href]:hover {
      color: color-yiq(#17a2b8);
      text-decoration: none;
      background-color: #117a8b;
    }

    .badge-warning {
      color: color-yiq(#ffc107);
      background-color: #ffc107;
    }

    .badge-warning[href]:focus, .badge-warning[href]:hover {
      color: color-yiq(#ffc107);
      text-decoration: none;
      background-color: #d39e00;
    }

    .badge-danger {
      color: color-yiq(#dc3545);
      background-color: #dc3545;
    }

    .badge-danger[href]:focus, .badge-danger[href]:hover {
      color: color-yiq(#dc3545);
      text-decoration: none;
      background-color: #bd2130;
    }

    .badge-light {
      color: color-yiq(#f8f9fa);
      background-color: #f8f9fa;
    }

    .badge-light[href]:focus, .badge-light[href]:hover {
      color: color-yiq(#f8f9fa);
      text-decoration: none;
      background-color: #dae0e5;
    }

    .badge-dark {
      color: color-yiq(#343a40);
      background-color: #343a40;
    }

    .badge-dark[href]:focus, .badge-dark[href]:hover {
      color: color-yiq(#343a40);
      text-decoration: none;
      background-color: #1d2124;
    }

    /*
    * 6.CODE
    */
    code {
      padding: 0.2rem 0.4rem;
      font-size: 90%;
      color: #bd4147;
      background-color: #f8f9fa;
      border-radius: 0.25rem;
    }

    a > code {
      padding: 0;
      color: inherit;
      background-color: inherit;
    }

    /*
    * 7. NAV
    */
    .nav-link {
      padding: 0.8rem 1rem;
    }

    .nav-link.disabled {
      color: #868e96;
    }

    .nav-tabs .nav-item {
      margin-bottom: -1px;
    }

    .nav-tabs .nav-link {
      border: 1px solid transparent;
      border-top-left-radius: 0.25rem;
      border-top-right-radius: 0.25rem;
    }

    .nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
      border-color: #e9ecef #e9ecef #dee2e6;
    }

    .nav-tabs .nav-link.disabled {
      color: #868e96;
    }

    .nav-tabs .nav-link.active,
    .nav-tabs .nav-item.show .nav-link {
      color: #495057;
      background-color: #fff;
    }

    .nav-tabs .dropdown-menu {
      margin-top: -1px;
    }

    .nav-pills .nav-link {
      border-radius: 0.25rem;
    }

    .nav-pills .nav-link.active,
    .nav-pills .show > .nav-link {
      color: #fff;
      background-color: #796AEE;
    }

    /*
    * 8. CARD
    */
    .card {
      background-color: #fff;
      border: 0 solid #eee;
      border-radius: 0;
    }

    .card > .list-group:first-child .list-group-item:first-child {
      border-top-left-radius: 0;
      border-top-right-radius: 0;
    }

    .card > .list-group:last-child .list-group-item:last-child {
      border-bottom-right-radius: 0;
      border-bottom-left-radius: 0;
    }

    .card-body {
      padding: 1.25rem;
    }

    .card-title {
      margin-bottom: 1rem;
    }

    .card-subtitle {
      margin-top: -0.5rem;
    }

    .card-link + .card-link {
      margin-left: 1.25rem;
    }

    .card-header {
      padding: 1rem 1.25rem;
      background-color: #fff;
      border-bottom: 1px solid #eee;
    }

    .card-header:first-child {
      border-radius: 0 0 0 0;
    }

    .card-header-transparent {
      background-color: rgba(0, 0, 0, 0.3);
      border-bottom: none;
    }

    .card-footer {
      padding: 1rem 1.25rem;
      background-color: #f8f9fa;
      border-top: 1px solid #eee;
    }

    .card-footer:last-child {
      border-radius: 0 0 0 0;
    }

    .card-header-tabs {
      margin-right: -0.625rem;
      margin-bottom: -1rem;
      margin-left: -0.625rem;
      border-bottom: 0;
    }

    .card-header-pills {
      margin-right: -0.625rem;
      margin-left: -0.625rem;
    }

    .card-img-overlay {
      padding: 1.25rem;
    }

    .card-img-overlay-opacity {
      background: rgba(0, 0, 0, 0.2);
    }

    .card-img {
      border-radius: 0;
    }

    .card-img-top {
      border-top-left-radius: 0;
      border-top-right-radius: 0;
    }

    .card-img-bottom {
      border-bottom-right-radius: 0;
      border-bottom-left-radius: 0;
    }

    .card-deck .card {
      margin-bottom: 15px;
    }

    @media (min-width: 576px) {
      .card-deck {
        margin-right: -15px;
        margin-left: -15px;
      }
      .card-deck .card {
        margin-right: 15px;
        margin-left: 15px;
      }
    }

    .custom-select {
      height: calc(2.25rem + 2px);
      padding: 0.375rem 1.75rem 0.375rem 0.75rem;
      line-height: 1.5;
      color: #495057;
      vertical-align: middle;
      background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat right 0.75rem center;
      background-size: 8px 10px;
      border: 1px solid #ced4da;
      border-radius: 0;
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
    }

    .custom-select:focus {
      border-color: #796AEE;
      outline: 0;
      -webkit-box-shadow: 0 0 0 0.2rem rgba(121, 106, 238, 0.5);
      box-shadow: 0 0 0 0.2rem rgba(121, 106, 238, 0.5);
    }

    .custom-select:focus::-ms-value {
      color: #495057;
      background-color: #fff;
    }

    .custom-select[multiple], .custom-select[size]:not([size="1"]) {
      height: auto;
      padding-right: 0.75rem;
      background-image: none;
    }

    .custom-select:disabled {
      color: #868e96;
      background-color: #e9ecef;
    }

    .custom-select::-ms-expand {
      opacity: 0;
    }

    .custom-select-sm {
      height: calc(1.8125rem + 2px);
      padding-top: 0.375rem;
      padding-bottom: 0.375rem;
      font-size: 75%;
    }

    .custom-select-lg {
      height: calc(2.875rem + 2px);
      padding-top: 0.375rem;
      padding-bottom: 0.375rem;
      font-size: 125%;
    }
    .re_step_2 {
        display: none;
    }
    form#registerCustomer label.error, form#addProduct label.error , form#main_add_order label.error, form#editProduct label.error,form#userupdate label.error, form#addpurchaser label.error, form#addproduct label.error,label#product_name-error,label#product_code-error,label#price_per_item-error,label#unit_measure-error,label#company_name-error,label#phone-error,label#email-error,label#location_name-error,label#signin_email-error,label#login-password-error,label#phone_number-error,label#abn-error,label#login-passwordconf-error,label#password-error,label#name-error,label#group_name-error,label#fileInput-error {
        font-size: 13px;
        color: red;
    }
    .back_btn a {
        color: #11bae9;
    }
    .re_step_2 label.btn.custom-input-btn {
        display: block;
        text-align: left;
        padding: 0;
    }
    .productModel button#ordersave i {
        display: none;
    }
    button#next_login, button#nextforget {
        margin-bottom: 20px;
    }
    input#companyemail.emailexists{
      border-color: red;
    }
    .generic_loader {
        display: none;
        position: fixed;
        width: 100%;
        height: 100%;
        background: rgba(0,0,0,0.3);
        z-index: 9999;
    }
    .generic_loader i {
        position: fixed;
        left: 50%;
        color: #fff;
        font-size: 40px;
        top: 50%;
    }
    .generic_overflow{
        overflow: hidden;
        position: relative;
    }
    span.select2.select2-container.select2-container--default.select2-container--below {
        width: 100% !important;
        display: block !important;
        max-width: 100% !important;
    }
    span.select2.select2-container.select2-container--default.select2-container--below span.selection {
        width: 100% !important;
    }
    span.select2.select2-container.select2-container--default {
        width: 100% !important;
        display: block !important;
        max-width: 100%;
    }
    span.select2.select2-container.select2-container--default span.selection {
        width: 100%;
    }
    .prposed_order .project span.per_item_style
    {

      background: #f3eeee;
      padding: 1px 10px;

    }
    .prposed_order{
      padding-top: 10px;
    }
    .like{
      width: 300px;
      float: left;
      margin: 0 15px;
    }
    .email_validation_ul {
      display:  block;
      list-style-type: none;
      background-color: #fff;
      border-radius: 0 0 5px 5px;
      border: 1px solid #add8e6;
      border-top: none;
      max-height: 180px;
      margin: 0;
      overflow-y: scroll;
      overflow-x: hidden;
      padding: 0;
    }
    .email_validation_li {
      padding: 7px 9px;
      border-bottom: 1px solid #e1e1e1;
      cursor: pointer;
      color: #6e6e6e;
    }
    .float-left .edit_show  {

      color: #000000;font-size: 15px;
      background-color:#68a968;
      padding: 2px 15px;
      border-radius: 50px;
      margin-top: 5px;
      text-align: center;
    }
    .pg_samplefile{
      margin-top: 10px;
    }

    .float-left .delete_order  {

      color: #000000;font-size: 15px;
      background-color:#d86363;
      padding: 2px 15px;
      border-radius: 50px;
      margin-top: 5px;
      text-align: center;
    }
    .svg_os{
      position: relative;
      top: 3px;
      right: -4px;
    }
    .float-left .delete_orderos  {

      color: #000000;font-size: 15px;
      background-color:#d86363;
      padding: 9px 15px;
      border-radius: 50px;
      margin-top: 5px;
      color: white;
      text-align: center;
    }
    .float-left .delete_order i {
      color: #fff;
    }
    .float-left .delete_order span {
      margin-left: 4px;
      color: #fff;
    }
    .float-left .delete_order_log  {

      color: #000000;font-size: 15px;
      background-color:red;
      padding: 2px 15px;
      border-radius: 50px;
      margin-top: 5px;
      text-align: center;
    }
    .check_width_status .parentdiv_dropdown{
      min-width: 265px;
    }

    .delete_order_log a {
      color:#ffffff;
      display:block;
    }

    .edit_show a {
      color:#ffffff;
      display:block;
    }
    .radio_check .unit{
      margin-top: 5px;
      margin-left: 230px;

    }
    .radio_check .lot{
      margin-top: 5px;


    }
    .up {
      width: 1px;
      height: 0px;
      border-bottom: 10px solid black;
      border-left: 7px solid transparent;
      border-right: 7px solid transparent;
      border-top: none;
      margin-left:1px;
      margin-top: 8px;
      cursor: pointer;
    }
    .mid {
    margin-left:7px;
      width: 2px;
      height: 0px;
      background-color:white;
      margin-left:1px;

    }
    .down{
      width: 1px;
      height: 0px;
      border-top: 10px solid black;
      border-left: 7px solid transparent;
      border-right: 7px solid transparent;
      border-bottom: none;
      margin-left:1px;
      margin-top: 5px;
      cursor: pointer;
    }
    .order_Detail_calculationscata{
      width: unset !important;
    }
    .order_Detail_calculations{
      width: 620px;
    }
    .order_Detail_calculations .right_quantity_changer {
      display: inline-block;
      vertical-align: middle;
    }
    .order_Detail_calculations .right_quantity_changer .up{
        margin-top: 0px;
    }
    .order_Detail_calculations .up{
      margin-top: 0px;
    }
    .spntotal
    {


      font-size: larger;
      font-weight: bold;
    }
    .reopen_order{

      margin-top: -60px;
    }
    .main_span{
      font-size: larger;
    }
    .project .dropdown {
      position: relative;
      display: inline-block;
      width: 100%;
      text-align: center;
    }
    .project .dropdown-content {
      display: none;
      position: absolute;
      background-color: #f1f1f1;
      min-width: 160px;
      overflow: auto;
      box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
      z-index: 1;

    }

    .project .dropdown-content a {
      color: black;
      padding: 12px 16px;
      text-decoration: none;
      display: block;
    }

    .project .dropdown a:hover {
      background-color: #ddd
    }

    .show {
      display: block;
    }

    .project .float-left.check_width_status {
      width: 100%;
      text-align: center;
    }
    .project .status_Pending.change_status{
      width: 70%;
      text-align: center;
      font-size: 12px;
    }
    .required_red {
      font-size:20px;
      color:red;
    }
    .existing_product_btn{
      float: right;
    }
    .gst_price{

    }
    .price_exgst_small{
      width: 16%;
        float: left;
    }
    .price_exgst_small p{
      margin: 0;
      height: 20px;
    }
    .header_buttonss{
    text-align: right;
    }
    .order_detail_eta{
      color: #aaa;

    }
    .view_all_order {
      width: auto;
      /* padding: 5px 0px 5px; */
      position: absolute;
      bottom: -42px;
    }
    .view_all_order_a{
      background: #b4dadc;
      color: #000;
      padding: 3px 15px;
      font-size: 14px;
    }
    .view_all_order_ee{
      background: #b4dadc;
      color: #000;
      border-radius: 3px;
      padding: 6px 13px;
      font-size: 14px;
      margin-left: 15px;
      margin-top: 5px;
    }
    .order_delivered{
      display: block;
    }

    .project.projects_main_page a.right_away_order {
      position: absolute;
      top: -16px;
      right: 0;
      background: #f1d37a;
      color: #000;
      padding: 3px 14px;
      font-size: 13px;
    }
    .project.projects_main_page {
      position: relative;
    }
    a.btn.btn-primary.insert_products {
      color: white;
    }
    a.btn.btn-primary.add_group_products {
    color: white;
    }
    .newcddsd{
      display: none !important;
    }
    .screen_hide{
      display: none;
    }
    .screen_hidee{
      display: none;
    }
    .mobile_prices{
      display: none;
    }
    .mbl_ifram_icons11{
      display: none;
    }
    .pur-nac_name{
      color: black;
      font-weight: bolder;
      position: absolute;
      left: 59px;
      top: 24px;
      font-size: 13px;
      line-height: 30px;
    }
    .oc_label{
      color: black;
      margin-bottom: 21px;
      margin-left: -8px;
      font-size: 10px;
    }
    .maxstck_label{
      color: black !important;
      font-weight: initial ;
    }
    .modal_head_ordernow{
      color: black;
        font-weight: 900;
        font-size: 24px;
    }
    .modal_body_ordernow
    {
        color: black;
        font-size: 20px;
    }
    .order_more_btn{
      position: absolute;
      top: 139px;
      left: 219px;
    }
    .slide_down_scrn{
      margin-left: 9px;
    }
    .right_quantity_changer_sc1{
      margin-top: 0px;
      margin-right: 7px;
      margin-left: 0px;
      background-color: #ddd;
      height: 33px;
      width: 23px;
    }
    .right_quantity_changer_sc{
      margin-top: 0px;
      margin-left: 0px;
      background-color: #ddd;
      height: 33px;
      width: 23px;
    }
    .pencil_pur{
      color: white;
      padding: 6px;
      font-size: 20px;
      margin-left: 5px;
    }
    .pchanger_sc{
      cursor: pointer;
      margin-top: 0px;
      margin-left: 0px;
      background-color: #01DCE5;
      height: 33px;
      width: 40px;
    }
    .margin_count_btn
    {
      margin-bottom: 50px !important;
    }
    .arrow_btn_sc{
      margin-top: -5px;
      cursor: pointer;
    }
    .stock_label{
      color: black !important;
      margin-left: 15px;
      font-size: 14px !important;
    }
    .ys_arrow{
      margin-left: 15px;
      margin-right: 10px;
      font-weight: bold;
    }
    .row_stock_btn{
      margin-bottom: -15px !important;
    }
    .toogle_main_row{
      margin-bottom: 0px !important;
    }
    .btn_suggest
    {
      font-size: 13px;
      margin-left: 10px;
    }
    .max_stock_lbl{
      margin-left: 5px;
    }
    .handstock_src{
      width: 140px;
      height: 33px;

    }
    .handstock_src_sug{
      width: 60px;
      height: 33px;

    }
    .up1{
      margin-top: 4px !important;
      margin-left: 4px !important;
    }
    .down1{
      margin-left: 4px !important;
    }

    .export_order{
      position: absolute;
      top: 136px;
      left: 227px;
      color: white !important;
    }
    .export_btn{
      margin-right: 10px;
      margin-left: 5px;
    }
    .frm_reopen{
      display: inline;
    }
    .mbl_project_pur{
      padding-bottom: 25px;
    }
    .select2-selection__clear{
      display: none;
    }
    .active_sms{
      font-size: 14px;
      position: absolute;
      top: 3px;
      right: 8px;
      color: blue;
    }
    .sms_statusr{
      font-size: 12px;
      color: #FF4D4F;
      font-weight: 500;
      margin-right: 4px;
    }
    .sms_status{
      font-size: 12px;
      color: #68A968;
      font-weight: 500;
      margin-right: 4px;
    }
    .cursor_point{
      cursor: pointer;
    }
    .cursor_pointblack{
      cursor: pointer;
      color: black !important;
    }
    .mail_icn{
    font-size: 16px;
    }
    .phn_icn{
      font-size: 16px;
    }
    .label_mails{
      color:black;
      margin-left:5px;
      margin-bottom: 0px;
      cursor: pointer;
    }
    .social_icons_purchezrz{
      right: 0px !important;
      top: -6px;
    }
    .social_icons_purchez {
      /* display: flex; */
      right: 230px;
      text-align: left;
      margin-top: 3px;
      position: absolute;
    }
    .btn-circle_edit_purr {
      width: 30px;
      height: 30px;
      text-align: center;
      padding: 2px 0;
      font-size: 17px;
      line-height: 1.428571429;
      border-radius: 22px;
      border: none;
      background-color: #01DCE5;
    }
    .phone_div{
      margin-top: 3px;
      padding-right: 5px;
    }
    .social_icon_style{
      height: 35px;
      width: 35px;
      position: relative;
      top: 2px;

    }
    .mail_div{
    padding-right: 5px;
    }
    .sms_status_os{
      font-size: 13px;
        vertical-align: middle;
        display: inline-block;
        color: #99cc89;
        margin-left: 35px;
        position: relative;
        margin-top: 0px;
    }
    .sms_status_osun{
        color: red;
    }
    .sms_status_os::after {
      content: '';
      position: absolute;
      width: 12px;
      height: 2px;
      background: #000;
      left: -23px;
      top: 5px;
    }
    .os_mrgin_btnss{
      margin-top: -9px;
    }
    .os_mrgin_btnssss{
      margin-top: 4px;
    }
    .os_home_mrgin{
      margin-top: -2px !important;
    }
    .os_home_image{
      max-width: 60px !important;
      max-height: 60px !important;
      height: 60px !important;

    }
    .os_home_image_new{
      height: 60px !important;
    }
    .price_per_os_page{
      padding-left: 5px;
      font-size: 12px;
    }
    .pencl_od{
      background: #00c4cc;
      padding: 4px 10px;
      margin-left: 0px;
      color: white;
      cursor: pointer;

    }
    .div_updqated_crd {
      padding-top: 31px;
      background: #048114;
      position: absolute;
      width: 100%;
      top: -31px;
    }
    .div_updqated_crd::after {
        position: absolute;
        content: "";
        width: 8px;
        height: 31px;
        left: -8px;
        top: 0;
        background: #048114;
    }
    .div_updqated_crd::before {
        position: absolute;
        content: "";
        width: 0;
        height: 0;
        border-top: 10px solid #048114;
        border-left: 8px solid transparent;
        left: -8px;
    }
    .updated_spn{
      position: absolute;
      top: 3px;
      right: 15px;
      color: white;
    }
    .mdl_footer_cus{
      border-top: unset;
    }
    .col_wh_pur{
      color: white;
    }
    .padding_th{
      padding-top: 10px;
    }
    .margin_toh{
      margin-top: 7px;
    }
    .view_commentbtn{
      margin-top: 5px;
    }
    .submit_catabtnmbl{
      right: 200px;
      position: absolute;
    }
    .social_icon_stylecta{
      height: 50px;
      width: 50px;
      position: relative;
      top: -3px;
      right: -122px;
    }
    @media only screen and (max-width: 768px){
      .oc_label {
        position: absolute;
        left: 67px;
        top: 10px;
        line-height: 17px;
        max-width: 30%;
    }
      .ciocudfhm{
        margin-top:0px !important;
        font-size:13px;
        padding-bottom: 20px;
        }
      .frm_seass {
        width: 95%;
        margin-top: 13px;
        display: inline-block;
        margin-left: 15px;
    }
      .btn_formcataman{
        margin-left: 14px;
        margin-top: 13px;
      }
      .clseachead_mbl{
        font-size: 16px !important;
        display: block;
        position: absolute;
        top: 6px;
        right: 46px;
        color: #898282;
      }
      .mbl_searchclear{
        position: absolute;
        margin-left: 14px;
        top: 16px !important;
        font-size: 16px;
        text-decoration: underline;
        display: none;
        right: 72px;
        color: #898282;
      }
      .screencata_btnsub{
        padding-right: 14px !important;
        padding-bottom: 0 !important;
      }
      .checkboxessmbl{
        transform: scale(1.4);
        margin-right: 5px;
      }
      .checkboxessmblall{
        transform: scale(1.4);
      }
      .social_icon_stylecta{
        height: 55px;
        width: 55px;
        position: relative;
        top: -3px;
        right: -11px;
      }
      .submit_catabtnmbl{
        right: 37px;
        top: 7px;
      }
      .logo_cata .rounded-circle{
        width: 50px !important;
        margin-left: 23px ;
      }
      .logo_catambln{
        margin-left: 6px !important;
      }
      .submit_catabtnmblll{
        position: unset !important;
        margin-left: 14px;
        margin-top: -80px;
      }
     .export_btncusnav {
      font-size: 10px !important;
      margin-top: 4px;
      }
      .bulkmbl_fnt{
        font-size: 10px !important;
        padding: 5px 6px !important;
      }
      .submit_catabtn{
        right: 36px !important;
        top: 9px !important;
      }
      .name_cate_pro{
        margin-left: -32px !important;
      }
      .cataheadmbl_clas{
        display: contents;
      }
      .btn_search_iccatambl{
        top: -15px !important;
        right: 0px !important;
      }
      .frm_sea_catacatambl{
        width: 100% !important;
        margin-left: 14px !important;
        margin-right: 14px !important;
      }
      .check_all_checknav{
      padding-left: 15px !important;
      }
      .export_btncusnav {
        margin-right: 22px !important;
      }
      .btn_search_icnav {
        position: absolute;
        top: -15px;
        right: 0px;
        border-radius: 0;
        font-size: 18px;
        padding: 8px 13px;
    }
      .firscuswid{
        width: 50% !important;
       }
      .seccuswid{
        width: 50% !important;
        margin-top: 7px;
        margin-bottom: 8px;
      }
      .check_all_check{
        margin-top: 0px !important;
        padding-left: 18px !important;
        font-size: 30px;
        margin-bottom: 0px !important;
      }
      .searchorderprmbl{
        width: 100%;
      }
      .frm_seapurcoagembl{
        width: 90%;
        float: left;
        margin-right: 28px;
        position: relative;
        margin-top: 9px;
        margin-left: 14px;
        margin-right: 14px;
        margin-right: 50px;

      }
      .btn_search_icmbl{
        position: absolute;
        top: -15px;
        right: 0px;
        border-radius: 0;
        font-size: 18px;
        padding: 8px 13px;
      }
      span.action_needed::before {
        width: 30px,!important;
        height: 36px !important;
    }
      table.dataTable>tbody>tr.child span.dtr-title {
        font-size: 12px;
    }
      .width_icon_tdnew{
        width: 15% !important;
        margin-top: 6px;
      }

      span.width_icon_td {
        width: 50% !important;
        margin-top: 6px;
    }

      .chaticbadge{
        bottom: 40px !important;
        left: 55px !important;
        right: unset !important;
      }
      .view_commentbtn{
        margin-top: 10px;
      }
      .btn_chaticonid{
        bottom: 11px !important;
      }
      .chat_head_md {
        width: 296px !important;
    }
      .txtarea_mblsp{
        font-size: 11px;

      }
      .spe_ins_dv{
        white-space: nowrap;
      }
      .spe_ins_chk{
        position: relative;
        top: 1px;
        height: 10px;
        width: 10px;
      }
      .spe_ins_lbl{
        font-size: 10px;
      }
      .fnt_sze_mb{
        font-size: 10px !important;
      }
      .re_orders_of_ordermbl{
        line-height:1.8;
      }
      .txtquan
      {
        width: 31%;
      }
      .change_quantity {
        width: 31%;
    }
      .pur_mbl_em{
        margin-top: 10px;
      }
      .disp_os_mbbl{
        display: block;
      }
      .mr_mbl_def{
        margin: 14px;
      }
      .mbl_gl{
        display: grid;
      }
      .mbl_blng{
        display: block;
      }
      .test_acc_batch {
        top: 4px !important;
        display: table-cell !important;
    }
      .sms_status_os {
        display:block !important;
        padding-top: 2px;
        margin-left: 0px;
    }
    .sms_status_os::after {
      content: unset;
    }
      .zero_account{
        top: 125px !important;
      }
      .btn_form {
        width: unset;
    }
    .btn_formss {
      width: 100%;
  }
    .btnslist {
      width: 100%;
      float: left;
      margin-top: 7px;
      margin-left: 15px;
    }
    .add_new_ind{
      width: 45%;
      white-space: nowrap;
      float: left;
      font-size: 11px;
      text-align: center;
    }
    .add_new_indImport{
      float: left;
      font-size: 11px;
      text-align: center;
      width: 25%;
    }
    .add_new_indExport{
      font-size: 11px;
        float: left;
        text-align: center;
        width: 20%;
    }
    .btn_search_ic {
      position: absolute;
      top: 36px;
      right: 4px;
      border-radius: 0;
      font-size: 18px;
      padding: 8px 13px;
    }
    .btn_search_icss {
      position: absolute;
      top: -1px;
      right: 0px;
      border-radius: 0;
      font-size: 18px;
      padding: 8px 13px;
    }
    .frm_sea {
      width: 95%;
      margin-top: 13px;
      display: inline-block;
      margin-left: 15px;
    }

      .pro_div_pur {
        margin-left: 0px;
        }

      .div_updqated_crd::after {
        height: 28px;
      }
      .modal_wid_mnl{
        width: 100% !important;
        margin: 0;
      }
      .class_padding_m{
        padding: 0px 10px;
      }
      .price_per_os_page {
        display: block;
    }
      .div_updqated_crd{
        padding-top: 28px;
        background: #048114;
        position: relative;
        top: 0px !important;
      }
      .div_updqated_crdorg{
        padding-top: 28px;
        background: #00c4cc;
        position: relative !important;
        top: 0px !important;
      }
      .div_updqated_crdgree{
        padding-top: 28px;
        background: #00c4cc;
        position: relative !important;
        top: 0px !important;
      }
      .pos_rel
      {
        position: relative;
      }
      .pencil_icon_mbl{
        padding: 6px 9px !important;
      }
      .action_needed{
        background: #00c4cc;
        padding: 9px 40px 9px;
        position: absolute;
        right: 2px;
        top: -52px;
        color: white;
        margin-top: 20px;
        font-size: 12px;
      }
      .newacnedded {
        right: 18px !important;
        top: 65px !important;
    }
    .newacneddednew{
      right: 21px !important;
      top: 126px !important;

    }
      .mbl_head_home{
        font-size: 14px;
      }
      .os_home_mrgin{
        padding: 8px 0px !important;
      }
      .mbl_accnt_num{
        color: white;
        font-size: 12px;
        white-space: nowrap;
      }
      .order_logo{
        width: 50px;
      }
      .created_pur{
        top: 14px !important;
      }
    .account_pur{
      top: 25px !important;
    }
      .mbl_sup_logo{
        width: 50px !important;
      }
      .social_icons_purchez {
        position: absolute;
        right: 0;
        text-align: left;
        margin-top: 3px;
        top: 60px;
      }
      .abzhrhmzbib{
        position: absolute !important;
        right: -9px !important;
        top: 8px !important;
      }
      .more_pros_more_pros{
        margin-top: 0px;
      }
      .prposed_order{
        padding-top: 0px;
      }
      .pur-nac_name {
        top: 21px ;
    }
      .mail_div_mblll{
        position: absolute;
        right: -17px;
        top: -23px;
      }
      .mbl_ttockcount{
        margin-left: 57px;
      }
      .calculate_mbl{
        padding: 6px 50px;
      }
      .mail_div {
        padding-right: 0px;
    }
      .social_icon_style{
        width: 37px;
        height: 50px;
      }
      nav.navbar {
        margin-left: 13px !important;
        padding-bottom: 0 !important;
      }
      .pur-nac_name {
        bottom: 22px;
    }
      .mail_div{
        position: absolute;
        right: 30px;
        top: -23px;
      }
      .btn-circle_edit_purr {
        width: 45px;
        height: 45px;
        text-align: center;
        padding: 8px 0;
        font-size: 20px;
        line-height: 1.428571429;
        border-radius: 22px;
        border: none;
        background-color: #01DCE5;
      }
      .phone_div{
        position: absolute;
        top: -26px;
        right: -20px;
      }
      .os_mrgin_btnss{
        margin-top: -9px;
      }
      .os_mrgin_btnssss{
        margin-top: 4px;
      }
      .os_home_mrgin{
        margin-top: -2px !important;
      }
      .os_home_image{
        max-width: 60px !important;
        max-height: 60px !important;
        height: 60px !important;

      }
      .os_home_image_new{
        height: 60px !important;
      }
      .price_per_os_page{
        padding-left: 5px;
        font-size: 12px;
      }
      .pencl_od{
        background: #00c4cc;
        padding: 4px 10px;
        margin-left: 0px;
        color: white;
        cursor: pointer;

      }
      .div_updqated_crd {
        padding-top: 31px;
        background: #048114;
        position: absolute;
        /* left: 67px; */
        top: 10px;
        line-height: 17px;
      }
      .div_updqated_crd::after {
          position: absolute;
          content: "";
          width: 8px;
          height: 31px;
          left: -8px;
          top: 0;
          background: #048114;
      }
      .div_updqated_crd::before {
          position: absolute;
          content: "";
          width: 0;
          height: 0;
          border-top: 10px solid #048114;
          border-left: 8px solid transparent;
          left: -8px;
      }
      .updated_spn{
        position: absolute;
        /* left: 59px; */
        top: 4px;
        /* font-size: 10px; */
        right: 15px;
        }
      .status_Pending1os{
        font-size: 10px;
      }
      .icons_delete_editos{
        position: unset;
        padding: 8px 0px;
      }
      .os_log_create{
        right: 14px;
        padding: 6px;
      }
      .breadcrumb {
          width: 170px;
      }
      .purchaser_img_cls{
        margin-top:-16px;
      }
      .modal_body_ordernow
    {
        color: black;
        font-size: 19px;
    }
    .mobile_pbtns{
      padding: 0px 14px !important;
    }
      .row-mbl-stock_n{
        display: block;
        overflow: hidden;
        width: 100%;
        padding: 0px 20px;
      }
      .export_btn{
        margin-right: 5px;
        margin-left: 0px;
      }
      .col_confrim{
        width: 65%;
        text-align: left;
        float: left;
      }
      .angle_down_btn{
        margin: -4px;
      }

      .stock_confirm{
        white-space: nowrap;
        font-size: 12px !important;
      }
      .stock_confirm_y{
        font-size: 14px !important;

      }
      .stock_confirm_div
      {
        float: left;
        width: 5%;
        margin: 0px;
        position: absolute;
        right: 10px;
      }
      .stock_confirm_div1
      {
        float: left;
        width: 5%;
        margin: 0px;
        position: absolute;
        right: 30px;
      }
      .row-mbl-stock{
        margin-bottom: -5px !important;
        padding-bottom: 12px;
      }
      .srock-btn-mbl{
        text-align: center;
      }
      .buttons_submit-mbl.submited_cancel {
        right: -59px;
    }
    .pur_unit_mes{
      text-align: center;
      padding-top: 5px;
    }

      .mbl_nowrp_order{
        white-space: nowrap;
      }
      .add_new_indExport{
        font-size: 11px;
          float: left;
          text-align: center;
          width: 20%;
      }
      .btn_search_ic {
        position: absolute;
        top: 36px;
        right: 4px;
        border-radius: 0;
        font-size: 18px;
        padding: 8px 13px;
      }
      .btn_search_icss {
        position: absolute;
        top: -1px;
        right: 0px;
        border-radius: 0;
        font-size: 18px;
        padding: 8px 13px;
      }
      .frm_sea {
        width: 95%;
        margin-top: 13px;
        display: inline-block;
        margin-left: 15px;
      }

        .pro_div_pur {
          margin-left: 0px;
          }

        .div_updqated_crd::after {
          height: 28px;
        }
        .div_updqated_crdorg::after {
          height: 28px;
        }
        .div_updqated_crdgree::after {
          height: 28px;
        }
        .modal_wid_mnl{
          width: 100% !important;
          margin: 0;
        }
        .class_padding_m{
          padding: 0px 10px;
        }
        .price_per_os_page {
          display: block;
      }
        .div_updqated_crd{
          padding-top: 28px;
          background: #048114;
          position: relative;
          top: 0px !important;
        }
        .div_updqated_crdorg{
          padding-top: 28px;
          background: #00c4cc;
          position: relative !important;
          top: 0px !important;
        }
        .div_updqated_crdgree{
          padding-top: 28px;
          background: #00c4cc;
          position: relative !important;
          top: 0px !important;
        }
        .pos_rel
        {
          position: relative;
        }
        .pencil_icon_mbl{
          padding: 6px 9px !important;
        }
        .action_needed{
          background: #00c4cc;
          padding: 9px 40px 9px;
          position: absolute;
          right: 2px;
          top: -52px;
          color: white;
          margin-top: 20px;
          font-size: 12px;
        }
        .newacnedded {
          right: 18px !important;
          top: 65px !important;
      }
      .newacneddednew{
        right: 21px !important;
        top: 126px !important;

      }
      .spntotal11 {
        font-size: small !important;
        /* color: #b3abab; */
        font-weight: 500;
        margin-top: 4px;
      }
      .mbl_slash{
        font-size: 15px;
        font-weight: bold;
      }
      .price_mbl{
        font-size: 12px;
        /* color: #b3abab; */
        font-weight: 500;
        padding-bottom: 5px;
      }
      .mbl_ifram_icons11{
        display: block;
      }
      .project .row {
        margin: 0;
        padding: 15px 0;
        margin-bottom: 25px;
        padding-bottom: 0px;

      }
      .quantity_mbl_sc{
        height: 32px;
        border-radius: 3px !important;

      }
      .quantity_lbl{
        margin-left: -13px
      }


      .order_detail_txtquan
      {
        width: 24%;
        position: absolute;
        top: 60px;
        right: 108px;
      }
      .order_detail_txtquan_s{
        width: 40%;

      }
      .mbl_ifram_icons{
        white-space: pre-line;
      }
      .quan_mbl_pro{
        top: 63px;
        position: absolute;
      }
      .mbl_minus{
        color: #00C4CC;
        position: absolute;
        right: 179px;
        top: 60px;
      }
      .mbl_plus{
        position: absolute;
        top: 60px;
        right: 80px;
        color: #00C4CC;
      }
      .mbl_disp{
        display: block;
      }
    .mbl_hide{
      display: none;
    }
    .del_btn_mbl{
      margin-right: -6px;
    }
    .cancel-butn-mbl{
      position: absolute;
        right: 74px;
    }
    .reopen_order {
      margin-top: -27px;
    }
    .screen_hide{
      display: block;
    }
    .screen_hidee{
      display: initial;
    }
    .newcddsd{
      display: block !important;
    }
    .buttons_submit-mbl
    {
      position: absolute;
      top: 161px;
      right: 35px;
    }

      .view_all_order_ee {
        margin-top: 15px !important;
        margin-bottom: 13px;
    }
      .dropdown-content {
        display: none;
        position: absolute !important;
        background-color: #f6f6f6 !important;
        min-width: 230px !important;
        overflow: auto !important;
        border: 1px solid #ddd !important;
        z-index: 1 !important;
        right: -6px !important;
        width: 300px !important;
        height: 300px !important;
        top: 56px !important;
    }
      .dropdown.filter-dropdown {
        position: relative !important;
        display: unset !important;
      }
      .breadcrumb li {
          font-size: 11px;
          margin-left: 4px !important;
          padding-left: 0 !important;
      }
      .order_id_small{
        font-size: 19px;
      }
      .mbl_descr{
        overflow: auto;
        width: 70%;
      }
      .order_id_show{
        margin-top: 30px;
        padding-left: 29px;
        margin-bottom: 0px;
        font-size: 19px;
        font-weight: 600;
      }

      .re_orders_of_order{
        font-size: 12px;
        display: block;
      }
      .project.projects_main_page a.right_away_order {
        position: absolute;
        top: -13px;
        right: 0;
        background: #f1d37a;
        color: #000;
        padding: 3px 14px;
        font-size: 9px;
    }
    .project .status_Pending.change_status {
      width: 60%;
      text-align: center;
      font-size: 12px;
      margin-right: 23px;
    }
    .cross_mbl{
      position: absolute;
      top: 0;
      right: 4px;
    }
    .proname_mbl{
      color: black;
      font-size: 16px;
    }
    .mbbl-price{
      margin-left: -15px;
    }
    .mrgin_lft_mbl{
      margin-left: 10px;
    }

    .mobile_prices1{

      overflow: hidden;
      font-size: 0px !important;
      font-weight: 100;
      display: block;
      margin-top: 20px;
      display: block;
      width: 100%;
      text-align: center;
      padding: 0px 15px;
    }
    .mbl_pric_dv:first-child{
      width: 30%;
      white-space: nowrap;
      float: left;
      text-align: center;
      background: #dedcdc;
      position: relative;
      padding-top: 5px;
    }
    .mbl_pric_dv:nth-child(2) {
        width: calc(28% - 5px);
        white-space: nowrap;
        float: left;
        text-align: center;
        position: relative;
        background: #dedcdc;
        margin-left: 5px;
        padding-top: 5px;
    }
    .mbl_pric_dv:nth-child(3) {
        width: calc( 42% - 5px );
        white-space: nowrap;
        float: left;
        /* text-align: left; */
        position: relative;
        background: #dedcdc;
        margin-left: 5px;
        padding-top: 5px;
    }




    .per_item_style{
      color: black;
      background: unset !important;
      position: absolute;
      right: 2px;
      top: 0px;
    }
    .plus_btn_mb {
        color: #fff;
        font-size: 17px;
        padding: 9px 9px;
    }

    .fa_min_plus span {
        background: #00c4cc;
        height: 32px;
    }
    .unit_measure_price label {
        font-size: 15px;
        font-weight: 500;
        padding-top: 15px;
    }

    }
    .dropbtn {
      background-color: #00C4CC;
      color: white;
      padding: 7px;
      font-size: 16px;
      border: none;
      cursor: pointer;
    }

    .dropbtn:hover, .dropbtn:focus {
      background-color: #00C4CC;
    }

    #myInput {
      box-sizing: border-box;
      background-image: url('searchicon.png');
      background-position: 14px 12px;
      background-repeat: no-repeat;
      font-size: 16px;
      padding: 14px 20px 12px 45px;
      border: none;
      border-bottom: 1px solid #ddd;
    }

    #myInput:focus {outline: 3px solid #ddd;}

    .dropdown.filter-dropdown {
      position: relative;
      display: inline-block;
    }

    .dropdown-content {
      display: none;
      position: absolute;
      background-color: #f6f6f6;
      overflow: auto;
      border: 1px solid #ddd;
      z-index: 1;
      min-width: 208px;
      max-width: 208px;
      border-bottom-left-radius: 7px;
      border-bottom-right-radius: 7px;
      background: white;
      box-shadow: 2px 2px 2px rgb(0 0 0 / 10%), -1px 0 2px rgb(0 0 0 / 5%);
  }

    .dropdown-content a {
      color: black;
      padding: 12px 16px;
      text-decoration: none;
      display: block;
    }

    /* .dropdown a:hover {background-color: #ddd;} */

    .show {display: block;}
    .select_pur_drpd{
      margin-right: 171px;
      margin-top: 6px;
      font-weight: 600;
      font-size: 13px
    }
    .checkbox_draft{
      position: absolute;
      left: 3px;
      margin-top: 7px;
    }
    .lbl_pur1{
      font-size: 14px;
      margin-right: 50px;
    }
    .lbl_pur2{
      font-size: 14px;
      margin-right: 63px;
    }
    .lbl_pur3{
      font-size: 14px;
      position: absolute;
      left: 23px;
      top: 168px;
    }
    .lbl_pur4{
      font-size: 14px;
      position: absolute;
      left: 23px;
      top: 192px;
    }
    .lbl_pur5{
      font-size: 14px;
      position: absolute;
      left: 23px;
      top: 217px;
    }
    .apply_filter{
      position: absolute;
      top: 240px;
    }
    .filter_select{
      max-width: 273px;
      margin-left: 9px;
    }
    .all_orders_pur{
      position:absolute;
    }
    .main_grp_pur
    {
      margin-top: 50px;
    }
    .all-order-frm{
      font-size: 27px;
      font-weight: bold;
    }
    .count-btn{
      margin-top: -40px;
    }
    .stock_lable{
      margin-right: 10px;
      margin-top: 4px;
    }
    .stock_lable1{
      margin-left: 15px;
    }
    .row_main_home{
      padding: unset !important;
      margin-bottom: unset !important;
      padding-top: 7px !important;
    }
    .sep_btn_lbl{
      width: 25% !important;
    }
    .sep_btn_lblos{
      width: 33.33% !important;
    }
    .row.row_main_home span {
      font-size: 10px;
      display: inline-block;
    }
    .row_main_home_new{
      padding-top: 0px !important;
    }
    .row_main_home_mew{
      padding-top: 4px !important;
    }
    .select2-container, .select2-dropdown, .select2-search, .select2-results {
      -webkit-transition: none !important;
      -moz-transition: none !important;
      -ms-transition: none !important;
      -o-transition: none !important;
      transition: none !important;
      }





    @media only screen and (max-width: 500px){
      .mbl_export{
        width: 20%;
      }

      .order_id_show {
        margin-top: 25px;
        padding-left: 16px;
        font-size: 15px;
      }
      .order_id_small {
        font-size: 15px;
      }
      .buttons_submit-mbl {
        position: absolute;
        top: 140px;
        right: 17px;
      }
      .projects.p_plist {
        margin-top: 15px !important;
      }

    }

    @media only screen and (max-width: 400px){
      .mbl_pric_dv::before{
        display: none;
      }
    }
    @media (min-width: 1024px) and (max-width: 1024px){
      .agn_newdivadd{
        margin-top: 7px;
        margin-right: 22px !important;
      }
    }
    @media (min-width: 768px) and (max-width: 768px){
      .p_plist{
        margin: 0 !important;
      }
      .stock_confirm_y{
        margin-left: -14px !important;
      }
      .unit_measure_price{
        margin-left: 130px;
        margin-top: 10px;
      }
      .stock_confirm_div{
        /* top: 19px; */
      }
      .quantity_lbl{
        margin-left: 23px;
        /* margin-top: 21px; */
      }
      .fa_min_plus{
        /* margin-top: 21px; */
      }
      .frm_seapurcoagembl{
        margin-left: 29px;
        margin-right: 35px;
        width: 93%;
      }

      .more_pros_more_pros {
        margin-top: 0px !important;
    }
    .buttons_submit-mbl {
        top: 133px !important;
    }
    .export_btn {
      margin-right: 3px;
      margin-left: 15px;
    }
    .ipad_upper{
      position: relative;
      padding: 50px 0px !important;
    }
    .ipad_pro{
      position: absolute !important;
      top: 11px !important;
    }
    .ipad_des{
      position: relative !important;
    }
    .ipad_des_abs{
      position: relative !important;
      top: 56px !important;
      left: 116px !important;
    }
    .per_item_style {
      right: -400px;
    }
    .ipad_confirm {
      position: absolute;
      right: -290px;
    }
    .mobile_prices2 {
      padding: 0px 30px;
    }
    .pos_ipd{
      position: relative;
      top: -16px;
    }
    .ipad_padding{
      padding: 36px 0 !important;
    }
    .img_ipad_res{
      margin-top: -74px;
    }
    }
    .select2-container .select2-selection--single {
      height: 38px !important;
    }
    .select2-container--default .select2-selection--single {
        border: 1px solid #dee2e6 !important;
        border-radius: 0px !important;
    }
    .select2-container--default .select2-selection--single .select2-selection__rendered {
      line-height: 36px !important;
    }
    .desig_fun{
      font-size: 11px;
      display: block;
      padding-top: 7px;
    }
    .test_acc_batch{
      background: #f1eded;
      font-size:10px !important;
      color: white !important;
      padding: 3px 7px 2px 5px;
      color: #000 !important;
        margin-left: 10px;
        text-transform: uppercase;
        letter-spacing: 1px;
        position: relative;
        top: -4px;
    }
    .test_acc_batch_n{
      top: -2px !important;
    }
    .select2-container--default .select2-selection--single .select2-selection__arrow b {
      border-color: #888 transparent transparent transparent;
      border-style: solid;
      border-width: 5px 4px 0 4px;
      height: 0;
      left: 50%;
      margin-left: -4px;
      margin-top: -2px;
      position: absolute;
      top: 70% !important;
      width: 0;
    }
    .select2-container--default .select2-selection--single .select2-selection__placeholder {
      color: #495057 !important;
    }
    .churn_btn{
      border-radius: 0 !important;
      padding: 5px 23px 4px;
      color: white;
    }
    .os_crhn_edit{
      background-color: #00c4cc !important;
      margin-left: 8px;
      position: relative;
      cursor: pointer;
      top: 1px;
    }
    .modal_head_ose{
      border-bottom:unset;
      background: #f0f2f3;
    }
    .os_vals{
      margin-bottom: 8px;

    }
    .aref_newp{
      color: #01DCE5 !important;
      cursor: pointer;
    }
    .aref_newpt{
      font-size: 12px !important;
    }
    .sugg_fretx{
      padding-top: 10px;
    }
    .modal_sugfreq{
      width: 100%;
    }
    .modal_sugfreqdiv{
      width: 50%;
      margin-left: 4px;
    }
    .modal_sugfreqdiva{
      width: 45%;
      margin-left: 14px;
    }
    .ques_icn_des{
      color: #a29b9b;
      border: 1px solid #a29b9b;
      border-radius: 50%;
      width: 15px;
      height: 15px;
      padding-left: 2.7px;
      padding-top: 1px;
      margin-left: 2px !important;
    }
    .btn_low_stay{
      background-color: #4bdd4b !important;
      border-color: #4bdd4b !important;
      padding: 5px 39px 4px !important;
    }
    .btn_medium_stay{
      background-color: #ffb837 !important;
      border-color: #ffb837 !important;
    }
    .btn_high_stay{
      background-color: #dc3545 !important;
      border-color: #dc3545 !important;
      padding: 5px 36px 4px !important;
    }
    .btn_chaticonid{
      overflow-x: hidden;
      position: fixed;
      bottom: 15px;
      right: 15px;
      width: 60px;
      height: 60px;
      text-align: center;
      padding: -10px 0;
      font-size: 24px;
      line-height: 1.428571429;
      border-radius: 30px;
      border: none;
      background-color: #00C4CC;
      box-shadow: 0 6px 6px 5px #d4d4d4;
    }
    .chat_head_md{
      width: 512px;
    }
    .chatbox_com{
      font-weight: 500 !important;
    }
    .cro_chatbox{
      font-weight: 700;
      color: #000;
    }
    .chatbox_header_bo{
      border-bottom: unset !important;
    }
    .mdl_foot_chat{
      border-bottom:1px solid #dee2e6;;
      border-top: unset !important;
    }
    .bor_rad_un
    {
      border-radius: unset !important;
    }
    .cro_chatboxcl{
      opacity: unset !important;
    }
    .chat_txare{
      margin-right: 14px;
      margin-left: 14px;
    }
    .chat_txare textarea{
      height: 126px;
      border-color: #353535;
    }
    .view_commdl{
      font-size: 14px;
      font-weight: 600;
      margin-bottom: 14px;
    }
    .chat_log_img{
      width: 25px;
    }
    .pur_name_chat{
      font-size: 12px;
      margin-left: 4px;
    }
    .pur_type_chat{
      font-size: 10px;
      color: #928b8b;
    }
    .mesg_chat{
      font-size: 13px;
      display: block;
      color: #928b8b;
      margin-bottom: 13px;
    }
    .img_name_chat{
      margin-bottom: 10px;
    }
    .view_comm_sc{
      float: right;
      margin-top: 10px;
    }
    .chat_datetime_p{
      float: right;
      font-size: 12px;
      margin-top: 5px;
      color: #928b8b;
    }
    .chaticbadge {
      position: fixed;
      bottom: 54px;
      right: 10px;
      padding: 1px 7px 1px 8px;
      border-radius: 50%;
      background-color: red;
      color: white;
      font-size: 13px;
    }
    span.width_icon_td {
      width: 20%;
    }
    span.width_icon_tdnew{
      width: 20%;
    }
    .working_busni_per{
      margin-top: 4px;
      display: block;
    }
    .frm_seapurcoage{
      width: 18%;
      float: right;
      margin-right: 5px;
      position: relative;
      margin-left: 10px;
      /* margin-top: -2px; */
    }
    .circle_deletemore{
        width: 25px;
        height: 25px;
        text-align: center;
        padding: 4px 0;
        font-size: 13px;
        line-height: 1.428571429;
        border-radius: 22px;
        border: none;
        margin-right: 10px;
        background-color: #d31515;
    }
    .btn-circle_editosmore {
      width: 40px;
      height: 40px;
      }
      .image_catalogue{
        max-width: 50px;
        min-width: 50px;
        height: 50px;
        margin-right: 15px;
      }
      .navbarcustompur{
        background-color: black;
        position: fixed;
        top: 0;
        width: 100%;
        padding: 2px;
      }
      .check_all_checknav{
        margin-top: unset !important;
        margin-bottom: unset !important;
      }
      .frm_seapurcoagecusnav{
        width: unset !important;
      }
      .export_btncusnav {
        margin-right: 5px;
        margin-left: 5px;
      }
      .cusnavflx{
        width: 100%;
        display: flex;
      }
      .firscuswid{
        width: 60%;

      }
      .seccuswid{
        width: 100%;
        margin-top: 7px;
        margin-bottom: 8px;
      }
      .btn_search_icscnav{
        position: absolute;
          top: 0;
          right: -2px;
      }
      .border_radiusunset{
        border-radius: unset;
      }
      @media only screen and (min-device-width: 480px) and (max-device-width: 768px) {
      .tab_des_det{
        width: 100% !important;
      }
      .tabdescheck{
        width: 100%;
      }
      .btn_chaticonid{
        display: none;
      }
      }

      @media only screen and (min-device-width: 300px) and (max-device-width: 480px) {
        .btn_chaticonid{
          display: none;
        }
        }

      @media only screen and (min-device-width: 575px) and (max-device-width: 768px) {
        .frm_sea_catacatambl {
          width: 100% !important;
          margin-left: 28px !important;
          margin-right: 28px !important;
        }
        .screencata_btnsub{
          padding-right: 28px !important;
        }
        }
        .screencata_btnsub{
          padding-right: 67px;
          padding-bottom: 60px;
        }
        .arrow_btn_scoc {
          margin-top: 2px;
          cursor: pointer;
          margin-left: 6px;
      }
      .sales_rep_cls{
        color: #4a00fe;
          font-size: 0.75em;
      }
      .clear_btn_search{
        color: #898282;
        text-decoration: underline;
        cursor: pointer;
        position: absolute;
        top: 6px;
        right: 47px;
        font-size: 16px;
      }
      .clear_serach_screen{
        display: none;
      }
      .row_os_pgecata{
        width: 180px !important;
        display: flex;
      }
      .imgcatapnf{
        height: 45px;
        width: 45px;
      }
      .sngledown_modal{
        position: absolute;
        top: -3px;
        right: 23px;
        cursor: pointer;
      }
      .mbl_searchclear{
        position: absolute;
        top: -99999px;
      }
      .clsea_screen{
        cursor: pointer;
        position: absolute;
        top: 6px;
        right: 45px;
        color: #898282;
      }
      .tbody {
      text-align: center;
      padding: 0px 0;
      font-size: 19px;
      line-height: 1.428571429;
      border-radius: 22px;
      border: none;
      cursor: pointer;
    }
    .dropmorefns{
      font-size: 12px;
      width: 100%;
    }
    .icon_morefs{
      width: 40%;
    }
    .circle_editoscopyl {
      width: 25px;
      height: 25px;
      text-align: center;
      padding: 0px 0;
      font-size: 13px;
      line-height: 1.428571429;
      border-radius: 22px;
      border: none;
      cursor: pointer;
    }
    .icon_morefs{
      width: 40%;
    }
    .add_checkbox_pur{
      width: 3%;
      float: left;
      margin-top: 50px;
    }
    .maincontent_propur{
      width: 97%;
      float: left;
      position: relative;
    }
    .maincontent_propurnew{
      width: 100%;
      float: left;
      position: relative;
    }
    .main_top_purpro{
      clear: both;
    }
    .check_all_check{
      margin-top: 5px;
      padding-left: 30px;
      font-size: 30px;
      margin-bottom: 25px;
    }
    .downarooww {
      width: 1px;
      height: 0px;
      border-top: 11px solid #4d4b4b;
      border-left: 8px solid transparent;
      border-right: 8px solid transparent;
      border-bottom: 7px;
      margin-left: 1px;
      margin-top: 1px;
      cursor: pointer;
    }
    .disp_none{
      display: none;
    }
    .catacard{
      margin-top: 40px;
    }
    .bulk_remove{
      font-size: 13px;
    }
    .bulk_stock{
      font-size: 13px;
    }
    .bulk_stock_close{
      font-size: 13px;
    }
    .add_checkbox_pur input {
      padding: 0;
      height: initial;
      width: initial;
      margin-bottom: 0;
      /* display: none; */
      cursor: pointer;
    }
    .add_checkbox_purcacel input {
      padding: 0;
      height: initial;
      width: initial;
      margin-bottom: 0;
      /* display: none; */
      cursor: pointer;
    }
    .headercatalogue {
      padding: 0px;
        background: black;
        color: white;
        font-size: 14px;
    }
    .maincont_cat{
      margin-top: 12px;
      margin-bottom: 8px;
    }
    .logo_cata .rounded-circle{
      width: 40px ;
      margin-left: 23px ;
    }
    .maincont_cat .font_szecata{
      font-size: 12px !important;
      color: #ccc;
    }
    .submit_catabtn{
      position: absolute;
      right: 65px;
      font-size: 13px;
      cursor: pointer !important;
    }
    .name_cate_pro{
      margin-left: -40px;
    }
    .logo_cata{
      margin-right: 40px;
      margin-left: 25px;
    }
    .frm_sea_cata{
      width: 16%;
        float: left;
        margin-top: 22px;
        margin-left: 25px;
        position: relative;
    }
    .btn_search_iccata{
    }
    .main_catcontent{
      width: 100%;
      display: flex;
    }
    .card_cata{
      background-color: #fbfbfb !important;
      min-height: 210px;
      max-height: 210px;
    }
    .maincrds_cata{
      margin-left: 27px;
      margin-top: 15px;
      margin-right: 27px;
    }
    .img_fluid_cata{
      max-width: 100%;
      height: 100px;
      width: 100px;
      margin-bottom: 20px;
    }
    .more_learcata{
      color: #0fce0f !important;
      cursor: pointer;
    }
    .imag_cata_na{
      width: 100%;
      display: flex;
    }
    .image_catesep{
      width: 30%;
    }
    .image_catesepnewww{
      width: 17%;
    }
    .sep_nameode{
      width: 70%;
      margin-left: 15px;
      margin-top: 18px;
    }
    .bold_catapro{
      font-weight: 600;
    }
    .procode_cata{
      font-weight: 500;
      color: gray;
    }
    .prodes_cata{
      color: #5f5757 !important;
      font-weight: 500;
    }
    .descript_txtcate{
      color: #aba2a2;
    }
    .modal-fottercata{
      display: block !important;
      border-top: unset !important;
    }
    .circle_deletemore{
      width: 25px;
      height: 25px;
      text-align: center;
      padding: 4px 0;
      font-size: 13px;
      line-height: 1.428571429;
      border-radius: 22px;
      border: none;
      margin-right: 10px;
      background-color: #d31515;
    }
    .image_catalogue{
      max-width: 50px;
      min-width: 50px;
      height: 50px;
      margin-right: 15px;
    }
    .navbarcustompur{
      background-color: black;
      position: fixed;
      top: 0;
      width: 100%;
      padding: 2px;
    }
    .check_all_checknav{
      margin-top: unset !important;
      margin-bottom: unset !important;
    }
    .frm_seapurcoagecusnav{
      width: unset !important;
    }
    .export_btncusnav {
      margin-right: 5px;
      margin-left: 5px;
    }
    .cusnavflx{
      width: 100%;
      display: flex;
    }
    .firscuswid{
      width: 60%;

    }
    .seccuswid{
      width: 40%;
      margin-top: 7px;
      margin-bottom: 8px;
    }
    .btn_search_icscnav{
      position: absolute;
        top: 0;
        right: -2px;
    }
    .border_radiusunset{
      border-radius: unset;
    }
    @media only screen and (min-device-width: 480px) and (max-device-width: 768px) {
    .tab_des_det{
      width: 100% !important;
    }
    .tabdescheck{
      width: 100%;
    }
    }

    @media only screen and (min-device-width: 575px) and (max-device-width: 768px) {
      .frm_sea_catacatambl {
        width: 100% !important;
        margin-left: 28px !important;
        margin-right: 28px !important;
      }
      .screencata_btnsub{
        padding-right: 28px !important;
      }
      }
      .screencata_btnsub{
        padding-right: 67px;
        padding-bottom: 60px;
      }
      .arrow_btn_scoc {
        margin-top: 2px;
        cursor: pointer;
        margin-left: 6px;
    }
    .sales_rep_cls{
      color: #4a00fe;
        font-size: 0.75em;
    }
    .clear_btn_search{
      color: #898282;
      text-decoration: underline;
      cursor: pointer;
      position: absolute;
      top: 6px;
      right: 47px;
      font-size: 16px;
    }
    .clear_serach_screen{
      display: none;
    }
    .row_os_pgecata{
      width: 180px !important;
      display: flex;
    }
    .imgcatapnf{
      height: 45px;
      width: 45px;
    }
    .sngledown_modal{
      position: absolute;
      top: -3px;
      right: 23px;
      cursor: pointer;
    }
    .mbl_searchclear{
      position: absolute;
      top: -99999px;
    }
    .clsea_screen{
      cursor: pointer;
      position: absolute;
      top: 6px;
      right: 45px;
      color: #898282;
    }
    .tbody {
    text-align: center;
    }
    .bulk_title .h4{
      width: 100%;
    }
    .bulk_title .btn_bulk_change{
      width: 100%;
      text-align: right;
    }
    .bulk_title .btn_bulk_change button#productpriceupdate {
      background: transparent;
      color: #00C4CC;
      font-size: 14px;
      letter-spacing: 0.5px;
    }
    .bulk_title .btn_bulk_change button#productpriceupdate:hover {
      background: #00C4CC;
      color: #ffffff;
    }
    .modal_headercu{
      border-bottom: unset !important;
      background: #cdcdcd;
      border-radius: 0;
    }
    .div_mdl_cen{
      width: 550px;
    }
    .modal-contentcus{
      border: unset !important;
    }
    .minus_cystom{
      display: none;
    }
    .newquntcus_io{
      height: 33px;
      margin-left: -5px;
      margin-right: -5px;
      border: 1px solid #dee2e6;
      border-radius: 3px;
      padding-left: 10px;
    }
    .minus_cystom{
      display: inline-block;
      background: #00c4cc;
      height: 32px;
    }
    .plus_btn_mb {
      color: #fff;
      font-size: 17px;
      padding: 7px 10px;
  }
    @media only screen and (max-width: 1200px){
      .newquntcus_io{
        height: 33px;
        margin-left: -5px;
        margin-right: -5px;
        border: 1px solid #dee2e6;
        border-radius: 3px;
        padding-left: 10px;
      }
      .right_quantity_changer{
        display: none !important;
      }
      .right_quantity_changer_sc1{
        display: none;
      }
      .minus_cystom{
        display: inline-block;
        background: #00c4cc;
        height: 32px;
      }
      .plus_btn_mb {
        color: #fff;
        font-size: 17px;
        padding: 7px 10px;
    }
        }
  .suppiercsspg{
    width: 100%;
  }
  .suppiercsspg img{
    float: left;
  }
  .font_smloscre{
    margin-top: 13px;
    display: block;
  }
  .estmate_paddingoscre{
    margin-top: 11px;
    color: maroon;
  }
  .newestmate_paddingoscre{
    color: #e70707;
    padding-top: 10px;
  }
  .flhbiftbk{
    float: right ;
  }
  .oscmpmpb{
    margin-top: 10px;
    display: block;
    color: black !important;
    font-weight: 400 !important;
  }
  .btn_circle_eyeoscr{
    width: 35px;
      height: 35px;
      text-align: center;
      padding: 6px 0;
      font-size: 17px;
      line-height: 1.428571429;
      border-radius: 22px;
      border: none;
      background-color: purple;
  }
  .row_main_homeoscr{
    padding-top: 0px !important;
    margin-top: -5px !important;
  }
  .email_purcss{
    color: #2a2525 !important;
  }
  .email_purcssh{
    color: black !important;
  }
  .cuspadlvi{
    padding-bottom: 10px !important;
  }
  .all-order-frmnew {
    font-size: 22px;
    font-weight: bold;
    margin-bottom: 9px;
    margin-left: 5px;
  }
  .mnosbrejr .border_pagenew:last-child{
    border-bottom: none !important;

  }
  .npadhbnkh{
    padding-top: 0px !important;
  }
  .npadhbnkhchild{
    padding-top: 12px !important;
  }
  .psccsp{
    color: #86C986;
  }
  .peggep{
  color: #FAAD14;
  }
  .spddps{
  color: #1890FF;;
  }
  .devved{
    color: #ffc800;
  }
  .cldld{
    color: #FF4D4F;
  }
  .frmcgtgit{
    width: 40%;
    float: left;
    margin-top: 8px;
  }
  .flwhpctn{
    width: 100%;
  }
  .frmcgtgitvnb{
    width: 60%;
    float: left;
  }
  .ciocudfhm{
  margin-top:9px;
  font-size:13px
  }
  .neclsgryedbg{
    background-color: #f1efef  !important;
  }
  .pasuded_cls{
    position: absolute;
    top: -27px;
    left: 0px;
    background: #262B31;
    color: white;
    padding: 3px 18px 3px 18px;
    font-size: 14px;
    text-transform: uppercase;
  }
  span.pasuded_cls::before {
    content: '';
    position: absolute;
    width: 6px;
    height: 25px;
    background: #262B31;
    left: -5px;
    top: 0;
    z-index: 999;
  }
  span.pasuded_cls::after {
    content: '';
    position: absolute;
    left: -5px;
    bottom: -8px;
    z-index: 999;
    width: 0;
    height: 0;
    border-top: 10px solid #262B31;
    border-left: 6px solid transparent;
  }




  /* new checkbox design */
  .checkbox-labelnew {
    display: block;
    position: relative;
    margin: auto;
    cursor: pointer;
    font-size: 22px;
    line-height: 24px;
    height: 24px;
    width: 24px;
    clear: both;
  }

  .checkbox-labelnew input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
  }

  .checkbox-labelnew .checkbox-customnew {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 24px;
    width: 24px;
    background-color: transparent;
    border-radius: 5px;
    transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    border: 2px solid #000;
  }


  .checkbox-labelnew input:checked ~ .checkbox-customnew {
    background-color: black;
    border-radius: 5px;
    -webkit-transform: rotate(0deg) scale(1);
    -ms-transform: rotate(0deg) scale(1);
    transform: rotate(0deg) scale(1);
    opacity:1;
    border: 2px solid #000;
  }
  .checkbox-labelnew input:indeterminate ~ .checkbox-customnew {
    background-color: black;
    border-radius: 5px;
    -webkit-transform: rotate(0deg) scale(1);
    -ms-transform: rotate(0deg) scale(1);
    transform: rotate(0deg) scale(1);
    opacity:1;
    border: 2px solid #000;
  }
  .checkbox-labelnew .checkbox-customnew::after {
    position: absolute;
    content: "";
    left: 12px;
    top: 12px;
    height: 0px;
    width: 0px;
    border-radius: 5px;
    border: solid #000;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(0deg) scale(0);
    -ms-transform: rotate(0deg) scale(0);
    transform: rotate(0deg) scale(0);
    opacity:1;
    transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
  }


  .checkbox-labelnew input:checked ~ .checkbox-customnew::after {
  -webkit-transform: rotate(45deg) scale(1);
  -ms-transform: rotate(45deg) scale(1);
  transform: rotate(45deg) scale(1);
  opacity:1;
  left: 8px;
  top: 3px;
  width: 6px;
  height: 12px;
  border: solid white;
  border-width: 0 2px 2px 0;
  background-color: transparent;
  border-radius: 0;
  }
  .checkbox-labelnew input:indeterminate ~ .checkbox-customnew::after {
  -webkit-transform: rotate(45deg) scale(1);
  -ms-transform: rotate(45deg) scale(1);
  transform: rotate(89deg) scale(1);
  opacity:1;
  left: 8px;
  top: 3px;
  width: 6px;
  height: 12px;
  border: solid white;
  border-width: 0 2px 0px 0;
  background-color: transparent;
  border-radius: 0;
  }
  /*head checkbox*/


  .checkbox-labelnewhead {
    display: block;
    position: relative;
    margin: auto;
    cursor: pointer;
    font-size: 22px;
    line-height: 24px;
    height: 24px;
    width: 24px;
    clear: both;
  }

  .checkbox-labelnewhead input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
  }

  .checkbox-labelnewhead .checkbox-customnewhead {
    position: absolute;
    top: 3px;
    left: 0px;
    height: 24px;
    width: 24px;
    background-color: transparent;
    border-radius: 5px;
    transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    border: 2px solid white;
  }


  .checkbox-labelnewhead input:checked ~ .checkbox-customnewhead {
    background-color: black !important;
    border-radius: 5px;
    -webkit-transform: rotate(0deg) scale(1);
    -ms-transform: rotate(0deg) scale(1);
    transform: rotate(0deg) scale(1);
    opacity:1;
    border: 2px solid white;
  }
  .checkbox-labelnewhead input:indeterminate ~ .checkbox-customnewhead {
    background-color: black !important;
    border-radius: 5px;
    -webkit-transform: rotate(0deg) scale(1);
    -ms-transform: rotate(0deg) scale(1);
    transform: rotate(0deg) scale(1);
    opacity:1;
    border: 2px solid white;
  }
  .checkbox-labelnewhead .checkbox-customnewhead::after {
    position: absolute;
    content: "";
    left: 12px;
    top: 12px;
    height: 0px;
    width: 0px;
    border-radius: 5px;
    border: solid #000;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(0deg) scale(0);
    -ms-transform: rotate(0deg) scale(0);
    transform: rotate(0deg) scale(0);
    opacity:1;
    transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
  }


  .checkbox-labelnewhead input:checked ~ .checkbox-customnewhead::after {
  -webkit-transform: rotate(45deg) scale(1);
  -ms-transform: rotate(45deg) scale(1);
  transform: rotate(45deg) scale(1);
  opacity:1;
  left: 8px;
  top: 3px;
  width: 6px;
  height: 12px;
  border: solid white;
  border-width: 0 2px 2px 0;
  background-color: transparent;
  border-radius: 0;
  }
  .checkbox-labelnewhead input:indeterminate ~ .checkbox-customnewhead::after {
  -webkit-transform: rotate(45deg) scale(1);
  -ms-transform: rotate(45deg) scale(1);
  transform: rotate(89deg) scale(1);
  opacity:1;
  left: 7px;
  top: 3px;
  width: 6px;
  height: 12px;
  border: solid white;
  border-width: 0 2px 0px 0;
  background-color: transparent;
  border-radius: 0;
  }



  /* new checkbox mbl */
  .checkbox-labelnewmbl {
    display: block;
    position: relative;
    margin: auto;
    cursor: pointer;
    font-size: 22px;
    line-height: 18px;
    height: 18px;
    width: 24px;
    clear: both;
  }

  .checkbox-labelnewmbl input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
  }

  .checkbox-labelnewmbl .checkbox-customnewmbl {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 18px;
    width: 18px;
    background-color: transparent;
    border-radius: 5px;
    transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    border: 2px solid #000;
  }


  .checkbox-labelnewmbl input:checked ~ .checkbox-customnewmbl {
    background-color: black;
    border-radius: 5px;
    -webkit-transform: rotate(0deg) scale(1);
    -ms-transform: rotate(0deg) scale(1);
    transform: rotate(0deg) scale(1);
    opacity:1;
    border: 2px solid #000;
  }
  .checkbox-labelnewmbl input:indeterminate ~ .checkbox-customnewmbl {
    background-color: black;
    border-radius: 5px;
    -webkit-transform: rotate(0deg) scale(1);
    -ms-transform: rotate(0deg) scale(1);
    transform: rotate(0deg) scale(1);
    opacity:1;
    border: 2px solid #000;
  }
  .checkbox-labelnewmbl .checkbox-customnewmbl::after {
    position: absolute;
    content: "";
    left: 12px;
    top: 12px;
    height: 0px;
    width: 0px;
    border-radius: 5px;
    border: solid #000;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(0deg) scale(0);
    -ms-transform: rotate(0deg) scale(0);
    transform: rotate(0deg) scale(0);
    opacity:1;
    transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
  }


  .checkbox-labelnewmbl input:checked ~ .checkbox-customnewmbl::after {
  -webkit-transform: rotate(45deg) scale(1);
  -ms-transform: rotate(45deg) scale(1);
  transform: rotate(45deg) scale(1);
  opacity:1;
  left: 4px;
  top: 1px;
  width: 6px;
  height: 10px;
  border: solid white;
  border-width: 0 2px 2px 0;
  background-color: transparent;
  border-radius: 0;
  }
  .checkbox-labelnewmbl input:indeterminate ~ .checkbox-customnewmbl::after {
  -webkit-transform: rotate(45deg) scale(1);
  -ms-transform: rotate(45deg) scale(1);
  transform: rotate(89deg) scale(1);
  opacity:1;
  left: 5px;
  top: 1px;
  width: 4px;
  height: 11px;
  border: solid white;
  border-width: 0 2px 0px 0;
  background-color: transparent;
  border-radius: 0;
  }
  .cuspaddingtod{
  padding: 2px 65px 2px 65px;
  background-color: #FFA500  !important;
  border-color: #FFA500 !important;
  border-radius: 50px;
  }
  .cuspaddingtod:focus{
    box-shadow: none !important;
  }
  .whpsmtkl{
  width: 100%;
  }
  .whpsmtklfd{
    width: 66%;
    float: left;
  }
  .whpsmtklsd{
    float: left;
    width: 34%;
  }
  .btn_search_icrtf{
  right: 14px !important;
  }
  @media(min-width: 320px) and (max-width: 768px){
    .margifomblride{
      margin-right: 10px;
      margin-left: 15px !important;
    }
    .login-page .container {
      padding-left: 0px;
      padding-right: 0px;
  }
    .col-lg-6.col-xl-6.col-md-6.col-sm-12.col-xs-12 button{
      width: 48%;
      float: left;
      margin: 1% !important;
      font-size: 11px !important;
      padding: 6px 10px;
    }
    .tkdfkmdspou{
      margin-bottom: 5px !important;
    }
    .btn_search_icrtf{
      top: -15px !important;
      right: 14px !important;
      padding: 8px 0px 8px !important;
      width: 8% !important;
    }
  }
  .nsbigskckj{
  width: 100%;
  margin-bottom: 20px;
  padding: 16px 5px;
  background: white;
  box-shadow: 2px 2px 2px rgb(0 0 0 / 10%);
  }
  .nsbigskckjf{
  width: 25%;
  float: left;
  margin-right: 4px;
  }
  .nsbigskckjs{
  width: 25%;
  float: left;
  margin-right: 4px;
  }
  .nsbigskckjt{
    width: 40%;
    margin-right: 4px;
    float: right;
    }
    .multiselect-container>li{
      margin-left: 5px;
    }
    li.multiselect-item.multiselect-all {
      font-weight: 600;
  }
  .btnstatuses{
    color: white;
  }
  .btnstatuses:hover{
    color: white;
  }

  .dropdown-check-list {
    display: inline-block;
  }

  .dropdown-check-list .anchor {
    position: relative;
    cursor: pointer;
    display: inline-block;
    padding: 5px 50px 5px 10px;
    border: 1px solid #ccc;
  }

  .dropdown-check-list .anchor:after {
    position: absolute;
    content: "";
    border-left: 2px solid black;
    border-top: 2px solid black;
    padding: 5px;
    right: 10px;
    top: 20%;
    -moz-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
  }

  .dropdown-check-list .anchor:active:after {
    right: 8px;
    top: 21%;
  }

  .dropdown-check-list ul.items {
    padding: 2px;
    display: none;
    margin: 0;
    border: 1px solid #ccc;
    border-top: none;
  }

  .dropdown-check-list ul.items li {
    list-style: none;
  }

  .dropdown-check-list.visible .anchor {
    color: #0094ff;
  }

  .dropdown-check-list.visible .items {
    display: block;
  }
  .bdisfsji{
      margin-left: 8px;
      color: black;
      font-weight: 500;
      background: #e5e5e5;
      padding: 0px 7px;
  }
  .frsbnhbuck{
    background: #726c6c;
    height: 20px;
    margin-top: 2px;
    width: 2px;
    margin-left: 5px;
  }
  ul.pagination {
    justify-content: center;
  }
  span.page-link {
  color: black !important;
  background-color: #f8f8f8 !important;
  }
  .page-link:hover {
    z-index: 2;
    color: black !important;
    background-color: #f8f8f8 !important;
    border-color: #ddd;
  }
  .page-link {
    padding: 0.5rem 0.75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: black !important;
    background-color: #f8f8f8 !important;
    border: unset !important;
  }
  .page-item.active .page-link {
    color: #fff !important;
    background-color: #00c4cc !important;
    border-color: #00c4cc !important;
  }
  .pvhimckkbyu{
    background-color: white;
    padding: 7px 7px 7px 7px;
    font-size: 13px;
    border: none;
    cursor: pointer;
    border: 1px solid black;
    color: black;
    font-weight: 500 !important;
    border-radius: 6px;
  }
  button.dropbtn.pvhimckkbyu:hover,
  button.dropbtn.pvhimckkbyu:focus
  {
    background-color: white;
  }
  .fcebineiwgw:first-of-type {
    margin-top: 12px;
   }
   .fcebineiwgws:first-of-type {
    margin-top: 12px;
   }
   .dcrzkhanbho{
     right: 0 !important;
     top: 36px;
     min-width: 181px !important;
     max-width: 181px !important;
     box-shadow: 2px 2px 2px rgb(0 0 0 / 10%), -1px 0 2px rgb(0 0 0 / 5%);
   }
   .cdknrazhrh{
    padding:3px 16px !important;
    font-size:13px;
    margin-left: 5px;
   }
   .skblstfghj{
    float: right;
    margin-bottom: 10px;
    margin-right: 25px;
    font-size:13px;
    padding: 4px 10px 4px 10px;
   }
   .kjhtehitbgyhiz{
    background: white;
    padding: 12px 0px 12px 0px;
   }
   .cfknktmabaps{
     margin-left: 28px;
     margin-right: 28px;


   }
   .cfknktmabapsch{
    box-shadow: 2px 2px 2px rgb(0 0 0 / 10%);
    background-color: white;
    margin-top: 10px;
   }
   .nskfkldlpi{
     margin-left: 73px;
   }
   .dvafadfdsgverg{
    width: 100%;
    padding: 0px 0px 0px 20px;
   }
   .kjvsbpirdf{
    max-width: 236px !important;
    min-width: 236px !important;
    box-shadow: 2px 2px 2px rgb(0 0 0 / 10%), -1px 0 2px rgb(0 0 0 / 5%);
   }
   .mfkfjnherqoru{
    margin-top:6px;
    float:left;
   }
  .ddkkrhlcnpdkk{
      min-width: 284px;
      max-width: 284px;
      border-bottom-left-radius: 13px;
      border-bottom-right-radius: 13px;
  }
  .cstcftosg{
    padding-left: 40px;
    background: white;
  }
  .hrfdsfnfahjaeu{
      margin-top: -64px;
      margin-left: -16px;
      font-size: 14px;
      padding: 1px 20px;
  }
  .undobtncls{
  text-decoration: underline;
  }
  .kdlvmdkfsvdk{
    display: flex;
  }
  .pvhimckkbyu{
    float: right;
  }
  .maedfnmshbn{
    margin-right: 10px;
  }
  .vndjfkvnljera{
    top: 36px;
  }
  @media(min-width: 320px) and (max-width: 768px){
    .kjvsbpirdf {
      right: 0px !important;
      max-width: 200px !important;
      min-width: 200px !important;
      box-shadow: 2px 2px 2px rgb(0 0 0 / 10%), -1px 0 2px rgb(0 0 0 / 5%);
  }
  .kjhtehitbgyhiz{
      display: block;
  }
  .kdlvmdkfsvdk{
    display: block;
    flex: unset;
    max-width: unset;
  }
  .fdvnldknlkane{
    flex: unset;
    max-width: unset;
  }
  .pvhimckkbyu{
    float: unset;
  }
  .scfatbabrhomdnhrz{
    width: 100%;
    margin-bottom: 10px;
  }
  .maedfnmshbn{
    margin-right: 0px;
  }
  .vndjfkvnljera {
    top: 36px !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
  }
  }
  .valftptsato{
    font-size: 12px;
    margin-top: -3px;
    border: 1px solid #00c4cc;
    border-radius: 0%;
    padding: 7px 25px 7px 25px;
    font-weight: 100;

  }
  .valftptsatoviewa{
    border: 1px solid black;
  }
  .valftptsatoin{
  color: #00c4cc !important;
  margin-right: 10px;
  }
  .valftptsatoup{
    color: white !important;
    background: #00c4cc;
  }
  .whpsmtklsdnfjlads{
  width: 40%;
  float: right;

  }
  .lgyuickfdji{
    color: #d50e0e;
    background: #f5e8e8;
    border-radius: 11px;
    padding: 3px 4px 3px 4px;
    position: absolute;
    left: 136px;
    top: -17px;
    font-size: 18px;
  }
  @media(min-width: 320px) and (max-width: 768px){
    .newbgvlkop{
      background: white;
    }
    .pfeytnxuif{
      top: -2px !important;
      right: -2px !important;
      padding: 9px 1px 10px !important;
      width: 18% !important;
  }
  .valftptsato{
    font-size: 10px !important;
    padding: 6px 20px 6px 20px !important;
    font-weight: 400;
    border: 1px solid #00c4cc;
    margin-top: 5px;
  }
  }
  @media(min-width: 481px) and (max-width: 768px){
    .pfeytnxuif{
      top: -15px !important;
      right: 0px !important;
      padding: 9px 1px 7px !important;
      width: 18% !important;
  }
  }
  form label {
      font-weight: 400 !important;
      color: #464646;
  }
  .hrnjgfdolrthov:hover{
    background:#ebeaea !important;
  }
  .fircuscow{
    flex: 0 0 100%;
    max-width: 100%;
  }

  @media (min-width: 320px) and (max-width: 768px)
  {
  .necusatklk{
    top: -5px !important;
    right: 10px !important;
    padding: 10px 0px 9px !important;
    width: 8% !important;
  }
  }
  @media (min-width: 320px) and (max-width: 370px)
  {
    .moeesarmranf{
        font-size: 10px !important;
        color: grey !important;
      }
  }
  @media (min-width: 320px) and (max-width: 480px)
  {
  .necusatklk{
    top: 11px !important;
    right: 10px !important;
    padding: 10px 0px 9px !important;
    width: 8% !important;
  }
  }
  .fnt_smlthir{
    font-size: 13px;
  }
  .div_updqated_crdorg {
    padding-top: 31px;
    background: #f1a738;
    position: absolute;
    width: 100%;
    top: -31px;
  }
  .div_updqated_crdorg::after {
      position: absolute;
      content: "";
      width: 8px;
      height: 31px;
      left: -8px;
      top: 0;
      font-size: 18px;
      background: #f1a738;
    }
    @media(min-width: 320px) and (max-width: 768px){
      .pfeytnxuif{
        top: -2px !important;
        right: -2px !important;
        padding: 9px 1px 10px !important;
        width: 18% !important;
    }
    .valftptsato{
      font-size: 10px !important;
      padding: 6px 20px 6px 20px !important;
      font-weight: 400;
      border: 1px solid #00c4cc;
      margin-top: 5px;
    }
    }
    @media(min-width: 481px) and (max-width: 768px){
      .pfeytnxuif{
        top: -15px !important;
        right: 0px !important;
        padding: 9px 1px 7px !important;
        width: 18% !important;
    }
    }
    form label {
        font-weight: 400 !important;
        color: #464646;
    }
    .hrnjgfdolrthov:hover{
      background:#ebeaea !important;
    }
    .fircuscow{
      flex: 0 0 100%;
      max-width: 100%;
    }

    @media (min-width: 320px) and (max-width: 768px)
    {
    .necusatklk{
      top: -5px !important;
      right: 10px !important;
      padding: 10px 0px 9px !important;
      width: 8% !important;
    }
    }
    @media (min-width: 320px) and (max-width: 480px)
    {
      .mblgijk{
        display: none !important;
      }
      .trashmbl{
        padding: 0px 9px 0px 9px;
        font-size: 22px;
        border-radius: 4px;
        background: #df2929;
      }
      .mvetopmbl{
        background: grey;
        padding: 0px 9px 0px 9px;
        font-size: 22px;
        border-radius: 4px;
      }
      .mvetopmblcl{
        background: #00C4CC;
        padding: 13px 9px 5px 9px !important;
        font-size: 22px;
        border-radius: 4px;
      }
    .necusatklk{
      top: -15px !important;
      right: 10px !important;
      padding: 9px 0px 7px !important;
      width: 8% !important;
      }
    }
    .marg_votlog{
      margin-bottom: 5px !important;
    }
    .fnt_smlthir{
      font-size: 13px;
    }
    .div_updqated_crdorg {
      padding-top: 31px;
      background: #f1a738;
  }
  .div_updqated_crdorg::before {
      position: absolute;
      content: "";
      width: 0;
      height: 0;
      border-top: 10px solid #f1a738;
      border-left: 8px solid transparent;
      left: -8px;
  }
  .div_updqated_crdgree {
    padding-top: 31px;
    background: #048114;
    position: absolute;
    width: 100%;
    top: -31px;
  }
  .div_updqated_crdgree::after {
      position: absolute;
      content: "";
      width: 8px;
      height: 31px;
      left: -8px;
      top: 0;
      background: #048114;
  }
  .div_updqated_crdgree::before {
      position: absolute;
      content: "";
      width: 0;
      height: 0;
      border-top: 10px solid #048114;
      border-left: 8px solid transparent;
      left: -8px;
  }
  .suggestednum{
      margin-top: 5;
      color: red;
      font-size: 13px;
  }
  .btn-circle_editlist {
    width: 31px;
    height: 31px;
    text-align: center;
    padding: 5px 0;
    font-size: 15px !important;
    line-height: 1.428571429;
    border-radius: 22px;
    border: none;
    background-color: #01DCE5;
  }
  .btn-circle_deleteindexlist {
    width: 31px;
    height: 31px;
    text-align: center;
    padding: 6px 0;
    font-size: 15px !important;
    line-height: 1.428571429;
    border-radius: 22px;
    border: none;
    background-color: #d31515;
  }
  .clear_btn_searchteam{
    color: #898282;
    text-decoration: underline;
    cursor: pointer;
    position: absolute;
    top: 21px;
    right: 77px;
    font-size: 16px;
  }
    .div_updqated_crdgree::after {
        position: absolute;
        content: "";
        width: 8px;
        height: 31px;
        left: -8px;
        top: 0;
        background: #048114;
    }
    .div_updqated_crdgree::before {
        position: absolute;
        content: "";
        width: 0;
        height: 0;
        border-top: 10px solid #048114;
        border-left: 8px solid transparent;
        left: -8px;
    }

    .tooltipcus {
      position: relative;
      display: inline-block;
      width: 25px !important;
    }

    .tooltipcus .tooltiptextcus {
      visibility: hidden;
      width: 150px;
      background-color: black;
      color: #fff;
      text-align: center;
      border-radius: 6px;
      padding: 5px 0;
      font-size: 12px;
      padding-right: 10px;
      padding-left: 10px;

      /* Position the tooltip */
      position: absolute;
      z-index: 1;
      top: -11px;
    }
    .tooltipcus .tooltiptextcus::after {
      content: " ";
      position: absolute;
      top: 50%;
      right: 100%; /* To the left of the tooltip */
      margin-top: -5px;
      border-width: 5px;
      border-style: solid;
      border-color: transparent black transparent transparent;
    }
    .cusfifpx{
      font-size: 15px;
    }
    .cuswidthforinp{
      width: 140px;
    }
  .walgeen{
    background-color:#bbbbbb;
  }
  .fntthirpx{
    font-size: 13px !important;
  }
  .newteamloc{
    height: 39px;
    width: 185px;
  }
  .div_updqated_crdblk{
    padding-top: 31px;
    background: black !important;
    top: unset !important;
    bottom: -25px !important;
  }
  .div_updqated_crdblk::before{
    /* border-top: 10px solid black; */
    border-bottom: 10px solid black;
    border-right: 8px solid transparent;
    right: -8px;
    left: unset;
    border-left: unset;
    border-top: unset;
    top: -10px;

  }
  .div_updqated_crdblk::after{
    background: black;
    right: -8px;
    left: unset;
  }
  .newteamsup{
    height: 39px;
    width: 185px;
  }
  .suppnameteam {
    float: right;
  }
  .rdyorder{
    padding: 4px 20px 4px 20px;
    cursor: pointer;
  }
  .maiboxforsh{
    overflow: hidden;
    padding: 15px;
    -webkit-box-shadow: 0px 3px 6px rgb(0 0 0 / 50%), -1px 0 2px rgb(0 0 0 / 5%);
    box-shadow: 0px 3px 6px rgb(0 0 0 / 50%), -1px 0 2px rgb(0 0 0 / 5%);
    margin-bottom: 35px !important;
  }
  .totalajcval{
    text-align: center;
    font-weight: 500;
    min-width: 33px;
    padding: 2px 2px;
    border: 1px solid #c6bfbf;
    box-shadow: black;
  }
  .chosen-container.chosen-container-multi {
    width: 100% !important;
    min-width: 190px !important;
  }
  .crtyhehe{
    color: blue;
    cursor: pointer;
  }
  .div_updqated_crdred{
    padding-top: 31px;
    background: #d31515 !important;
    top: unset !important;
    bottom: -25px !important;
  }
  .div_updqated_crdred::before{
    /* border-top: 10px solid black; */
    border-bottom: 10px solid #d31515;
    border-right: 8px solid transparent;
    right: -8px;
    left: unset;
    border-left: unset;
    border-top: unset;
    top: -10px;

  }
  .div_updqated_crdred::after{
    background: #d31515 ;
    right: -8px;
    left: unset;
  }
  .fauserspan{
    background: #f1f1f1;
    padding: 2px 4px 0px 4px;
    font-size: 12px;
    margin-top: 2px;
  }
  .lasthist{
    padding-top: 31px;
    position: absolute;
    width: 100%;
    top: -31px;
    top: unset !important;
    bottom: -21px !important;
  }
  .updated_spnhis{
    position: absolute;
    bottom: 0px;
    left: 0px;
    color: #818181;
    font-weight: 500;
    font-size: 12px;
  }
  .clsovflohid{
    overflow: hidden;
    width: 100%;
  }
  .newgryloc{
    float: left;
    margin-top: 8px;
  }
  .stktogskmng{
    width: 29%;display:contents;
  }
  .uommblstvkmn{
  width: 60px;
  }
  .alllocstck{
    width:100%;
    float:left;
  }
  .affirdictotl{
    font-size: 15px;
    font-weight: 600;
    position: relative;
  }
  .totabsspa{
    position: absolute;
    right: 140px;
  }
  .umcnewdbl{
    width:60px;
    font-weight:500;
  }
  .oitemsbtn{
    color:white;
    font-size:13px;
    margin-right:44px;
    float:right;
  }
  .supp_divprombl{
    margin-top: 10px;
  }
  .rowteght{
    margin-top:60px;
    margin-left:28px;
    display:block;
  }
  .classforminh{
    margin-left: -25px;
  }
  .mbllocdrp{
    margin-right:15px;
    float: right;
  }
  .sorthiori{
    margin-right:15px;
    float: right;
  }
  .fxclasfore{
    display: flex;
  }
  .forschjsch{
    width:16%;
    margin-bottom: 20px;
  }
  @media only screen and (max-width: 768px){
    .pur-nac_name{
      top: 30px;
      font-size: 13px;
      line-height: 19px;
      max-width: 30%;
    }
    .secclsstkmange{
      padding: 10px 0;
    }
    .forschjsch{
      width:16%;
      margin-bottom: 10px;
    }
    .nilckofg{
      display: inline-block;
    }
    .fxclasfore{
      display: unset;
    }
    .sorthiori{
      margin-right:0;
      float: unset;
      width: 100%;
    }
    .mbllocdrp{
      margin-right:0;
      float: unset;
      width: 100%;
    }
    .datszeforstcvk{
      font-size: 100%;
    }
    .classforminh{
      margin-left: 0px;
    }
    .discontsthed{
      display: unset !important;
    }
    nav.custclsmbl{
      margin-left: 0px !important;
      padding-bottom: 15px !important;

    }
    .rowteght{
      margin-left:14px;
      margin-top: 23px;
    }
    .supp_divprombl{
      margin-top: 0px;
      }
    .oitemsbtn{
      float: unset;
      margin-bottom: 6px;
    }
    .umcnewdbl{
      float: left;
      width: 8%;
    }
    .ajxvalstckmbl{
      width: 15%;
      float: left;
    }
    .totabsspa{
      width: 76%;
      position: unset;
      float: left;
    }
    .affirdictotl{
      position: unset;
    }
    .alllocstck{
      text-align: left;
      margin-top: 11px;
    }
  .pgnewstvkpg{
  width: 9%;
  }
  .pgnewstvkpgdata{
    width: 91%;
    }
    .imgmblstckmng{
      margin-right: 5px !important;
    }
    .updated_spnhis{
      font-size: 8px;;
    }
    .lasthist{
      bottom: -15px !important;
    }
    .stktogskmng{
      width: 100%;
    }
    .stcklblmng{
      width: 31%;
      float: left;
      text-align: left;
      margin-left: 0px;
    }
    .mismblstl{
      width: 9%;
      float: left;
    }
    .inptstckmng{
      width: 35%;
      float: left;
      margin-left: -1px;
    }
    .mnsinptstckmng{
      float: left;
      width: 13%;
      text-align: left;
    }
    .uommblstvkmn{
  width: 5px !important;
  float: left;
    }
    .idrseacbnhha{
      top: -26px !important;
    }
    .newteamsup{
      height: 39px;
      width: 100%;
    }
    .newteamloc{
      height: 39px;
      width: 100%;
      margin-bottom: 8px;
    }
    .clasfrosercbh{
      width: 100% !important;
    }
    .btnjugarser{
      top: 0px !important;
      right: 20px !important;
    }
    .newjukan{
      margin-left: -5px !important;
      margin-right: 10px;
    }
    .mvetbtnfoonly{
      margin-bottom: 6px;
    }
    .newclassheavjug{
      padding-right: 0px;
      padding-left: 9px;
      margin-right: 8px;
    }
  }
  @media (min-width: 320px) and (max-width: 360px){
    .updated_spnhis {
      font-size: 7px;
  }
  .mismblstl {
    /* width: 12%; */
    float: left;
    text-align: left;
  }
  }
  @media (min-width: 320px) and (max-width: 768px){
    .order_Detail_calculations{
      width: 420px !important;
    }
    .inptstckmng {
      margin-left: 0px !important;
  }
  }
  @media (min-width: 320px) and (max-width: 440px){
    .mismblstl {
      width: 10%;
      float: left;
  }
  }
  @media (min-width: 320px) and (max-width: 390px){
    .mismblstl {
      width: 11%;
      float: left;
  }
  }
  @media (min-width: 320px) and (max-width: 350px){
    .mismblstl {
      width: 12%;
      float: left;
  }
  }




  /* Style the tab */
  .tab {
    overflow: hidden;
    padding: 40px;
    padding-top: 0px;
    padding-bottom: 0;
    margin-top: 35px;
  }

  /* Style the buttons inside the tab */
  .tab button {
    background-color: #e9ecef;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 14px 16px;
    transition: 0.3s;
    font-size: 14px;
    border: 1px solid #d5d5d5;
    padding: 8px 18px;
    font-size: 12px;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    font-weight: 500 !important;
    color: black;
  }

  /* Change background color of buttons on hover */
  .tab button:hover {
  }

  /* Create an active/current tablink class */
  /* Style the tab content */
  .tabcontent {
    display: none !important;
    padding: 6px 12px;
    border: 1px solid #ccc;
    border-top: none;
  }
    .mediaosedit{
      transform: scale(1.3);
      margin-right: 5px;
    }
    .yamadsd{
      color: hsl(0deg 0% 67%);;
      font-size: 12px;
    }
    .opdacitnot{
      background: hsl(347deg 100% 96%);;
      opacity: 16;
      padding: 0px 5px 2px 5px;;
    }
    .ftnszxdtenpx{
      font-size:10px !important;
    }
    .tab button.active {
      background-color: #14baea ;
      color: white;
      font-weight: 600 !important;
      border: 1px solid #14baea  !important;
      border-top-right-radius: 10px;
      border-top-left-radius: 10px;
    }
    .borcustmkl{
    border: 1px solid #d7d7d7;
    padding: 25px;
    border-top: 4px solid #14baea;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    }
    .zrmtopadinre{
      padding-top: 0px !important;
      padding-right: 80px !important;
    }
    .nejdfihgfi{
      padding-top: 50px !important;
    }
    .supptab{
      margin-right: 11px !important;
    }
    .dasportxt{
      font-size: 15px;
      font-weight: 500;
    }
    .zrmtopadinre{
      min-height: auto !important;
    }
    .clkhereons{
      text-decoration: underline;
      font-weight: 600;
      cursor: pointer;
    }
    .clkhereons:hover{
      text-decoration: underline;
    }
    .addnewhere{
      color: blue;
      cursor: pointer;
    }
    ul.chosen-choices {
      background-image: unset !important;
      padding: 5px 5px !important;
      border: 1px solid #dee2e6 !important;
    }
    .newwidforbotj{
      width: 170px;
    }
    .nowordernext{
      margin: 0 !important;
    }
    .nmepurendthe {
      position: absolute;
      top: -47px;
      left: 33px;
      font-size: 11px;
      color: #a3a3a3;
  }
  .seconlightcol,.seconlightcol:hover{
    background-color: #9ca2a8;
    border-color: #9ca2a8;
  }
  .createneworder,.createneworder:hover{
    background-color: #00c4cc;
    background: #00c4cc;
    color: white !important;
    /* text-transform: uppercase; */
    border-radius: 21px;
    /* font-weight: bold;. */
    border: 2px solid;
    margin-top: -5px;
    font-size: 13px;
  }
  .nesmallersearch{
    height: 34px;
  }
  .smallerbtnsearch{
    padding: 4px 11px;
  }
  .brrdiouend{
    border-radius: 3px;
  }
  .deleteddiv_updqated_crdorg {
    padding-top: 31px;
    background: #eb1025;
    position: absolute;
    width: 6%;
    top: 0px;
    right: 1px;
    font-size: 15px;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}
.deleteddiv_updqated_crdorg::before {
  position: absolute;
  content: "";
  width: 0;
  height: 0;
  border-top: 12px solid #eb1025;
  border-left: 7px solid transparent;
  right: -8px;
  top: 27px;
  border-radius: 6px;
}

.deleteddiv_updqated_crdorg::after {
  position: absolute;
  content: "";
  width: 8px;
  height: 31px;
  right: -8px;
  top: 0;
  font-size: 18px;
  background: #eb1025;
  border-top-right-radius: 4px;
}
.deletedupdated_spn{
  position: absolute;
  top: 5px;
  right: 10px;
  color: white;
}
.mockbyfahd{
  position: relative;
  padding-left: 14px;
  width: 34%;
}
.newprogrpfhd{
  margin-left: auto;
  padding-right: 14px;
  width: 34%;
}
.frthfnsze{
  font-size: 12px;
}
.custompaginationrel ul.pagination {
  position: absolute;
  top: -3px;
  left: 20px;
}
.margin_count_btnkm
{
  margin-bottom: 20px !important;
}
.custompaginationrel {
  position: relative;
  padding: 15px;
  overflow: hidden;
}
.trhochpeo{
  width: 750px;
  margin-left: 65px;
  margin-top: 90px;
}
.mordropwithkrt{
  width: 700px;
  margin-top: 215px !important;
}
.heretxtforpop{
  color: blue !important;
  text-decoration: underline !important;
  cursor: pointer;
}
.purchezlogtxt{
  font-size: 28px;
}
.mngprorbt{
  font-size: 13px;
  font-weight: 500 !important;
}
.newilusomgad{
  height:40%;
  background: white;
  border-right: 2px solid #aeacac;
}
.alligncen{
  text-align: center;
}
.widthforluus{
  width: 348px;
}
.lablelsofextfields{
  font-size: 15px;
  font-weight: 500 !important;
}
.txtboxeslogsign{
  border-radius: 11px;
  border: 1px solid #aeacac;
  height: 32px;
}
.sqbhtkl{
  border-right: 2px solid #aeacac !important;
  background: rgb(255 255 255) !important;
  height:60% !important;
}
.pddingpot{
  color: black;
  padding-top: 50px;
}
.txt-alligncen{
  text-align: center;
}
.husgetprh{
  color: black;
  padding-top: 50px;
}
.brdfghjklop{
  border-radius: 18px;
}
.lgomyplsc{
  width: 70%;
  margin-bottom: 5px;
}
.quesstpzub{
  width: 5%;
  margin-top: -2px;
}
.additspan{
  color: #938a8a;
  font-size: 15px;
}
.snooze_order{
  color: white !important;
  padding: 6px 30px;
  background-color: #ff7f27 !important;
}
.snooze_order:focus{
  color: white;
}
.snooze_order:hover{
  color: white;
}








.check_all_checkpop{
  margin-top: 0px !important;
  padding-left: 18px !important;
  font-size: 30px;
  margin-bottom: 0px !important;
}
.check_all_checkpop{
  margin-top: 5px;
  padding-left: 30px;
  font-size: 30px;
  margin-bottom: 25px;
}
.add_checkbox_purcacelpop input {
  padding: 0;
  height: initial;
  width: initial;
  margin-bottom: 0;
  display: none;
  cursor: pointer;
}
.checkbox-labelnewpop {
  display: block;
  position: relative;
  margin: auto;
  cursor: pointer;
  font-size: 22px;
  line-height: 24px;
  height: 24px;
  width: 24px;
  clear: both;
}

.checkbox-labelnewpop input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

.checkbox-labelnewpop .checkbox-customnewpop {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 24px;
  width: 24px;
  background-color: transparent;
  border-radius: 5px;
  transition: all 0.3s ease-out;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  border: 2px solid #000;
}


.checkbox-labelnewpop input:checked ~ .checkbox-customnewpop {
  background-color: black;
  border-radius: 5px;
  -webkit-transform: rotate(0deg) scale(1);
  -ms-transform: rotate(0deg) scale(1);
  transform: rotate(0deg) scale(1);
  opacity:1;
  border: 2px solid #000;
}
.checkbox-labelnewpop input:indeterminate ~ .checkbox-customnewpop {
  background-color: black;
  border-radius: 5px;
  -webkit-transform: rotate(0deg) scale(1);
  -ms-transform: rotate(0deg) scale(1);
  transform: rotate(0deg) scale(1);
  opacity:1;
  border: 2px solid #000;
}
.checkbox-labelnewpop .checkbox-customnewpop::after {
  position: absolute;
  content: "";
  left: 12px;
  top: 12px;
  height: 0px;
  width: 0px;
  border-radius: 5px;
  border: solid #000;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(0deg) scale(0);
  -ms-transform: rotate(0deg) scale(0);
  transform: rotate(0deg) scale(0);
  opacity:1;
  transition: all 0.3s ease-out;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
}


.checkbox-labelnewpop input:checked ~ .checkbox-customnewpop::after {
-webkit-transform: rotate(45deg) scale(1);
-ms-transform: rotate(45deg) scale(1);
transform: rotate(45deg) scale(1);
opacity:1;
left: 8px;
top: 3px;
width: 6px;
height: 12px;
border: solid white;
border-width: 0 2px 2px 0;
background-color: transparent;
border-radius: 0;
}
.checkbox-labelnewpop input:indeterminate ~ .checkbox-customnewpop::after {
-webkit-transform: rotate(45deg) scale(1);
-ms-transform: rotate(45deg) scale(1);
transform: rotate(89deg) scale(1);
opacity:1;
left: 8px;
top: 3px;
width: 6px;
height: 12px;
border: solid white;
border-width: 0 2px 0px 0;
background-color: transparent;
border-radius: 0;
}
/*head checkbox*/


.checkbox-labelnewheadpop {
  display: block;
  position: relative;
  margin: auto;
  cursor: pointer;
  font-size: 22px;
  line-height: 24px;
  height: 24px;
  width: 24px;
  clear: both;
}

.checkbox-labelnewheadpop input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

.checkbox-labelnewheadpop .checkbox-customnewheadpop {
  position: absolute;
  top: 3px;
  left: 0px;
  height: 24px;
  width: 24px;
  background-color: transparent;
  border-radius: 5px;
  transition: all 0.3s ease-out;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  border: 2px solid white;
}


.checkbox-labelnewheadpop input:checked ~ .checkbox-customnewheadpop {
  background-color: black;
  border-radius: 5px;
  -webkit-transform: rotate(0deg) scale(1);
  -ms-transform: rotate(0deg) scale(1);
  transform: rotate(0deg) scale(1);
  opacity:1;
  border: 2px solid white;
}
.checkbox-labelnewheadpop input:indeterminate ~ .checkbox-customnewheadpop {
  background-color: black;
  border-radius: 5px;
  -webkit-transform: rotate(0deg) scale(1);
  -ms-transform: rotate(0deg) scale(1);
  transform: rotate(0deg) scale(1);
  opacity:1;
  border: 2px solid white;
}
.checkbox-labelnewheadpop .checkbox-customnewheadpop::after {
  position: absolute;
  content: "";
  left: 12px;
  top: 12px;
  height: 0px;
  width: 0px;
  border-radius: 5px;
  border: solid #000;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(0deg) scale(0);
  -ms-transform: rotate(0deg) scale(0);
  transform: rotate(0deg) scale(0);
  opacity:1;
  transition: all 0.3s ease-out;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
}


.checkbox-labelnewheadpop input:checked ~ .checkbox-customnewheadpop::after {
-webkit-transform: rotate(45deg) scale(1);
-ms-transform: rotate(45deg) scale(1);
transform: rotate(45deg) scale(1);
opacity:1;
left: 8px;
top: 3px;
width: 6px;
height: 12px;
border: solid white;
border-width: 0 2px 2px 0;
background-color: transparent;
border-radius: 0;
}
.checkbox-labelnewheadpop input:indeterminate ~ .checkbox-customnewheadpop::after {
-webkit-transform: rotate(45deg) scale(1);
-ms-transform: rotate(45deg) scale(1);
transform: rotate(89deg) scale(1);
opacity:1;
left: 7px;
top: 3px;
width: 6px;
height: 12px;
border: solid white;
border-width: 0 2px 0px 0;
background-color: transparent;
border-radius: 0;
}



/* new checkbox mbl */
.checkbox-labelnewmblpop {
  display: block;
  position: relative;
  margin: auto;
  cursor: pointer;
  font-size: 22px;
  line-height: 18px;
  height: 18px;
  width: 24px;
  clear: both;
}

.checkbox-labelnewmblpop input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

.checkbox-labelnewmblpop .checkbox-customnewmbl {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 18px;
  width: 18px;
  background-color: transparent;
  border-radius: 5px;
  transition: all 0.3s ease-out;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  border: 2px solid #000;
}


.checkbox-labelnewmblpop input:checked ~ .checkbox-customnewmblpop {
  background-color: black;
  border-radius: 5px;
  -webkit-transform: rotate(0deg) scale(1);
  -ms-transform: rotate(0deg) scale(1);
  transform: rotate(0deg) scale(1);
  opacity:1;
  border: 2px solid #000;
}
.checkbox-labelnewmblpop input:indeterminate ~ .checkbox-customnewmblpop {
  background-color: black;
  border-radius: 5px;
  -webkit-transform: rotate(0deg) scale(1);
  -ms-transform: rotate(0deg) scale(1);
  transform: rotate(0deg) scale(1);
  opacity:1;
  border: 2px solid #000;
}
.checkbox-labelnewmblpop .checkbox-customnewmblpop::after {
  position: absolute;
  content: "";
  left: 12px;
  top: 12px;
  height: 0px;
  width: 0px;
  border-radius: 5px;
  border: solid #000;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(0deg) scale(0);
  -ms-transform: rotate(0deg) scale(0);
  transform: rotate(0deg) scale(0);
  opacity:1;
  transition: all 0.3s ease-out;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
}


.checkbox-labelnewmblpop input:checked ~ .checkbox-customnewmblpop::after {
-webkit-transform: rotate(45deg) scale(1);
-ms-transform: rotate(45deg) scale(1);
transform: rotate(45deg) scale(1);
opacity:1;
left: 4px;
top: 1px;
width: 6px;
height: 10px;
border: solid white;
border-width: 0 2px 2px 0;
background-color: transparent;
border-radius: 0;
}
.checkbox-labelnewmblpop input:indeterminate ~ .checkbox-customnewmblpop::after {
-webkit-transform: rotate(45deg) scale(1);
-ms-transform: rotate(45deg) scale(1);
transform: rotate(89deg) scale(1);
opacity:1;
left: 5px;
top: 1px;
width: 4px;
height: 11px;
border: solid white;
border-width: 0 2px 0px 0;
background-color: transparent;
border-radius: 0;
}
.frhundtxlop{
  width: 400px;
}
.popcheckissue{
  width:4%;
  margin-top: 30px;
  float:left;
}
.poscndghhqbaj{
  width:96%;
}
.pororderdetils{
  width: unset !important;
}
.evitcassslc{
  min-width: 54px;
  max-width: 54px;
}
.addaddspan{
  font-size: 13px;
  color: #898484;
}
.spnimgadd{
  width: 5%;
}
@media(min-width: 320px) and (max-width: 768px){
  .ratingprovided{
    font-size: 14px !important;
  }
  .ratethisitem{
    margin-left: 0px !important;
    font-size: 14px !important;
  }
  .rate:not(:checked) > label {
    font-size:24px !important;
}
  .mbl_hidednewclass{
    display: none !important;
  }
  .roeformblwrabcls{
    flex-wrap: unset;
  }
  .social_icons_purchezrz{
    right: 25px !important;
    top: 10px;
  }
  .flioporec{
    font-size: 10px !important;
  }
  .snooze_orderpos{
    right: 149px;
    padding: 6px 12px;
  }
  .pororderdetils{
    width: unset;
  }
  .poscndghhqbaj{
    width:91%;
    float: right;
  }
  .popcheckissue{
    width:5%;
    margin-top: 30px;
    float:left;
  }
  .zrmtopadinre{
    padding-left: 35px !important;
    padding-right: 35px !important;
  }
  .uppertabs{
    padding-left: 35px !important;
  }
  .frhundtxlop{
    width: 300px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) !important;
  }
  .mblpopclskng{
    width: 100%;
  }
  .likebtnopernd{
    top: -14px !important;
    right: 1px !important;
    padding: 9px 9px 6px !important;
    width: 18% !important;
  }
  .cahmockbyfjkl{
    width: 60%;
  }
  .popcheckissue{
    margin-left: 2px;
  }
  .autohidenflowov{
    overflow: hidden;
  }
}
.zeroselectclass{
  font-size: 14px;
  line-height: 3.7;
}
.additonalitemspnfloatr{
  font-size: 11px;
  float: right;
  margin-right: 5px;
}
.spnimgaddpop{
  width: 9%;
  float: right;
}
.kamiuthor{
  margin-bottom: 10px;
}
.abspoiub{
  position: absolute;
  right: 11px;
  bottom: -11px;
}
.ratethisitem{
  margin-top: 10px;
  color: #999;
  font-size: 1em;
  margin-left: 120px;
}
.ratingprovided{
  margin-top: 11px;
  color: #999;
  font-size: 1em;
  float: left;
}
.floatrightended{
  float: unset !important;
}
.edittngor{
  margin-top: 7px;
  margin-left: 10px;
  background: #00c4cc;
  padding: 4px 9px;
  cursor: pointer;
}
.penciliconcus{
  color: white;
}



/* css for starts  */
.rate {
    float: left;
    height: 46px;
    padding: 0 10px;
}
.rate:not(:checked) > input {
    position:absolute;
    left:-9999px;
}
.rate:not(:checked) > label {
    float:right;
    width:1em;
    overflow:hidden;
    white-space:nowrap;
    cursor:pointer;
    font-size:30px;
    color:#ccc;
}
.rate:not(:checked) > label:before {
    content: '★ ';
}
.rate > input:checked ~ label {
    color: #ffc700;
}
.rate:not(:checked) > label:hover,
.rate:not(:checked) > label:hover ~ label {
    color: #deb217;
}
.rate > input:checked + label:hover,
.rate > input:checked + label:hover ~ label,
.rate > input:checked ~ label:hover,
.rate > input:checked ~ label:hover ~ label,
.rate > label:hover ~ input:checked ~ label {
    color: #c59b08;
}









/* new mbl design */
@media (min-width: 320px) and (max-width: 768px)
{
  .dfrthuiop{
    background: #00c4cc;
    color: white;
    border-radius: 25px;
    border: 1px solid #00c4cc;
    padding: 5px 54px;
    font-weight: 500 !important;
  }
  .mricllohjkio{
    width: 100%;
    text-align: center;
  }
  .newclsflikjlft{
    margin-left: auto;
  }
  .mrgtopjatsja{
    margin-top: 5px !important;
  }
  .whitspcnowrp{
    white-space: nowrap;
    font-size: 11px !important;
  }
  .whpsmtklfd{
    font-size: 11px !important;
  }
  .top_mainmblui{
    width:100%;
    margin: 0;
    padding: 9px;
  }
  .uppdivpropseder{
    width: 50%;float: left;margin-top: 5px;
  }
  .dwndiverpros{
    width:100%;font-size: 14px;
  }
  .spnforimgpros{
    float: left;margin-right: 8px;
  }
.prosrndedimg{
  width:32px;border-radius: 50%;
}
.blckcolorcls{
  color: black;
}
.whitespcenowrepcls{
  white-space: nowrap;
}
.cssbtnlkij{
  float:right;width:50%;
}
.upplitsscls{
  width:100%;font-size: 11px;display: flex;
}
.cntrcnclbtn{
  text-align: center;float:left;
}
.addcssbtnkilj{
  padding:unset;background-color:unset !important;
}
.snztimbtns{
  text-align: center;;margin-left: 20px;
}
.dleivbntsts{
  width:100%;font-size: 13px;background: black;overflow: hidden;padding-top: 20px;padding-bottom: 20px;padding-left: 14px;padding-right: 20px;
}
.wfitlotteft{
  width:50%;float:left;
}
.idorderfirsdivhiadd{
  color:white;font-weight: bold;margin-bottom: 4px;
}
.clrmbbootmrg{
  color: orange;margin-bottom: 4px;
}
.clitoprdfg{
  color: white;margin-bottom: 4px;
}
.fltghtthenwitd{
  float: right;width: 50%;
}
.osduelss{
  color: white;
}
.ynapmcoiiu{
  color: white;font-weight: bold;
}
.tsujnigram{
  margin-left: 4px;
}
.wifdifflitghq{
  width:32px;border-radius: 50%;
}
.mbtnvlaidttestqa{
  width:100%;padding: 9px !important;overflow: hidden;font-size: 13px;
}
.randdtuiovb{
  width:6%;float:left;margin-left: 5px;margin-top: 10px;
}
.jstinblock{
  display:inline-block;
}
.nbmaticonbkl{
  background: #edecec !important;
}
.samewirthbnjjo{
  width:18%;float:left;text-align: center;
}
.moeesarmranf{
  font-size: 12px;color: grey;
}
.indedisplaseptr{
  display: inline-block;
}
.missongjklodhg
{
  width:100%;border: 2px solid white;margin-top: 6px;padding: 8px;border-radius: 4px;display:flex;
}
.pricmaindivtabs{
  width: 94%;overflow: hidden;border: 2px solid #d9d9d9;border-radius: 3px;padding: 6px;    margin-left: 16px;margin-top: 10px;
}
.sperttabslpirc{
  width:33%;float:left;border-right: 2px solid #ddd9d9;
}
.sunzrhjil{
  width: 33%;
  float: left;
}
.txtcentyuio{
text-align: center;
}
.prgsttotaltab{
  font-weight:bold;text-align: center;
}
.dhanaiman{
  width: 98%;padding:9px;margin-left: 6px;
}
.kamsearchtxt{
  width: 88%;height: 50px;border-radius: 4px;border: 1px solid #f6f6f6;background: #edecec;float:left;
}
.clsforcusbtnck{
  height: 50px;width: 12%;border:none;background: #00c4cc;
}
.whtsconbacklor{
  color: white;
}
.mardghfvty{
  margin-bottom: 15px;
}
.proscrdyuo{
  padding-top:25px;background:#f4f4f4;overflow:hidden;margin-left: 14px;margin-right: 14px;
}
.wiflexhuper{
  width: 100%;display:flex;
}
.chkboxrtop{
  margin-left: 14px;float: left;
  display: flex;
}
.whitespace-nowrap{
  white-space:nowrap;
}
.tiyuposvbnml{
  float: left;margin-right:10px;margin-top: -4px;
}
.shadowpluschk{
  background:white;box-shadow: rgb(100 100 111 / 61%) 0px 7px 29px
}
.imfproscodeag{
  max-width: 80px;min-width: 80px;height: 80px;margin-right: 15px;
}
.ornameuimblcuss{
  font-weight: 600;
  font-size:9px;
  color: black;
}
.smlforprocide{
  font-weight: 600;color: #959393;font-size: 12px;
}
.decbtnforquant{
  margin-right: -4px;border: none;min-height: 34px;
                     min-width: 40px;border-top-left-radius: 8px;border-bottom-left-radius: 8px;background: #00c4cc;color:white;
                     font-size: 17px;font-weight: 700;
}
.qunboxcssinln{
  max-width: 60px;min-height: 34px;
                     border: 1px solid transparent;text-align: center;outline:none;
}
.incremnclsoip{
  margin-left: -4px;border: none;min-height: 34px;
                     min-width: 40px;border-top-right-radius: 8px;border-bottom-right-radius: 8px;background: #00c4cc;color:white;
                     font-size: 17px;font-weight: 700;
}
.rmvioprostitle{
  min-width: 40px;height: 38px;
}
.ratingupperdips{
  overflow: hidden;background:#ebebeb;margin-top: 14px;
}
.ratingdwnhjkopp{
  margin-left:14px;width:100%;padding-top: 14px;
}
.rtthiopui{
  font-size: 15px;color: black;margin-left:30px;
}
.samefordoswant{
  width:100%;padding-top: 14px;
  overflow: hidden;
  display: flex;
}
.scnsameforcountr{
  margin-left: 14px;padding-top: 16px;padding-bottom: 16px;float: left;
}
.exctydotounwn{
  font-size: 15px;color: black;margin-left:30px;
}
.slidedwnarrow{
  float: right;margin-top: 15px;
}
.arrqoinhgjkl{
  min-width: 40px;height: 38px;
}
.wifgthdfjk{
  width:100%;display:flex;
}
.autkjkdshk{
  margin-left: 14px;float: left;width: 40%;margin-top: 7px;
}
.mxstckdivond{
  width:100%;display:flex;margin-top: 12px;padding-bottom: 10px;
}
.lvpisokasd{
  margin-left: 14px;padding-top: 14px;padding-bottom: 16px;float: left;width: 40%;margin-top: 5px;
}
.jusgfuie{
  padding-top: 14px;
}
.quntitymbslopp{
  max-width: 100px;min-height: 34px;
                     border: 1px solid transparent;text-align: center;outline:none;
}
.classbtnoprend{
  margin-left: -4px;border: none;min-height: 34px;
                                       min-width: 40px;background: #00c4cc;color:white;
                                       font-size: 17px;font-weight: 700;
                                       border-top-right-radius: 8px;
                                       border-bottom-right-radius: 8px;
}
.penccuscssfont{
  padding: 4px 2px;
}
.notesmblwow{
  width:100%;overflow: hidden;
}
.nonmsoomkh{
  margin-left: 14px;padding-top: 16px;padding-bottom: 16px;float: left;
}
.fltrghnotes{
  float: right;margin-top: 7px;
}
.dwnimgotpot{
  min-width: 40px;height: 38px;
  margin-top: 7px;
}
.clsoprfxhper{
  width:100%;display:flex;
}
.wiopertyya{
  margin-right: 40px;margin-left: 58px;float: left;width: 100%;margin-top: 7px;
}
.txtreawotpme{
  width: 100%;width: 100%;border: none;border-radius: 7px;
                     padding: 8px;
}
.custyutgri{
  width: 50px;
}
.bacjwrtsstig{
  background:#fff !important;
}
}
.bacjwrtsstig{
  background:#f8f8f8;
}
.fieldnewbtn{
    position: absolute;
    color: white;
    right: 20px;
    font-size: 26PX;
    border: none;
    padding: 2px 12px;
    background: #00c4cc;
}
.tstmnghjkk{
    margin-bottom: 10px;
}
div#loom-companion-mv3 {
    display: none;
}
.newtjusur{
  justify-content: end;
    align-items: center;
    display: flex;
    margin-left: auto;
    float: right;
}


.card-body.toggle_main_order{
    display: flex;
    flex-direction: column;
    gap: 30px;
}
.action-button-groups{
    position: absolute;
    top: 7px;
    right: 20px;
    border-left: 1px solid #80808073;
    padding: 0px 10px 0px 15px;
    display: flex;
    gap: 20px;
    border-radius: 1px;
}
.action-button-groups button{
    border: none;
    padding: 0px !IMPORTANT;
}
.action-button-groups button:nth-child(2) {
    color: red !important;
}
.action-button-groups button:hover{
  color: unset !important;
  background-color: unset !important;
}

.action-button-groups button:focus {
box-shadow: unset !important;
}