﻿/****************************************** Manual Reconciliation Master Page Style Starts here *****************************************************************/
.manualReconcileSearchTable{
    width:100%;
}
.reconcileTradingBankDropdown{
    width:71% !important;
} 
.reconcileTxtAmount{
    width:63% !important;
}
.amountColumn{
    padding-right:5px !important;
}
.width-20-percent {
    width: 20% !important;
}

.width-100-percent {
    width: 100% !important;
}

.txtBoxDatePicker {
    width: 16% !important;
}

.searchTableTR {
    height: 45px !important;
}
/** For Solving Account Number Dropdown Height Problem while we select empty item**/
.manualReconcileSearchTable div.selectize-input {
    height: 30px !important;
}
.selectize-dropdown .active{
    /* background:#168bde !important; */
}
.selectize-dropdown [data-selectable]{
    height:15px !important;
}
.btnCurvedBorder{
    height: 25px !important;
    border-radius: 5px;
    cursor:pointer !important;
}
.col4Row{
    text-align:center !important;
}
/*New Style*/
.tblMain{
	border: 1px solid #999999;
	width:100%;
	float:left;
}

.tblBody{
	border: none;
	width:100%;
	float:left;
}

.tblHead{
	float:left;
	width:100%;
    background:#c0c0c0; 
}
.tblRow{
	
	float:left;
	width:100%;
	/* border-bottom: 1px solid gray; */
}

.tblRow div{
	float:left;
	border-right: 1px solid #999999;
	height:135px;
    padding-top:5px;
    word-wrap:break-word;
}

.tblHead div{
	float:left;
	border-right: 1px solid #999999;
	height:30px;
	line-height:30px;
}


.col1Head,.col1Row{
	width:22%;
}
.col2Head,.col2Row{
	width:20%;
}
/*
.col2Row span{
        word-wrap: break-word;
}
*/
.col3Head,.col3Row{
	width:10%;
    text-align:right;
}
.col4Head,.col4Row{
	width:27.1%;
}
.colHeadAct{
	width:5%;
    text-align:center;
}
.noBorder{
 border-right: none !important;
}
.actionIcon{
	height:28px;
    width:28px;
    border-width:0px;
    margin-top:30px;
}   
.oddRowColor{
    background:#e4e4e4;
}
.evenRowColor{
    background:#ffffff;
}
.tblHead a{
    text-decoration:none !important;
    font-weight: bold !important;
}
.accountLabelHead{
    padding-left:5px;
    font-size:12px;
    font-weight:bold;
    float:left;
    height:35px;
    line-height:35px;
}
.tblRowBorder{
    border:1px solid #999999;
    float:left;
    width:100%;
}
.accountDividerBorder{
    float:left;
    width:100%;
    height:30px;
    line-height:30px;
    border-bottom:1px solid #bdbdbd;
}
.tblRow span{
    padding-left:5px;
    padding-bottom: 5px;
    display:block;
}
.negativeNumberClass{
    color:red;
}

.disableResize {
   resize: none;
   overflow: auto;
   width: 85%;
   height: 60%;
}
 .modal-100px{
    width:20% !important;
}

.popupHeaderText{
    font-weight:bold;
    margin-bottom:15px;
}
   /* The alert message box */
.alert-success {
    padding: 10px;
    background-color: #dff2bf; 
    color: #506902;
    margin-bottom: 15px;
    border-radius:5px;
    font-size:12px;
    font-weight:bold;
}

.alert-error {
    padding: 10px;
    background-color: #ffbaba;  
    color: #dc2424;
    margin-bottom: 15px;
    border-radius:5px;
    font-size:12px;
    font-weight:bold;
}


/* The close button */
.closebtn {
    margin-left: 15px;
    color: gray;
    font-weight: bold;
    float: right;
    font-size: 22px;
    line-height: 20px;
    cursor: pointer;
    transition: 0.3s;
}

/* When moving the mouse over the close button */
.closebtn:hover {
    color: #000;
}
.textarea-error{
    background:red;
}
.padding-right-30px{
    padding-right:30px !important;
}
.width-40-percent{
    width:40% !important;
}
.txtBoxManualDatePicker{
    width:22% !important;
}
/****************************************** Manual Reconciliation Master Page Style Ends here *****************************************************************/

/****************************************** Manual Reconciliation Item Add Page Style Starts here *****************************************************************/
 .reconcileItemModalBody{
        padding-top:0px !important;
    }
    .reconcileItemPopupBox {
        width: auto;
        height: auto;
        padding: 20px;
        margin: 0px 0px 20px 0px;
        border-top: 1px #000 solid;
        border-bottom: 1px #000 solid;
    }
    .ledgerDropdown{
        width:100% !important;
    }
    .reconcileItemPopupBox textarea{
        width:95% !important;
    }
    .alignTextRight{
        text-align:right;
    }
    .reconcileItemLabel{
        width:10% !important;
        font-weight:bold;
    }
    .reconcileItem{
        width:40% !important;
        font-weight:bold;
    }
    .reconcileTxt{
        width:86% !important;  
    }
    .bankNameDropdown{
        width:90% !important;
    }
    .typeRadioHead{
        width:11% !important;
    }
    .typeRadioValue{
        width:32% !important;
    }
    .modal-300px{
         width:770px !important;
    }
/****************************************** Manual Reconciliation Item Add Page Style Ends here *****************************************************************/

/****************************************** Manual Reconciliation Find and Match Page Style Starts here *********************************************************/

 .reconcileFindModalBody{
        padding: 0px 35px 20px 35px !important;
    }
    .reconcileFindAndMatchPopupBox {
        width: auto;
        height: auto;
        
    }
    .reconcileFindTableWidth{
        width:100% !important;
    }
    .reconcileFindLabel{
        width:13%;
        font-weight:bold;
    }
    .reconcileFindItem{
        width:40%;
        font-weight:bold;
    }

    .reconcileFindRightItem{
        width:40%;
        font-weight:bold;
    }
    
    /*.modal-content{
        border:none !important;
        border-radius:0px !important;
    }
        */

     @media only screen and (min-width : 1824px) {
       .modal-900px{ width:58% !important; }
        .accNameHead, .accNameRow{
            width:250px;
        } 
        .countPartyHead, .countPartyRow{
            width:155px;
        }  
        .amountHead, .amountRow{
             width:95px;
             text-align:right;
        }
    }

    @media only screen and (min-width: 1701px) and (max-width: 1823px) {
        .modal-900px{ width:63% !important; }
        .accNameHead, .accNameRow{
            width:250px;
        }
        .countPartyHead, .countPartyRow{
            width:130px;
        } 
        .amountHead, .amountRow{
             width:100px;
             text-align:right;
        }
    }

    @media only screen and (min-width: 1651px) and (max-width: 1700px) {
        .modal-900px{ width:65% !important; }
        .accNameHead, .accNameRow{
            width:250px;
        }
        .countPartyHead, .countPartyRow{
            width:130px;
        } 
        .amountHead, .amountRow{
             width:100px;
             text-align:right;
        }
    }

     @media only screen and (min-width: 1501px) and (max-width: 1650px) {
        .modal-900px{ width:72% !important; }
        .accNameHead, .accNameRow{
            width:250px;
        }
        .countPartyHead, .countPartyRow{
            width:130px;
        } 
        .amountHead, .amountRow{
             width:100px;
             text-align:right;
        }
    }

    @media only screen and (min-width: 1401px) and (max-width: 1500px) {
        .modal-900px{ width:77% !important; }
        .accNameHead, .accNameRow{
            width:250px;
        }
        .countPartyHead, .countPartyRow{
            width:130px;
        } 
        .amountHead, .amountRow{
             width:100px;
             text-align:right;
        }
    }

    @media only screen and (min-width: 1351px) and (max-width: 1400px) {
        .modal-900px{ width:80% !important; }
        .accNameHead, .accNameRow{
            width:250px;
        }
        .countPartyHead, .countPartyRow{
            width:130px;
        } 
        .amountHead, .amountRow{
             width:100px;
             text-align:right;
        }
    }

    @media only screen and (min-width: 1301px) and (max-width: 1350px) {
        .modal-900px{ width:83% !important; }
        .accNameHead, .accNameRow{
            width:250px;
        }
        .countPartyHead, .countPartyRow{
            width:130px;
        } 
        .amountHead, .amountRow{
             width:100px;
             text-align:right;
        }
    }

    @media only screen and (min-width: 1151px) and (max-width: 1300px) {
        .modal-900px{ width:92% !important;}
        .accNameHead, .accNameRow{
            width:250px;
        }
        .countPartyHead, .countPartyRow{
            width:130px;
        } 
        .amountHead, .amountRow{
             width:100px;
             text-align:right;
        }
    }
   
    @media only screen and (min-width: 980px) and (max-width: 1150px) {
        .modal-900px{ width:98% !important; }
        .accNameHead, .accNameRow{
            width:210px;
        }
        .countPartyHead, .countPartyRow{
            width:130px;
        } 
        .amountHead, .amountRow{
             width:80px;
             text-align:right;
        }
    }
    
    
    .headDescription{
        font-size:13px;
        font-weight:bold;
        padding:10px 0px 20px 0px;
    }
    .smallTextBox{
        width:30%;
    }
    .bigTextBox{
        width:66%;
    }
    .bigRightTextBox{
        width:89%;
    }
    .searchFindMatchbox{
        width: auto;
        height: auto;
        padding: 10px 20px;
        margin: 10px 0px 20px 0px;
        border: 1px #999999 solid;
    }
    .findAndMatchBtnDiv{
        text-align:right !important;
    }
    /**** Transaction Table Style Starts here***/
    .bookedDateHead, .bookedDateRow{
        width:75px;
    }
    .newTransactHead, .newTransactRow{
        width:40px;
    }
    .newTransactRow{
        text-align:center !important;
    }
    .payNoHead, .payNoRow{
        width:110px;
    } 
   
    .coverDealHead, .coverDealRow{
        width:120px;
    }
    .splitTransactHead, .splitTransactRow{
         width:50px;
         text-align:center;
    }
    .tblFindMain{
        border: 1px solid #999999;
        width: 100%;
        float: left;
        margin-top:15px;
    }
    .tblFindHead{
        float: left;
        width: 100%;
        background: #c0c0c0;
    }
    .tblFindBody{
        width: 100%;
        float: left;
        border: 1px solid #999999;
        height: 179px;
        overflow-y: auto;
    }
    .tblFindRow{
        float: left;
        width: 100%;
    }
    .tblFindRow div {
        float: left;
        border-right: 1px solid #999999;
        height: 25px;
        padding-top: 5px;
        word-wrap: break-word;
    }
    .tblFindHead div {
        float: left;
        border-right: 1px solid #999999;
        height: 30px;
        line-height: 25px;
    }
    .tblFindHead a{
        text-decoration: underline;
        font-weight: bold !important;
    }
     .tblSelectedHead a{
        text-decoration: none !important;
    }
    .splitLink{
        text-decoration:underline !important;
    }
    .selectedRowColor{
        background:#afda80 !important;
        margin-bottom:1px !important;
       /* border-bottom:1px solid #b9b9b9; */
    }
    .amountSplitedRow div{
        color: gray !important;
    }
    .stepsHeading{
        padding-bottom: 15px;
        font-weight: bold;
        font-size: 13px;
    }
    .sectionSeperator{
        border-bottom:1px solid gray;
        margin-bottom: 15px;
    }
    .subTotalDiv{
        float: left;
        width: 75%;
        border-top: 1px solid;
        height: 30px;
        line-height: 30px;
        border-bottom: 1px solid;
        font-weight:bold;
    }
    .subTotalMatchDiv{
        float: left;
        width: 75%;
        height: 30px;
        line-height: 30px;
        font-weight:bold;
        padding-top:15px;
    }
    .subTotalLabel{
        float:left;
    }
    .subTotalAmount{
        float:right;
    }
    .subTotalDiffDiv{
        float: left;
        color:red;
        height: 30px;
        line-height: 30px;
        padding-left: 25px;
        font-weight: bold;
        padding-top:15px;
    }
    .transactArrowIcon{
        height: 20px;
        width: 20px;
        border-width: 0px;
    }
    .financialAmountColor{
        padding: 5px 10px;
        margin: 5px;
        background: #000;
        color: #fff;
    }
    .amountMatchColor{
        background: #09b109;
    }
    .totalMatchText{
        color:green;
    }

    .oddFindandMatchRowColor{
        background:#e4e4e4;
       /* border-bottom:1px solid #f3f3f3; */
    }
    .evenFindandMatchRowColor{
        background:#f7f7f7;
        /*border-bottom:1px solid #f3f3f3;*/
    }
    .tblInnerSelectedTransaction{
        border-top: 1px solid #999999;
        float: left;
        width: 100%;
    }
    .dirPagination{
        float: right;
        clear:both;
        padding-right: 10px;
    }
    #tblSelectedTransaction{
        clear:both;
    }
    .transAmountLabel{
        width:11% !important;
    }
    .transAmountValue{
        width:32% !important;
    }
    .paymentNumberLabel{
        width:14% !important;
    }
    .paymentNumberValue{
        padding-right:0px !important;
    }
    .txtPaymnetNumber{
        width:57% !important;
    }
    .coverDealLabel{
        width:11% !important;
    }
    .coverDealValue{
        width:32% !important;
    }
    .srchMatchBtnRow{
        width:14% !important;
    }
    .accountNameLabel{
        width:14% !important;
    }
    .matchAllCheckbox{
        margin-top:5px;
    }
    .floatLeft{
        float:left !important;
    }
    .floatRight{
        float:right !important;
    }
    .clearBoth{
        clear:both;
    }
    .btnNewTransaction{
        padding:5px 25px !important;
    }
    /************* CSS For Aligning Popup in center of the page starts here  *************/
    /*
    .modal {
      text-align: center;
      padding: 0!important;
    }

    .modal:before {
      content: '';
      display: inline-block;
      height: 100%;
      vertical-align: middle;
      margin-right: -4px;
    }

    .modal-dialog {
      display: inline-block;
      text-align: left;
      vertical-align: middle;
    }
        */
     /************* CSS For Aligning Popup in center of the page starts here  *************/

/****************************************** Manual Reconciliation Find and Match Page Style Ends here *********************************************************/

/****************************************** Manual Reconciliation Split Transaction Page Style Starts here ****************************************************/
.modal-500px {
        width: 30% !important;
    }
    .modal-200px {
        width: 415px !important;
    }
    .splitLabel{
        font-weight: bold;
    }
    .splitItem{
        width: 40% !important;
        font-weight: bold;
        text-align:right;
    }
    .splitPopupBox{
        padding: 20px;
        margin: 0px 0px 20px 0px;
        border-top: 1px #000 solid;
        border-bottom: 1px #000 solid;
    }
    .remainingAmountDiv{
        padding: 0px 20px 20px 20px;
        margin: 0px 0px 20px 0px;
        border-bottom: 1px #000 solid;
    }
    .txtPartPayment{
        text-align:right;
    }
    .btnNewTransactionSave{
        padding:5px 25px !important;
    }
/****************************************** Manual Reconciliation Split Transaction Page Style Ends here ****************************************************/


.modal-400px {
    width: 40% !important;
}
.no-record-msg{
    font-size:14px;
    color:red;
}
.noteSuccessMsg{
    width:12%;
    text-align:center;
    position:absolute;
    margin-bottom:5px;
    display:none;
    color:#b30000;
    font-weight:bold
}
#tblMatchTransaction a{
    cursor:pointer;
}
.tblHead div{
    font-weight:bold !important;
}
.modal-width-980{
    width:980px !important;
}
.modalclose .btn{
    border: none !important; 
    background: none !important; 
}
.manualReconcileSearchTable .reconsileSelect{
    width: 100% !important;
}