/*
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);
@import url(http://fonts.googleapis.com/css?family=PT+Sans:400,700|Open+Sans:400,300|Josefin+Sans);
*/
.ff-calc-outer-container {
    width: 620px;
    margin: auto;
}

.ff-calc-container {
    font-family: "Museo-Sans", "Raleway", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    margin: 5px auto;
    padding: 0 10px;
    box-sizing: content-box;
    /*width: 100%;*/
    /*position: absolute;*/
}

.ff-calc-container * {
    box-sizing: content-box;
}

.ff-calc-container table {
    border-collapse: separate;
    border-spacing: 2px;
}

#ff-calc-container {
    font-family: "Museo-Sans", "Raleway", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    margin-top: 20px;
    /*padding: 10px;*/
    /*width: 100%;*/
    /*position: absolute;*/
}

#ff-calc-container h3 {
    font-weight: bold;
    color: #11345c;
    font-size: 2em;
    margin: 0;
    padding: 0
}


/*
    Column panes layout:

    column1 - one column pane 600px wide
    column2 - 2 panes 295px wide, 10px spacing between

*/
.ff-calc-column-container {
    width: 600px;
    font-size: 12pt;
}

.ff-calc-tab-container {
    padding: 0 !important;
}

.ff-calc-column1 {
    width: 600px;
    clear: both;
    position: relative;
    padding: 0 !important;
}

.ff-calc-column2 {
    width: 295px;
    float: left;
    position: relative;
    margin-right: 10px;
    padding: 0 !important;
}

.ff-calc-column3-1 {
    width: 193px;
    float: left;
    position: relative;
    margin-right: 10px;
    padding: 0 !important;
}

.ff-calc-column3-2 {
    width: 397px;
    float: left;
    position: relative;
    margin-right: 10px;
    padding: 0 !important;
}

.ff-calc-column-last {
    margin-right: 0;
}

.ff-calc-bar {
    background-color: #5f5f5f;
    color: #fff;
    padding: 2px 5px;
    margin: 5px 0 5px;
    font-weight: bold;
}

.ff-calc-panel {
    background-color: #f9f9f9;
    margin-bottom: 5px;
    border: solid 1px #ccc;
}

.ff-calc-input-header {
    text-align: left;
    margin: 0;
    padding: 10px;
    background-color: #ccc;
    font-weight: bold;
}

.ff-calc-input-container {
    text-align: left;
    margin: 0;
    padding: 10px;
}

.ff-calc-table {
    margin: 0;
    padding: 2px 10px;
}

.ff-calc-label {
    display: block;
}

.ff-calc-input {
    font-family: "Museo-Sans", "Raleway", "Helvetica Neue", Helvetica, Arial, sans-serif;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    padding: 3px 5px;
    background-color: #fff;
    border: 1px solid #aaa;
    /*color: #f6931f;*/
    color: #1f93f6;
    width: 100%;
    text-align: right;
    /*-webkit-box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.75);*/
    /*-moz-box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.75);*/
    /*box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.75);*/
}

.ff-calc-input:disabled {
    color: #bbb !important;
}

.ff-calc-button {
    font: inherit;
}

.ff-calc-slider-input {
    border: 1px solid #aaa;
    /*color: #f6931f;*/
    color: #1f93f6;
}

.ff-calc-value, .ff-calc-input {
    font-size: 1.5em;
    text-align: right;
}

.ff-calc-value-padded {
    padding: 5px 0;
}

.ff-calc-column1 .ff-calc-input-2column {
    width: 275px;
    position: relative;
    float: left;
}

.ff-calc-column2 .ff-calc-input-2column {
    width: 126px;
    position: relative;
    float: left;
}

.ff-calc-column1 .ff-calc-input-3column {
    width: 178px;
    position: relative;
    float: left;
}

.ff-calc-column1 .ff-calc-input-3column-2 {
    width: 376px;
    position: relative;
    float: left;
}

.ff-calc-highlight {
    position: relative;
    float: left;
    background-color: #04096f;
    padding: 3px;
}

.ff-calc-highlight-success {
    color: #282;
}

.ff-calc-highlight-notice {
    color: #24b;
}

.ff-calc-highlight-alarm {
    color: #c00;
}

.ff-calc-highlight-warning {
    color: #822;
}

.ff-calc-graph {
    position: relative;
    height: 350px;
    border: 1px solid #048;
    margin-bottom: 5px;
}


/* helper styles */
.ff-calc-text {
    font-size: 0.8em;
}

.ff-calc-right {
    text-align: right;
}

.ff-calc-float-right {
    float: right;
}

.ff-calc-float-left {
    float: left;
}

.ff-calc-centered {
    text-align: center;
}

.ff-calc-bold {
    font-weight: bold;
}

.ff-calc-bigger {
    font-size: 1.5em;
}

.ff-calc-big {
    font-size: 1.5em;
    font-weight: bold;
}

.ff-calc-regular {
    font-size: 1.1em;
}

.ff-calc-small {
    font-size: 0.7em !important;
}

.ff-calc-matrix {
    font-size: 0.6em !important;
    border-spacing: 0;
}

.ff-calc-withnext {
    padding-bottom: 0;
}

.ff-calc-first {
    padding-top: 0;
}

p.ff-calc-first {
    margin-block-start: 0;
}

.ff-calc-last {
    padding-bottom: 0;
}

p.ff-calc-last {
    margin-block-end: 0;
}

.ff-calc-top10px {
    padding-top: 10px !important;
}

.ff-calc-bottom10px {
    padding-bottom: 10px !important;
}

.ff-calc-inline {
    display: inline;
}

.ff-calc-clear {
    clear: both;
}

.ff-calc-hidden {
    display: none;
}

.ff-calc-success {
    color: #480;
}

.ff-calc-warning {
    color: #a20;
}


.ff-calc-matrix tbody tr:hover {
    background-color: #ddd;
    /*outline: 1px solid #6af;*/
}

.ff-calc-matrix tr:hover td {
    /*border-top: solid 1px #888;*/
    /*border-bottom: solid 1px #888;*/

    /*box-shadow: 3px 3px #888;*/
}

.ff-calc-matrix tr:hover td.ff-calc-delete-control:before {

}

.ff-calc-matrix tr td.ff-calc-delete-control div,
.ff-calc-matrix tr td.ff-calc-delete-column div {
    width: 16px;
    height: 16px;
    cursor: pointer;
}

.ff-calc-matrix tr:hover td.ff-calc-delete-control div,
.ff-calc-matrix tr:hover td.ff-calc-delete-column div {
    background-image: url(images/ui-icons_cd0a0a_256x240.png);
    background-position: -32px -192px; /* .ui-icon-circle-close */
}

.ff-calc-disclaimer, .ff-calc-copyright {
    /* margin: 15px 0; */
    padding: 5px 0;
    font-size: 0.75em;
    color: #aaa;
}

.ff-calc-copyright {
    border-top: 1px solid #ccc;
    margin: 15px auto;
    padding: 5px 0 !important;
}

.ff-calc-copyright a {
    text-decoration: none;
    color: #888;
}

.ff-calc-copyright a:hover {
    text-decoration: underline;
}

.ff-calc-note {
    font-size: 0.75em;
    color: #444;
    padding: 5px;
}

#ff-calc-save-status {
    padding: 3px;
}

/* fixes for UI slider and ff copyright logo */
.ui-widget {
    font-family: "Museo-Sans", "Raleway", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.ui-tooltip {
    font-size: 0.8em;
}

.ui-slider-horizontal .ui-slider-handle {
    top: -8px;
    background: url(../img/slider-handle.png) 50% 50% no-repeat #e6e6e6;
    cursor: pointer;
    outline: none;
    border: none;
    height: 25px;
    width: 25px;
    background-color: transparent;
}

.ui-slider-horizontal {
    height: 8px;
    background: url(../img/gray-bg-pattern1.png) repeat-x #888888;
    margin: 15px 0 5px;
    box-shadow: inset 0 1px 5px 0px rgba(0, 0, 0, .5),
    0 1px 0 0px rgba(250, 250, 250, .5);
}

.ui-slider-range {
    background: url(../img/blue-bg-pattern1.png) repeat-x #3b5880;
}

.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
    font-size: 0.8em;
    padding: 5px;
}

a#ff-calc-logo-link {
    float: right;
    display: block;
    width: 106px;
    height: 35px;
    background-image: url("../img/ff_logo_unbiased_double_sm.png");
    background-size: 100%;
    background-position: 0 35px !important;
    /*background-repeat: no-repeat;*/
    margin: 1px 0 5px 5px;
    /*margin: 25px auto;*/
    text-decoration: none;
}

a#ff-calc-logo-link:hover {
    background-position: 0 0 !important;
    background-color: transparent;
}

.ff-calc-tooltip {
    position: relative;
    float: right;
    overflow: hidden;
    /*height: 20px;*/
    /*width: 20px;*/
    /*background: url(../img/help-off-blue.png) center no-repeat;*/

    height: 16px;
    width: 16px;
    background: url(images/ui-icons_2e83ff_256x240.png);
    background-position: -48px -144px;
    background-position: -16px -144px;
    background-repeat: no-repeat;
}

.ff-calc-tooltip-inline {
    float: none !important;
    display: inline-block;
}


.ff-calc-with-tooltip {
    display: inline-block;
}

/** see http://nicolasgallagher.com/micro-clearfix-hack/ **/
.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}


@media screen and (max-width: 650px) {
    #expenseSlidersContainer {
        height: 1850px;
    }

    .step3PaycheckBreakdownRowValue {
        clear: both;
        font-size: 1.2em;
    }

    .ff-calc-tabs-container-ff-calc-graph {
        position: relative;
        width: 297px;
        height: 325px;
    }

    .ff-calc-outer-container {
        width: 320px;
        margin: auto;
    }

    #ff-calc-container {
        padding: 3px;
    }

    .ff-calc-fields {
        width: 300px;
    }

    .ff-calc-column1 {
        width: 300px;
    }

    .ff-calc-column2 {
        width: 300px;
        margin-right: 0;
    }

    .ff-calc-column-container {
        width: 300px;
    }

    .ff-calc-input-3column {
        width: 278px !important;
    }

    /* Responsive table refloat method. This requires <!DOCTYPE html> -- doesn't work in the quirks mode... */
    /* Force table to not be like tables anymore */
    table.ff-responsive-table,
    .ff-responsive-table thead,
    .ff-responsive-table tbody,
    .ff-responsive-table th,
    .ff-responsive-table td,
    .ff-responsive-table tr {
        display: block;
    }

    /* Hide table headers (but not display: none;, for accessibility) */
    .ff-responsive-table thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .ff-responsive-table tr {
        border: 1px solid #ccc;
        margin-bottom: 5px;
    }

    .ff-responsive-table td {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding: 5px 5px 5px 130px;
        width: 153px;
    }

    .ff-responsive-table td:before {
        /* Now like a table header */
        position: absolute;
        display: block;
        /* Top/left values mimic padding */
        top: 6px;
        left: 6px;
        width: 130px;
        white-space: nowrap;
        content: attr(data-label) ": ";
        font-size: 1.3em;
    }

    .ff-responsive-table td.ff-calc-delete-control:before {
        content: '';
    }

    .ff-calc-matrix tr td.ff-calc-delete-control div {
        background-image: url(images/ui-icons_cd0a0a_256x240.png);
        background-position: -32px -192px; /* .ui-icon-circle-close */
    }

    /*
    .ff-calc-responsive-header {
        display: none;
    }


    .ff-calc-responsive-label:before {
        position: absolute;
        top: 6px;
        left: 6px;
        content: attr(data-label);
    }
    */
}
