/* #########################################################################
   ##
   ##  Pricing Calculators Module - Internal Module Styles
   ##
   ##  Available to all module templates but not elsewhere in the website.
   ##
   ######################################################################### */

.yourBillImg {
}

/*

TEMPORARY PENDING APROVAL

*/
#tblFccy img{
    margin-left: 40px;
}

#tblCccy img{
    margin-left: 10px;
}

#IntroMessage {
    line-height: 175%;
}

/* Red bold text at top of bill */
#divFixedChargesCurrent #FixChargeDescText,
#divRiverdiversionsChargesCurrent #FixChargeDescText,
#divNonWaterUserChargesCurrent #FixChargeDescText,
#divGroundwaterChargesCurrent #FixChargeDescText, 
#divConsumptiveChargesCurrent #ConsumptiveChargesDescText {
    line-height: 175%;
}

/* Bill image */
#divFixedChargesCurrent .yourBillImg{
	background-image: url('../../images/pricing-calc-invoice.jpg');
}
    
/* border */
/* calculator form outer border */
.CalcBorder {
    border: var(--site-border-color) 1px solid;
}
    
/* G-mwater logo swoosh */ 
.formHeaderImage {
}

/* Fixed - Variable Charges Tables widths 
-------------------------------------------------------*/
#FormSpecifCtrl #tblFccy, 
#FormSpecifCtrl #tblCccy, 
#FormSpecifCtrl #tblRdcy,
#FormSpecifCtrl #tblNwucy,
#FormSpecifCtrl #tblGwcy {
    width: 100%;
}

    #FormSpecifCtrl #tblFccy th,
    #FormSpecifCtrl #tblCccy th,
    #FormSpecifCtrl #tblRdcy th,
    #FormSpecifCtrl #tblNwucy th,
    #FormSpecifCtrl #tblGwcy th {
        padding: var(--site-padding-thinner);
        background: var(--site-color-ui-light);
    }

    #FormSpecifCtrl #tblFccy td, 
    #FormSpecifCtrl #tblCccy td, 
    #FormSpecifCtrl #tblRdcy td,
    #FormSpecifCtrl #tblNwucy td,
    #FormSpecifCtrl #tblGwcy td {
        padding: var(--site-padding-thinner);
        border-bottom: var(--site-color-ui-light) 1px solid;
    }

        #FormSpecifCtrl #tblFccy td:empty,
        #FormSpecifCtrl #tblCccy td:empty,
        #FormSpecifCtrl #tblRdcy td:empty,
        #FormSpecifCtrl #tblNwucy td:empty,
        #FormSpecifCtrl #tblGwcy td:empty {
            padding: 0 !important;
            border: 0 !important;
        }

    .icon.icon-help {
        font-size: 1.5em;
    }

/* Fixed - Variable Charges Table Headings
-------------------------------------------------------*/
#FormSpecifCtrl #tblFccy .calcHead, 
#FormSpecifCtrl #tblCccy .calcHead, 
#FormSpecifCtrl #tblRdcy .calcHead,
#FormSpecifCtrl #tblNwucy .calcHead,
#FormSpecifCtrl #tblGwcy .calcHead{
    width: 28%;
    font-weight: normal;
    background: none;
}

/* Special fields in tables */

tr.separatorRow td {
    border: 0 !important;
}

tr.separatorRow {
    display: none;
}

/* 20110621 - SC - Specific text and background highlighters 
------------------------------------------------------------*/
.redText {
    color: #FF0000;
}

#FormSpecifCtrl input.redBackground {
    background: #FF0000;
    width: 75px;
    padding-left: 4px;
    margin: 0 3px 0 3px;
}

/* Input Fields
-------------------------------------------------------*/

#FormTypeSelectionCont input[type="text"], 
#FormTypeSelectionCont input[type="number"], 
#FormTypeSelectionCont select,
#FormSpecifCtrl input[type="text"], 
#FormSpecifCtrl input[type="number"], 
#FormSpecifCtrl select {
    box-sizing: border-box;
    width: 100%; 
    max-width: 100%;
    padding: var(--site-padding-thinnest); 
    font-family: var(--site-forms-field-font-family);
    font-size: var(--site-forms-field-font-size);
    color: var(--site-forms-field-text-color);
    background: var(--site-forms-field-bg);
    border: var(--site-forms-field-border);
    border-radius: var(--site-forms-field-border-radius);
    box-shadow: var(--site-forms-field-box-shadow);
}

    #FormTypeSelectionCont input[type="text"]:hover,
    #FormTypeSelectionCont input[type="number"]:hover,
    #FormTypeSelectionCont select:hover,
    #FormSpecifCtrl input[type="text"]:hover,
    #FormSpecifCtrl input[type="number"]:hover,
    #FormSpecifCtrl select:hover {
        color: var(--site-forms-field-hover-text-color);
        background: var(--site-forms-field-hover-bg);
        border: var(--site-forms-field-hover-border);
        border-radius: var(--site-forms-field-hover-border-radius);
        box-shadow: var(--site-forms-field-hover-box-shadow);
    }

    #FormTypeSelectionCont input[type="text"]:focus,
    #FormTypeSelectionCont input[type="number"]:focus,
    #FormTypeSelectionCont select:focus,
    #FormSpecifCtrl input[type="text"]:focus,
    #FormSpecifCtrl input[type="number"]:focus,
    #FormSpecifCtrl select:focus {
        color: var(--site-forms-field-focus-text-color);
        background: var(--site-forms-field-focus-bg);
        border: var(--site-forms-field-focus-border);
        border-radius: var(--site-forms-field-focus-border-radius);
        box-shadow: var(--site-forms-field-focus-box-shadow);
        outline: var(--site-forms-field-focus-outline);
    }

    .fixedChrSecConl input {
        margin: 0 4px;
    }

#FormTypeSelectionCont select,
#FormSpecifCtrl select {
    width: auto;
}

    #FormTypeSelectionCont select[disabled],
    #FormSpecifCtrl select[disabled] {
        border: 0;
        background: none;
    }

#FormTypeSelectionCont input[type="text"],
#FormTypeSelectionCont input[type="number"], 
#FormTypeSelectionCont select {
}

#FormTypeSelectionCont #divOptionGroup {
}

    #FormTypeSelectionCont #divOptionGroup td {
        font-size: 116.7%;
    }

        #FormTypeSelectionCont #divOptionGroup td input {
            position: absolute;
            top: 11px;
            left: 10px;
            margin: 0;
        }

        #FormTypeSelectionCont #divOptionGroup td label {
            display: inline-block;
            padding: 10px;
            padding-left: 30px; /* Room for the input */
            background: var(--site-color-ui-light);
        }

        #FormTypeSelectionCont #divOptionGroup td span {
            display: inline-block;
            position: relative;
        }

        #FormTypeSelectionCont #divOptionGroup td span.selected label {
            color: #ffffff;
            background: #303030;
        }

            #FormTypeSelectionCont #divOptionGroup td span.selected label:hover {
            }

        #FormTypeSelectionCont #divOptionGroup td span.deselected label {
        }

            #FormTypeSelectionCont #divOptionGroup td span.deselected label:hover {
                background: #d0d0d0;
                cursor: pointer;
                transition: all 200ms ease-out;
            }

/* Input Text Fields TD Widths
-------------------------------------------------------*/
#FormSpecifCtrl #tblFccy .fixedChrPriTextB,
#FormSpecifCtrl #tblCccy .fixedChrPriTextB,
#FormSpecifCtrl #tblRdcy .fixedChrPriTextB,
#FormSpecifCtrl #tblNwucy .fixedChrPriTextB,
#FormSpecifCtrl #tblGwcy .fixedChrPriTextB {
    width: 75px;
}

#FormSpecifCtrl #tblFccy .fixedChrSecConl, 
#FormSpecifCtrl #tblCccy .fixedChrSecConl, 
#FormSpecifCtrl #tblRdcy .fixedChrSecConl,
#FormSpecifCtrl #tblNwucy .fixedChrSecConl,
#FormSpecifCtrl #tblGwcy .fixedChrSecConl {
}

.fixedChrSecConl input {
    width: 75px !important;
}

/* new END
------------------------------*/

#FormSpecifCtrl .userValue {
    display: inline-block;
    padding: 5px 10px;
    font-weight: 500;
    border: var(--site-color-ui-mid-light) 1px solid;
}

#FormTypeSelectionCont {
    margin-top: var(--site-margin);
    padding: var(--site-padding-thinner) var(--site-padding);
    background: var(--site-color-ui-lightest);
    border: var(--site-border-color) 1px solid;
}

#FormTypeSelectionCont #divLocation {
    font-size: 116.7%;
    font-weight: bold;
}

    #FormTypeSelectionCont #divOptionGroup {
        margin-top: 10px;
    }

#FormSpecifCtrl .dollarChar {
    float: right;
}

/* for everything else to stop lines breacking */
#FormSpecifCtrl .endColTd {
    width: 295px;
}

/* for riverdivisions.aspx to stop lines breacking */
#FormSpecifCtrl .endColTdDivision {
    width: 356px;
}

/*-----------------------------------------------------------
FIXED CHARGES CURRENT
-----------------------------------------------------------*/

#divFixedChargesCurrent{
	/*position: relative;
	top: -40px;*/
}

#divFixedChargesCurrent .calcHeadings {
	font-weight: normal;
}

#divFixedChargesCurrent .formHeaderImage {
}

#divFixedChargesCurrent .yourBillImg {
}

/*==++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

#divRiverdiversionsChargesCurrent .endColTdDivision {
    width: 408px;
}

#divRiverdiversionsChargesCurrent .yourBillImg {
}

#divRiverdiversionsChargesCurrent .formHeaderImage {
}

#divRiverdiversionsChargesCurrent .calcHeadings {
	font-weight: normal;
}

/*-----------------------------------------------------------
RIVER DIVISIONS FIXED CHARGES CURRENT END
-----------------------------------------------------------*/

/*-----------------------------------------------------------
NON WATER USER CHARGES CURRENT
-----------------------------------------------------------*/
#divNonWaterUserChargesCurrent {
}

#divNonWaterUserChargesCurrent .yourBillImg {
}

#divNonWaterUserChargesCurrent .formHeaderImage {
}

#divNonWaterUserChargesCurrent .calcHeadings {
		font-weight: normal;
}

/*-----------------------------------------------------------
NON WATER USER CHARGES CURRENT END
-----------------------------------------------------------*/

/*-----------------------------------------------------------
GROUND WATER CHARGES CURRENT
-----------------------------------------------------------*/
#divGroundwaterChargesCurrent {
}

	#divGroundwaterChargesCurrent .yourBillImg {
	}

	#divGroundwaterChargesCurrent .formHeaderImage {
	}

	#divGroundwaterChargesCurrent .calcHeadings {
		font-weight: normal;
	}
/*-----------------------------------------------------------
GROUND WATER CHARGES CURRENT END
-----------------------------------------------------------*/

/*-----------------------------------------------------------
CHARGES NEXT YEAR 
-----------------------------------------------------------*/

div.chargesNextYear {
	width: 100%;
    margin-top: 20px;
}

	div.chargesNextYear table {
		width: 100%;
	}
	
	    div.chargesNextYear table th {
		    padding: var(--site-padding-thinner);
            background: var(--site-color-ui-lightest);
	    }

            div.chargesNextYear table th.inlineTitle {
                background: none;
                border-bottom: var(--site-color-ui-light) 1px solid;
            }

            div.chargesNextYear table th .feeNote {
                margin-top: 10px;
                font-size: 11px;
                color: #cc3333;
            }

        div.chargesNextYear table td {
		    padding: var(--site-padding-thinner);
	    }
	
	div.chargesNextYear .inlineHeadingTitle {
		width: 55%;
	}
	
	div.chargesNextYear .calcHeadings {
		font-weight: normal;
	}
	
	div.chargesNextYear .inlineTitle {
		width: 55%;
		font-weight: normal;
	}

    div.chargesNextYear .canDelHead {
        width: 15%;
        color: #000;
        text-align: right;
        padding: 0 10px 0 0;
        background: var(--site-color-1-mid-light);
        border-top: 1px solid #FFFFFF;
        border-left: 1px solid #FFFFFF;
        border-right: 1px solid #FFFFFF;
        border-bottom: 1px solid #FFFFFF;
    }

    div.chargesNextYear .canDelResult {
        width: 15%;
        text-align: right;
        padding: 0 10px 0 0;
        background: #E1F5FD;
        background: var(--site-color-1-lighter);
        border-left: 1px solid #FFFFFF;
        border-right: 1px solid #FFFFFF;
        border-bottom: 1px solid #FFFFFF;
    }
	
	/* Fixed Charges Current ( tblFccy ) TEXT ALIGN RIGHT */
	div.chargesNextYear .chargDetTotals {
		text-align: right;
		padding: 0 5px 0 0;
	}
	
	div.chargesNextYear table th.totalText {
		width: 55%;
		text-align: right;
		background: none;
	}
	
	div.chargesNextYear .chargDetTotals {
		width: 15%; 
		text-align: right;
		padding: 0 10px 0 0;
		background: #F8F8F8;
		border-top: 3px solid #6DCDF5;
		border-left: 3px solid #FFFFFF;
		border-right: 3px solid #FFFFFF;
	}

/*-----------------------------------------------------------
CHARGES NEXT YEAR END
-----------------------------------------------------------*/

/*-----------------------------------------------------------
CHARGES NEXT YEAR INDIVIDUAL TABLES
-----------------------------------------------------------*/

#divFixedChargesNextYear {
}

#divConsumptiveChargesNextYear {
}

#divNonWaterUserChargesNextYear {
}

#divRiverdiversionsChargesNextYear {
}

#divGroundwaterChargesNextYear {
}

/*-----------------------------------------------------------
CHARGES NEXT YEAR INDIVIDUAL TABLES END
-----------------------------------------------------------*/


/*-----------------------------------------------------------
CONSUMTIVE CHARGES CURRENT
-----------------------------------------------------------*/
#divConsumptiveChargesCurrent {
	width: 100%;
	padding: 0;
	margin: 0;
}

    #divConsumptiveChargesCurrent .fixedChrPriTextB { 
        width: 80px;  
    }

    #divConsumptiveChargesCurrent .fixedChrSecConl { 
        width: 296px;  
    }

    #divConsumptiveChargesCurrent .helpIconCell {
        text-align: right;
    }

    #divConsumptiveChargesCurrent table {
        position: relative;
        width: 100%;
    }

    #divConsumptiveChargesCurrent .inlineHeadingTitle, #divConsumptiveChargesCurrent .inlineTitle {
	    font-weight: normal;
    }

    /*#divConsumptiveChargesCurrent .calcHead {
        width: 152px;    
    }*/

    #divConsumptiveChargesCurrent .fixedChrPriTextB {
        width: 70px;
    }

    #divConsumptiveChargesCurrent .fixedChrSecConl {
        width: 296px;
    }

    #divConsumptiveChargesCurrent .consumpInlineTitle {
	    font-weight: normal;
	    width: 220px;
    }

    #divConsumptiveChargesCurrent .consumtColTwo {
	    width: 300px;
    }

    #divConsumptiveChargesCurrent .consumtColThree {
	    width: 150px;
    }

    #divConsumptiveChargesCurrent .consumtColFour {
	    width: 140px;
    }

    #divConsumptiveChargesCurrent .consumtColfive {
	    width: 140px;
    }

    #divConsumptiveChargesCurrent .yourBillImg {
    }

    #divConsumptiveChargesCurrent .formHeaderImage {
    }

/*-----------------------------------------------------------
CONSUMTIVE CHARGES CURRENT END
-----------------------------------------------------------*/

#divConsumptiveCharges .calcHeadings {
    width: 163px;
    font-weight: normal;
}

#divFixedChargesCurrent .calcHeadings {
    width: 163px;
    font-weight: normal;
}

#divFixedChargesCurrent table {
    width: 604px; /*678*/
}

/*-----------------------------------------------------------
DISPLAY TOTALS divDisplayTotals
-----------------------------------------------------------*/

#divDisplayTotals {
    margin: 20px 0 0;
    border-top: var(--site-color-ui-light) 3px solid;
}

	#divDisplayTotals table {
		width: 100%;
	}
	
	#divDisplayTotals .distDispTotalsHead {
		width: 35%;
	}
	
	#divDisplayTotals .calcHeadings {
		font-weight: normal;
	}
	
	#divDisplayTotals .distDesc {
		width: 35%;
		padding: 10px;
        background: var(--site-color-ui-lightest);
	}

	#divDisplayTotals .totalBolding {
		font-weight: bold;
	}
	
	#divDisplayTotals .distDispTotalsHeadColTwo {
		width: 20%;
		text-align: right;
		padding: var(--site-padding-thinner);
	}
	
	#divDisplayTotals .dispTotHead {
		width: 15%;
		text-align: right;
		padding: var(--site-padding-thinner);
        border-bottom: var(--site-color-ui-light) 1px solid;
	}
	
	#divDisplayTotals .displayTotalsResults {
		width: 15%;
		text-align: right;
		padding: var(--site-padding-thinner);
        border-bottom: var(--site-color-ui-light) 1px solid;
	}

/*-----------------------------------------------------------
BUTTONS
-----------------------------------------------------------*/

.editChargesButton {
    display: inline-block;
    padding: 0;
    color: #01A8EC;
    font-size: 91.7%;
    text-decoration: underline;
    background: none;
    border: 0;
    cursor: pointer;
}

    .editChargesButton:hover {
        color: #006BB6;
    }

#FormFootBtns {
    margin: 20px 0;
}

#btnBackToMainNav {
    display: none;
}

/*-----------------------------------------------------------
BUTTONS END
-----------------------------------------------------------*/

/*-----------------------------------------------------------
TOOL TIPS
-----------------------------------------------------------*/

/* If not js disabled */

.tooltip:hover {
    cursor: pointer;
}

.js .xstooltip {
	visibility: hidden;
	position: absolute; 
	top: 0;  
	left: 0; 
	z-index: 1000; 
}

.js .ui-tooltip {
    padding: 0;
}

.js .ttHead {
	float: left;
	width: 200px;
    box-sizing: border-box;
	font-weight: bold;
    font-size: 14px;
	color: #FFFFFF;
    margin: 0 0 5px;
	padding: 6px 10px;
	background: #0274BB;/**/
}
	
.js .ttContent {
	width: 200px;
    box-sizing: border-box;
	padding: 10px;
    background: #f8f8f8;
}

.js .ttContent p {
    margin: 0 0 10px;
}

    .js .ttContent :last-child {
        margin-bottom: 0;
    }

/* IF JS IS DISABLED */
.xstooltip {
}

/*-----------------------------------------------------------
TOOL TIPS END
-----------------------------------------------------------*/