/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

#print-button {
    float:right;
}

/* Checkbox "checked" color */
input:checked {
    accent-color: #2d8dc7;
}

input:not([type='checkbox']), select {
    display: block;
    margin-bottom: 10px;
}
#future_needs_form {
    padding-right: 15%;
    padding-left: 15%;
}
#section_2 input, #section_2 select {
    display: inline;
}
#section_2 label {
    display: inline-block;
    width: 100px;
}
#section_5, #section_6, #section_7, #section_8, #section_11 {
    display: none;
}
#section_9, #section_10, #section_12, #section_14, #section_15, #section_17, #section_18 {
    display: none;
}
#section_16 {
    display: none;
}
.clear {
    clear: both;
}
#fn_wrapper {
    position: relative;
}
.popUps {
    display: none;
    position: absolute;
    z-index: 99;
    top: 20px;
    width: 400px;
    background-color: #0E8DC7;
    color: #F0F1F9;
    padding: 5px;
    text-align: center;
    border-radius: 10px;
}
.popUps legend {
    width: 400px;
    background-color: #0E8DC7;
    color: #F0F1F9;
    padding: 5px;
    text-align: center;
    border-radius: 10px;
}
.mainSections {
    padding: 10px;
    margin-bottom: 20px;
}
#submit_wrapper {
    display: flex;
    justify-content: center;
}

.income_lumps, .selfIncome_lumps, .alimony_lumps, .childSupp_lumps, .expenses_lumps, .notTaxedIncomeLumps, .otherIncomeLumps {
    display: none;
}
#section_3 label, #section_5 label, #section_6 label, #section_8 label {
    position: relative;
}

#main_wrapper {
    width: 90%;
    margin: 0 auto;
    padding: 20px;
}

#section_13 .itemizedExpense {
    display: none;
}
fieldset.itemizedExpense {
    border-style: none;
}
fieldset legend {
    font-size: 1.25em;
    font-weight:bold;
    margin-left: -10px;
    padding-bottom:3px;
}

/*LAST SECTION*/
#section_16 {
    width: 90%;
    max-width: 1600px;
    margin: 0 auto;
    position: relative;
}
#showHideTable {
    margin-bottom: 20px;
}

/*CHART*/
#netWorthWrapperAM5, #incomeExpenseWrapperAM5 {
    background-color: white;
    width: 95%;
    height: 500px;
    margin-top: 20px;
    border-style: solid;
    border-color:#0E8DC7;
    border-width: 2px;
}

/*TABLE*/
#absTable, #absSimpleTable {
    display: none;
    position: relative;
    margin-top: 30px;
    background-color: white;
    overflow-x: scroll;
}

.tableFirstColumnClass {
    border-left: 1px solid #000;
    border-bottom: 1px solid #000;
    float: left;
}
.tableElement {
    width: 100px;
    height: 24px;
    line-height: 16px;
    color: black;
    border-bottom: 1px solid #e0e0e0;
    border-right: 1px solid #e0e0e0;
    padding: 3px;
    text-align:center;
}
.tableElementLabel {
    width: 300px;
    height: 24px;
    line-height: 16px;
    color: black;
    border-left: 1px solid #e0e0e0;
    border-right: 1px solid #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
    padding: 3px;
}
#resultsWrapper > div > div.tableElementLabel, #resultsWrapper > div > div.tableElement, #simpleResultsWrapper > div > div.tableElementLabel, #simpleResultsWrapper > div > div.tableElement {
    border-top: 1px solid #e0e0e0;
}
.borderBottClass {
    border-bottom: 1px solid #000;
    float: left;
}
#resultsWrapper .backGrColorTable, #simpleResultsWrapper .backGrColorTable {
    color: #fff;
    background-color: #0E8DC7;
    border-top: 1px solid #000 !important;
}
.borderBotBlack {
    border-bottom: 1px solid #000;
}

/*Chart Export menu*/
.am5exporting-item a {
    color: #0E8DC7 !important;
}
.am5exporting-label-alt {
    color: #19C5BE !important;
}
#exportTable {
    float:right;
}
@media screen and (max-width: 720px) {
    #section_16 {
        width: 800px;
    }
    .tableElementLabel {
        white-space: nowrap;
        overflow: auto;
        width:100px;
    }
}
@media print {
    header, footer {
        display:none;
    }
}