    
    body {

        background-image: URL('/img/bg.gif');
        background-attachment: fixed;
    }

    .main_div1 {

        padding-bottom:50px;

    }

    .main_div2 {

        padding:0px 0px 0px 0px; 
        border-right: 5px solid #D4D4D4;
        float: left;
    }

    .main_div31 {

        padding:0px 10px 10px 0px; 
        border-bottom: 5px solid #D4D4D4;
        float: left;
        width: 100%;
    }

    .main_div32 {

        padding:25px 10px 10px 0px; 
        border-bottom: 5px solid #D4D4D4;
        float: left;
        width: 100%;
    }

    .main_div33 {

        padding:0px 10px 10px 0px; 
        border-bottom: 5px solid #D4D4D4;
        float: left;
        width: 100%;
    }

    .main_div4 {

        padding:0px 0px 0px 0px; 
        float: left;
    }

    .main_div41 {

        padding:0px 10px 10px 0px; 
        float: left;
        width: 100%;
    }

    .hdr_h4 {

        margin-top: 0px; 
        color:#09C;

    }

    .hdr_href {

        float: right;

    }

    .hdr_font {

        font-size: 16px;

    }

    .hdr_span {

        float: right; 
        margin-right: 10px; 
        font-size: 12px; 
        color: #4A4A4A; 
        padding: 5px;

    }

    .div_cms2 {

        /*box-shadow: 1px 2px 3px 1px #999999; 
        border-radius: 0px;*/ 
        border:1px solid #C2C2C2;
        border-radius: 5px;

    }

    .div_cms5 {

        color: #2F4F4F;

    }

    .div_cms6 {

        height: 48px;
        color: #2F4F4F;

    }

    .div_cms7 {

        font-size: 20px;
        color:#FFF;
        text-shadow: 1px 1px #969696;

    }

    .div_cms8 {

        font-size: 14px;

    }

    .div_cms_renewal {

        /*box-shadow: 1px 2px 3px 1px #999999; 
        border-radius: 0px;*/ 
        border:1px solid #C2C2C2;
        border-radius: 5px;
        background-image: linear-gradient(to right, #FFF, #8470FF);

    }

    .div_cms_redem {

        /*box-shadow: 1px 2px 3px 1px #999999; 
        border-radius: 0px;*/ 
        border:1px solid #C2C2C2;
        border-radius: 5px;
        background-image: linear-gradient(to right, #FFF, #6495ED);

    }

    .div_cms_sales {

        /*box-shadow: 1px 2px 3px 1px #999999; 
        border-radius: 0px;*/ 
        border:1px solid #C2C2C2;
        border-radius: 5px;
        background-image: linear-gradient(to right, #FFF, #43CD80);

    }

    .div_cms_inv {

        /*box-shadow: 1px 2px 3px 1px #999999; 
        border-radius: 0px;*/ 
        border:1px solid #C2C2C2;
        border-radius: 5px;
        background-image: linear-gradient(to right, #FFF, #DA70D6);

    }

    .div_cms_loan {

        /*box-shadow: 1px 2px 3px 1px #999999; 
        border-radius: 0px;*/ 
        border:1px solid #C2C2C2;
        border-radius: 5px;
        background-image: linear-gradient(to right, #FFF, #EE7942);

    }

    .div_cms_notif {

        /*box-shadow: 1px 2px 3px 1px #999999; 
        border-radius: 0px;*/ 
        border:1px solid #C2C2C2;
        border-radius: 5px;
        background-image: linear-gradient(to right, #FFF, #9ACD32);

    }

    .div_mos_notif {

        border:1px solid #C2C2C2;
        border-radius: 5px;
        background-image: linear-gradient(to right, #FFF, #778899);
        /*background-image: linear-gradient(to right, #FFF, #A2B5CD);*/

    }

    .div_gl_overview {

        /*box-shadow: 1px 2px 3px 1px #999999; 
        border-radius: 0px;*/ 
        border:1px solid #C2C2C2;
        border-radius: 5px;
        background-image: linear-gradient(to right, #FFF, #33A1C9);

    }

    .div_gl_balance {

        /*box-shadow: 1px 2px 3px 1px #999999; 
        border-radius: 0px;*/ 
        border:1px solid #C2C2C2;
        border-radius: 5px;
        background-image: linear-gradient(to right, #FFF, #4682B4);

    }

    .div_am_notif {

        /*box-shadow: 1px 2px 3px 1px #999999; 
        border-radius: 0px;*/ 
        border:1px solid #C2C2C2;
        border-radius: 5px;
        background-image: linear-gradient(to right, #FFF, #5F9EA0);

    }


    .new_notif {

        font-weight: bold; 
        color: #424242;
    }

    .div_qf1 {

        width: 12vw;
        float: left;
        padding: 5px 0px 5px 15px;
    }

    .div_qf2 {

        /*box-shadow: 1px 2px 3px 1px #999999; 
        border-radius: 0px;*/ 
        border:1px solid #C2C2C2;
        border-radius: 5px;
        background-color: #FAFAFA;

    }

    .div_qf3 {

        height: 200px;

    }
    
    .div_qf5 {

        color: #3D3D3D; 
        text-align: center; 
        padding-top: 10px;

    }

    .div_qf6 {

        color: #545454; 
        text-align: center; 
        padding-top: 10px; 
        height: 50px; 
        font-size: 14px;

    }

    .icon_report {

        color: #AB82FF;

    }

    .icon_master {

        color: #09C;
        
    }

    .icon_import {

        color: #FF6A6A;
        
    }

    .href_act_qf {

        /*border: 2px solid #458B00;*/
        color:#458B00;

    }

    .href_rep_qf {

        /*border: 2px solid #473C8B;*/
        color:#473C8B;
        
    }

    .href_tbl_qf {

        /*border: 2px solid #104E8B;*/
        color:#104E8B;
        
    }

    .href_set_qf {

        /*border: 2px solid #2F4F4F;*/
        color:#2F4F4F;
        
    }

    .href_import_qf {

        /*border: 2px solid #DC143C;*/
        color:#DC143C;
        
    }

    .href_monitor_qf {

        /*border: 2px solid #EE4000;*/
        color:#EE4000;
        
    }

    .href_history_qf {

        /*border: 2px solid #CDCD00;*/
        color:#CDAD00;
        
    }

    .href_control_qf {

        /*border: 2px solid #483D8B;*/
        color:#483D8B;
        
    }

    .div_qf7 {

        color: #4A4A4A; 
        text-align: center; 
        padding-top: 25px;

    }

    .div_control2 {

        /*box-shadow: 1px 2px 3px 1px #999999; */
        border-radius: 0px; 
        background-color: #FFF;

    }

    .div_control3 {

        height: 200px;

    }
    
    .div_control5 {

        color: #3D3D3D; 
        text-align: center; 
        padding-top: 10px;

    }

    .div_control6 {

        color: #545454; 
        text-align: center; 
        padding-top: 10px; 
        height: 50px; 
        font-size: 16px;

    }

    .div_control7 {

        color: #4A4A4A; 
        text-align: center; 
        padding-top: 5px;

    }

    .div_fin4 {

        padding: 0px;

    }

    .div_fin_span {

        color: #FFF;
        font-weight: bold;
        
    }

    .profit_head {

        padding: 8px 10px 8px 15px;
        background-image: linear-gradient(to right, #FFF, #4682B4);

    }

    .profit1 {

        padding: 8px 10px 8px 15px;
        background-image: linear-gradient(to right, #FFF, #EDEDED, #7D9EC0);

    }

    .profit2 {

        padding: 8px 10px 8px 15px; 
        background-image: linear-gradient(to right, #FFF, #7D9EC0);
        
    }

    .online_head {

        padding: 8px 10px 8px 15px;
        background-image: linear-gradient(to right, #FFF, #5F9EA0);

    }

    /*MAIN DASHBOARD*/

    .main_dash_panel {

        /*box-shadow: 1px 2px 3px 1px #999999; 
        border-radius: 0px; */
        border:1px solid #C2C2C2;
        border-radius: 5px;
        background-color: #fff;

    }

    .main_dash_body {

        height: 250px;

    }
    
    .main_dash_icon1 {

        color: #4682B4; 
        text-align: center; 
        padding-top: 0px;

    }

    .main_dash_icon2 {

        color: #858585; 
        text-align: center; 
        padding-top: 0px;

    }

    .main_dash_icon3 {

        color: #EEA2AD; 
        text-align: center; 
        padding-top: 0px;

    }

    .main_dash_title {

        color: #000; 
        text-align: center; 
        padding-top: 10px; 
        height: 50px; 
        font-size: 20px;

    }

    .main_dash_active {

        color: #545454; 
        text-align: center; 
        padding-top: 10px; 
        height: 50px; 
        font-size: 14px;

    }

    .main_dash_avail {

        color: #32CD32;
        text-align: center; 
        padding-top: 15px; 
        height: 50px; 
        font-size: 14px;

    }

    .main_dash_button {

        color: #4A4A4A; 
        text-align: center; 
        padding-top: 0px;

    }

    .main_dash_footer {

        height: 40px;
        text-align: center;

    }

    .main_dash_btn_blue {

        border: 2px solid #27408B; 
        color:#27408B;

    }

    .main_dash_btn_red {

        border: 2px solid #DC143C; 
        color:#DC143C;
        
    }

    .main_dash_btn_black {

        border: 2px solid #000;
        color:#000;
        
    }

    .main_dash_header {

        text-transform: uppercase; 
        text-align: center; 
        color: #FFF; 
        font-weight: bold; 
        margin-top: 0px; 
        padding: 15px;
        background-image: linear-gradient(to left, #FFF, #104E8B, #FFF);
        border: 1px solid #C2C2C2;
        border-radius: 5px;
        text-shadow: 0px 2px #575757; 

    }

    .dash_title {

        padding: 10px 10px 10px 10px;
        background-image: linear-gradient(to right, #FFF, #C2C2C2, transparent);

    }

    .dash_title_cat {

        color: #4A4A4A;
        font-size: 14px;
    }

    /* width */
    ::-webkit-scrollbar {
      width: 10px;
      height: 10px;
    }

    /* Track */
    ::-webkit-scrollbar-track {
      box-shadow: inset 0 0 5px grey; 
    }
     
    /* Handle */
    ::-webkit-scrollbar-thumb {
      background: transparent; 
      border-radius: 10px;
      background-image: linear-gradient(120deg, #a1c4fd 0%, #c2e9fb 100%);
    }

    /* Handle on hover */
    ::-webkit-scrollbar-thumb:hover {
      background-image: linear-gradient(to top, #A2B5CD 0%, #6495ED 100%);
    }

    .navcon {

      height: 93vh; 
      overflow: hidden;

    }

    .navcon:hover {

      overflow: auto;

    }

    .app-footer {

        text-align: left; 
        left: 0px; 
        right: 0px; 
        bottom: 0px; 
        z-index: 1; 
        background-image: linear-gradient(to left, #FFF, #FFF, #104E8B);
        position: absolute;
        width: 100%; 
        font-family: arial;

    }

    .footer-right {

        font-weight: bold; 
        font-size: 11px; 
        color: #104E8B; 
        float: right;
        
    }

    .footer-left {
  
        font-size: 13px; 
        color: #FFF;
        
    }

    .page-container {

      position: relative;
      min-height: 100vh;

    }

    
    

