﻿
.page-header-custom {
    /*padding-bottom: 9px;
    margin: 40px 0 4px;*/
    border-bottom: 1px solid #eee;
}
a.coa:link {
    color: green;
    background-color: transparent;
    font-weight: bold;
    text-decoration: none;
}

a.coa:hover {
    color: red;
    background-color: transparent;
    font-weight: bold;
    text-decoration: underline;
}

/* C1 Masked Input */
.state-invalid {
    color: red
}

.wj-control * {
    margin-bottom: 0;
}
.wj-viewer .wj-pages-wrapper {
    display: inline-block;
    margin: 0px;
    float: left;
}
.wj-control * {
    margin: 0px;
    
}

    /* Flex Grid Styling*/
    .wj-flexgrid .wj-marquee, .wj-flexgrid .wj-header, .wj-flexgrid .wj-cell {
    transition: all .4s;
    /* want to play? -> http://cubic-bezier.com */
    transition-timing-function: cubic-bezier(.5,0,.5,1)
}
.wj-flexgrid {
    /*max-height: 585px;*/
    margin-bottom: 24px;
}
.wj-cell.high-value {
    font-weight: bold;
    color: green;
}

.wj-cell.low-value {
    font-weight: bold;
    font-style: italic;
    color: red;
}
.labelCustom {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 1px;
    margin-left:20px;
    font-weight: 700;
    /*color:darkred;*/
    /*text-decoration: underline;*/
}
.labelSubjectDetail {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 1px;
    margin-right: 20px;
    font-size:20px;
    font-weight: bold;
    color:darkred;
    /*text-decoration: underline;*/
}
/* css for hovering on non-header cells */
#fg .wj-cells .wj-cell:not(.wj-state-selected):not(.wj-state-multi-selected):hover {
    background-color: rgb(200,255,200);
    transition: all 0.5s;
}

/* css for hovering on non-header rows */
#hoverRow .wj-cells .wj-row:hover .wj-cell:not(.wj-state-selected):not(.wj-state-multi-selected) {
    transition: all 0.5s;
    background: rgb(200,255,200);
}
/* TreeView Styling*/
.wj-treeview {
    /*width: 500px;*/
    /*height: 350px;*/
    font-size: 120%;
    /*margin-top: 8px;*/
    margin-bottom: 8px;
    padding: 6px;
    background: #f0f0f0;
    box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
}

/* custom tree styles */
.chartOfAccount-tree.wj-treeview {
    color: #00415d;
}
    /* default nodes */
    .chartOfAccount-tree.wj-treeview .wj-node {
        /*border-bottom: 1px solid #a0a0a0;*/
        /*padding-left: 110px;
        margin-left: -100px;
        margin-right: -10px;*/
    }
    /* level 0 and deeper nodes */
    .chartOfAccount-tree.wj-treeview .wj-nodelist > .wj-node {
        font-size: 120%;
        font-weight: bold;
    }
    /* level 1 and deeper nodes (smaller font, vertical line along the left) */
    .chartOfAccount-tree.wj-treeview .wj-nodelist > .wj-nodelist > .wj-node,
    .chartOfAccount-tree.wj-treeview .wj-nodelist > .wj-nodelist > .wj-nodelist {
        color: #ac0101;
        font-weight: bold;
        font-size: 16px;
    }
        /* level 2 and deeper nodes (smaller font, thinner border) */
        .chartOfAccount-tree.wj-treeview .wj-nodelist > .wj-nodelist > .wj-nodelist > .wj-node,
        .chartOfAccount-tree.wj-treeview .wj-nodelist > .wj-nodelist > .wj-nodelist > .wj-nodelist {
            font-size: 14px;
            font-weight: bold;
            /*font-style: italic;*/
            /*opacity: 0.9;*/
            color: #029f5b;
            /*border-left: 2px solid #00415d;*/
            /*border-left: 2px solid rgba(128, 4, 77, 0.3);*/
        }

        /* level 3 and deeper nodes (smaller font, thinner border) */
            .chartOfAccount-tree.wj-treeview .wj-nodelist > .wj-nodelist > .wj-nodelist > .wj-nodelist > .wj-node,
            .chartOfAccount-tree.wj-treeview .wj-nodelist > .wj-nodelist > .wj-nodelist > .wj-nodelist > .wj-nodelist {
                font-size: 14px;
                font-weight: normal;
                color: #0026ff;
            }
    /* expanded node glyph */
    .chartOfAccount-tree.wj-treeview .wj-nodelist .wj-node .wj-node:before {
        content: "\e114";
        font-family: 'Glyphicons Halflings';
        top: 4px;
        border: none;
        opacity: .3;
        transition: all .3s cubic-bezier(.4,0,.2,1);
    }

    /* collapsed node glyph */
    .chartOfAccount-tree.wj-treeview .wj-nodelist .wj-node.wj-state-collapsed:before,
    .chartOfAccount-tree.wj-treeview .wj-nodelist .wj-node.wj-state-collapsing:before {
        transform: rotate(-90deg);
        transition: all .3s cubic-bezier(.4,0,.2,1);
        /*transition: all .3s cubic-bezier(.4,0,.2,1);*/
    }

    /* level 0 selected node */
    .chartOfAccount-tree.wj-treeview .wj-node.wj-state-selected {
        color: white;
        background: #00415d;
        /*background: rgba(128, 4, 77, 0.70);*/
    }
    /* level 1 Selected node */
    .chartOfAccount-tree.wj-treeview .wj-nodelist .wj-nodelist .wj-node.wj-state-selected {
        color: white;
        background: #ff0000;
        /*background: rgba(128, 4, 77, 0.70);*/
    }
    .chartOfAccount-tree.wj-treeview .wj-nodelist .wj-nodelist .wj-nodelist .wj-node.wj-state-selected {
        color: white;
        background: #029f5b;
        /*background: rgba(128, 4, 77, 0.70);*/
    }
    .chartOfAccount-tree.wj-treeview .wj-nodelist .wj-nodelist .wj-nodelist .wj-nodelist .wj-node.wj-state-selected {
        color: white;
        background: #53A3CD;
        /*background: rgba(128, 4, 77, 0.70);*/
    }

/* custom tree styles */
.custom-tree.wj-treeview {
    color: #00415d;
}

    /* default nodes */
    .custom-tree.wj-treeview .wj-node {
    }

    /* level 0 and deeper nodes */
    .custom-tree.wj-treeview .wj-nodelist > .wj-node {
        font-size: 120%;
        font-weight: bold;
    }

    /* level 1 and deeper nodes (smaller font, vertical line along the left) */
    .custom-tree.wj-treeview .wj-nodelist > .wj-nodelist > .wj-node,
    .custom-tree.wj-treeview .wj-nodelist > .wj-nodelist > .wj-nodelist {
        font-size: 110%;
        font-weight: normal;
        border-left: 4px solid #00415d;
        /*border-left: 4px solid rgba(128, 4, 77, 0.3);*/
    }

        /* level 2 and deeper nodes (smaller font, thinner border) */
        .custom-tree.wj-treeview .wj-nodelist > .wj-nodelist > .wj-nodelist > .wj-node,
        .custom-tree.wj-treeview .wj-nodelist > .wj-nodelist > .wj-nodelist > .wj-nodelist {
            font-size: 100%;
            font-style: italic;
            /*opacity: 0.9;*/
            /*color:#029f5b;*/
            border-left: 2px solid #00415d;
            /*border-left: 2px solid rgba(128, 4, 77, 0.3);*/
        }

    /* expanded node glyph */
    .custom-tree.wj-treeview .wj-nodelist .wj-node .wj-node:before {
        content: "\e114";
        font-family: 'Glyphicons Halflings';
        top: 4px;
        border: none;
        opacity: .3;
        transition: all .3s cubic-bezier(.4,0,.2,1);
    }

    /* collapsed node glyph */
    .custom-tree.wj-treeview .wj-nodelist .wj-node.wj-state-collapsed:before,
    .custom-tree.wj-treeview .wj-nodelist .wj-node.wj-state-collapsing:before {
        transform: rotate(-90deg);
        transition: all .3s cubic-bezier(.4,0,.2,1);
        /*transition: all .3s cubic-bezier(.4,0,.2,1);*/
    }

    /* selected node */
    .custom-tree.wj-treeview .wj-node.wj-state-selected {
        color: white;
        background: #00415d;
        /*background: rgba(128, 4, 77, 0.70);*/
        
    }

.btn-red {
    color: #fff;
    background-color: #ac0101;
    border-color: #ac0101;
    box-shadow: 3px 3px 2px #000;
    /*background-color: #337ab7;
    border-color: #2e6da4;*/
}
    .btn-red:hover,
    .btn-red:focus {
        color: #fff;
        background-color: #d8b31a;
        border-color: #d8b31a;
        /*background-color: #53A3CD;
        border-color: #53A3CD;*/
    }

.btn-green {
    color: #fff;
    background-color: darkgreen;
    border-color: #ac0101;
    box-shadow: 3px 3px 2px #000;
    /*background-color: #337ab7;
    border-color: #2e6da4;*/
}

    .btn-green:hover,
    .btn-green:focus {
        color: #fff;
        background-color: lawngreen;
        border-color: #d8b31a;
        /*background-color: #53A3CD;
        border-color: #53A3CD;*/
    }


/*login page style*/

.panel-login {
    border-color: #ccc;
    -webkit-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.2);
    box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.2);
}

    .panel-login > .panel-heading {
        color: #00415d;
        background-color: #fff;
        border-color: #fff;
        text-align: center;
    }

        .panel-login > .panel-heading a {
            text-decoration: none;
            color: #666;
            font-weight: bold;
            font-size: 15px;
            -webkit-transition: all 0.1s linear;
            -moz-transition: all 0.1s linear;
            transition: all 0.1s linear;
        }

            .panel-login > .panel-heading a.active {
                color: #029f5b;
                font-size: 18px;
            }

        .panel-login > .panel-heading hr {
            margin-top: 10px;
            margin-bottom: 0px;
            clear: both;
            border: 0;
            height: 1px;
            background-image: -webkit-linear-gradient(left,rgba(0, 0, 0, 0),rgba(0, 0, 0, 0.15),rgba(0, 0, 0, 0));
            background-image: -moz-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.15),rgba(0,0,0,0));
            background-image: -ms-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.15),rgba(0,0,0,0));
            background-image: -o-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.15),rgba(0,0,0,0));
        }

    .panel-login input[type="text"], .panel-login input[type="email"], .panel-login input[type="password"] {
        height: 45px;
        border: 1px solid #ddd;
        font-size: 16px;
        -webkit-transition: all 0.1s linear;
        -moz-transition: all 0.1s linear;
        transition: all 0.1s linear;
    }

    .panel-login input:hover,
    .panel-login input:focus {
        outline: none;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
        border-color: #ccc;
    }

.btn-login {
    background-color: #59B2E0;
    outline: none;
    color: #fff;
    font-size: 14px;
    height: auto;
    font-weight: normal;
    padding: 14px 0;
    text-transform: uppercase;
    border-color: #59B2E6;
}

    .btn-login:hover,
    .btn-login:focus {
        color: #fff;
        background-color: #53A3CD;
        border-color: #53A3CD;
    }

.forgot-password {
    text-decoration: underline;
    color: #888;
}

    .forgot-password:hover,
    .forgot-password:focus {
        text-decoration: underline;
        color: #666;
    }

#login-container {
    padding-top: 50px;
}

/*Loading Div Style*/
.modalDiv {
    position: fixed;
    z-index: 999;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background-color: cornflowerblue;
    filter: alpha(opacity=60);
   /* opacity: 0.6;
    -moz-opacity: 0.8;*/
    display: none;
}

.center {
    z-index: 1000;
    margin: 150px auto 50px auto;
    padding: 10px 20px;
    width: 150px;
    background-color: White;
    border-radius: 10px;
    filter: alpha(opacity=100);
    opacity: 1;
}

    .center img {
        height: 100px;
        width: 100px;
    }
.spinner {
    position: fixed;
    left: 45%;
    top: 45%;
    z-index: 10000;
}
.btn.dark {
    color: white;
    text-shadow: none;
    background-color: #000;
    /*background-color: #555555;*/
}
/*Layout*/
/*body {
    position: relative;
    min-height: 100%;
}*/
/*nav bar hover code*/
/*.navbar-default .navbar-nav > li.dropdown:hover > a,
.navbar-default .navbar-nav > li.dropdown:hover > a:hover,
.navbar-default .navbar-nav > li.dropdown:hover > a:focus {
    background-color: rgb(231, 231, 231);
    color: rgb(85, 85, 85);
}

li.dropdown:hover > .dropdown-menu {
    display: block;
}*/

/*Custom Menu Code For Multi-Level Dropdown*/
#top-nav {
    margin-bottom: 0px !important;
}


/*page footer*/
.footer {
    /*position: relative;*/
    bottom: 0px;
    width: 100%;
    height: 60px;
    line-height: 60px;
    background-color: #f5f5f5;
}


/* Voucher*/

.checkbox {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

/*Media Query*/
@media (max-width: 320px) {
    .panel-body {
        padding: 5px !important;
    }
    .col-sm-6 {
        padding-right: 10px !important;
        padding-left: 10px !important;
    }
}

@media (min-width: 768px) {
    .custom-control {
        padding-left: 40px !important;
    }

        .custom-control input {
            width: 60% !important;
        }
        .custom-control select {
            width: 60% !important;
        }

    .fyaer {
        padding-left: 13px !important;
    }
    .col-md-6, .col-sm-3, .col-sm-4, 
    .col-sm-6,.col-sm-8, .col-sm-12 {
    padding-right: 10px;
    padding-left: 10px;
    }
    .modal-dialog {
        width: 800px ;
    }
}

@media (max-width: 768px) {

    .form-inline .form-control {
        display: inline-block;
        width: 100%;
        vertical-align: middle;
    }

    .custom-control {
        /*padding-left:13px !important;*/
        
    }
}
@media (min-width: 992px) {

    .col-md-6 {
    padding-right: 10px;
    padding-left: 10px;
    }
}

#clockdiv {
    font-family: sans-serif;
    color: #fff;
    display: inline-block;
    font-weight: bolder;
    text-align: center;
    font-size: 10px;
}

    #clockdiv > div {
        padding: 3px;
        display: inline-block;
        color: #00415d;
        border: 2px solid #00415d;
    }

    #clockdiv div > span {
        font-weight: bolder;
        font-size: 22px;
        color:red;
        /*        padding: 5px;*/
        /*        border-radius: 3px;*/
        /*        background: red;*/
/*        display: inline-block;*/
        /*        border: 2px solid #00415d;*/
    }

smalltext {
    padding-top: 5px;
    font-size: 16px;
} 
