@media screen {
        #calculator-container {
            background-color: #f5f5f5;
            padding: 0;
            /* margin: 0 0 2rem; */
            border: 1px solid #e1e1e1;
        }
        /* CALCULATOR HEADER */
        #calculator-container .header {
            background-color: #f5f5f5;
            position: relative;
        }
        #calculator-container .header h2 {
            margin-bottom: 0;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            font-size: 1.2rem;
            border-top: solid #fafafa;
            border-width: 1px;
            border-bottom: 2px solid #e1e1e1;
            padding: 1rem;
        }
        #calculator-container h2 {
            padding: 0 2.5rem 0 1.5rem;
            margin: 0;
            line-height: 2rem;
        }
        /* CALCULATOR TOOLBAR */
        #calculator-container #toolbar {
            float: right;
            height: 30px;
        }
        #calculator-container #toolbar .select {
            float: left;
            top: -3px;
        }
        #calculator-container #toolbar a.icon {
            width: 32px;
            height: 32px;
            margin-left: 10px;
            float: left;
            text-indent: -9999em;
        }
        #calculator-container #toolbar a.save {
            background-position: -59px -59px;
            display: none;
        }
        #calculator-container #toolbar a.save:hover {
            background-position: -9px -59px;
        }
        #calculator-container #toolbar a.delete {
            background-position: -159px -59px;
            display: none;
        }
        #calculator-container #toolbar a.delete:hover {
            background-position: -109px -59px;
        }
        #calculator-container #toolbar a.new {
            background-position: -259px -59px;
            display: none;
        }
        #calculator-container #toolbar a.new:hover {
            background-position: -209px -59px;
        }
        #calculator-container #toolbar a.print {
            background-position: -359px -59px;
            display: none;
        }
        #calculator-container #toolbar a.print:hover {
            background-position: -309px -59px;
        }
        #calculator-container #toolbar a.settings {
            background-position: -459px -59px;
        }
        #calculator-container #toolbar a.settings:hover {
            background-position: -409px -59px;
        }
        /* CALCULATOR FOOTER */
        /* #calculator-container .footer {
        position: relative;
    } */
        /* CALCULATOR BODY */
        #calculator-container .inner {
            background-color: #f2f2f2;
            padding: 15px;
            position: relative;
        }
        /* CALCULATOR FORM ELEMENTS */
        #calculator-container .inner fieldset label {
            display: inline;
        }
        /* BUDGET PLANNER SPECIFIC CSS */
        #calculator-container .inner {
            border: solid 3px #669999;
            padding: 0px;
        }
        #calculator-container .inner {
            border-bottom: none;
        }
        #calculator-container .inner {
            background-color: #7b9e10;
            padding-top: 5px;
        }
        /* #calculator-container .footer {
        padding: 5px;
    } */
        /* footer */
        #calculator-container div.footer {
            border: none;
        }
        /* form elements */
        #calculator-container #profile-list {
            float: left;
            width: 200px;
            color: #669999;
            display: none;
        }
        #calculator-container h4 {
            font-size: 1.1em
        }
        #calculator-container #summary ul {
            margin: 0;
        }
        #calculator-container h4.deficit,
        td.total-nett.negative {
            color: #d00000;
        }
        #calculator-container h4.neutral {
            color: #18AD9C;
        }
        #calculator-container a.delete-item {
            display: inline-block;
            width: 10px;
            height: 13px;
            text-indent: -9999em;
            background: url(https://www.moneysmart.gov.au/Asset/26/icon-delete.png) top left no-repeat;
            margin-left: 5px;
        }
        #calculator-container .input>div {
            clear: both;
        }
        #calculator-container .input div.category,
        #calculator-container .input div.summary {
            overflow: hidden;
            border-top: solid #fafafa;
            border-width: 1px;
            border-bottom: 2px solid #e1e1e1
        }
        #calculator-container .input div>h3 {
            /* background-color: white;
        line-height: 2.5em;
        padding: 0 10px;
        margin-bottom: 0;
        cursor: pointer;
        cursor: hand; */
            position: relative;
            background-color: #fff;
            text-align: right;
            padding: 0.8rem;
            z-index: auto;
        }
        #calculator-container .input .category>h3 {
            overflow: hidden;
            display: flex;
            justify-content: space-between;
            margin: 0;
            padding: 1rem 2.5rem;
            background-color: #efefef;
            cursor: pointer;
            font-size: .9rem;
        }
        #calculator-container .input .category>h3>span {
            flex-grow: 1;
            text-align: right;
        }
        #calculator-container .item {
            padding: .75rem;
            display: flex;
            border-bottom: 1px dotted #999;
            align-items: center;
            justify-content: flex-start;
            background-color: #fff;
        }
        @media (max-width: 36rem) {
            #calculator-container .input .category .item {
                display: flex;
                /* flex-direction: column */
                flex-wrap: wrap;
            }
            #calculator-container .input .category .item select,
            #calculator-container .input .category .item input,
            #calculator-container .input .category .item span {
                margin-top: .8rem;
                flex: 0 100%;
            }
            #calculator-container .input .category>h3 {
                padding: 1rem 0.5rem;
                text-align: left
            }
            #calculator-container .input .amount {
                margin-right: 0rem;
            }
            #calculator-container .input div>h3 select {
                width: 100%
            }
        }
        #calculator-container .item label {
            display: inline-block;
            width: 50%;
            padding-left: 15px;
            line-height: 1em;
            font-size: 14px;
        }
        #calculator-container .item span.total {
            width: 6rem;
            text-align: right;
            margin-left: 1rem;
        }
        #calculator-container #summary h3 {
            overflow: hidden;
            display: flex;
            margin: 0;
            color: #fff;
            background-color: #0146f5;
            padding: 1rem 2.5rem;
        }
        #calculator-container #summary span {
            flex-grow: 1;
            float: right;
        }
        #calculator-container #summary h3:focus {
            background-color: #0146f5;
            outline: none;
        }
        #calculator-container #summary h3 span.nagative {
            color: #d00000;
        }
        #calculator-container input:focus,
        #calculator-container select:focus {
            border: 1px solid #6e9934;
            outline: none;
        }
        #toolbox input[type=checkbox] {
            width: 25px
        }
        #calculator-container a.custom {
            display: none;
            text-decoration: none;
        }
        #calculator-container label a {
            color: #999;
            font-size: 0.8em
        }
        /*#calculator-container .item input { margin-right: 5px; }*/
        #calculator-container h3 span {
            float: right
        }
        #result {
            padding: 0 10px;
        }
        /* calculator form elements */
        #calculator-container select,
        #calculator-container input[type="text"],
        #calculator-container input[type="number"] {
            box-sizing: border-box;
            -moz-box-sizing: border-box;
            background-color: white;
            border: 1px solid #ccc;
            -moz-border-radius: 10px;
            border-radius: 5px;
            color: #336699;
            /* height: 2.5em; */
            padding: 1rem 10px;
        }
        #calculator-container input.amount {
            text-align: right;
            width: 7rem;
            color: #336699;
            margin-right: 0.5rem;
        }
        #calculator-container input.name {
            width: 80%;
            border-color: white;
        }
        /* #calculator-container select {
        padding: 1.5em 10px;
        color: #336699;
    } */
        @media only screen and (min-width: 56em) {
            #calculator-container .item input.amount {
                width: 120px;
            }
            #calculator-container select {
                width: 150px;
            }
        }
        @media only screen and (max-width: 55em) {
            #calculator-container .item label {
                width: 50%
            }
        }
        @media only screen and (max-width: 38em) {
            #calculator-container .item label {
                width: 35%
            }
            #calculator-container .item span.total {
                margin-left: 0;
            }
        }
        @media only screen and (max-width: 33em) {
            #calculator-container .item label {
                width: 95%
            }
            #calculator-container #profile-list {
                width: 150px
            }
            #calculator-container #toolbar a.icon {
                margin: 0
            }
            #calculator-container #toolbar a.icon.print {
                display: none
            }
        }
        @media only screen and (max-width: 50em) {
            section.header-links.desktop {
                display: block;
            }
            section.header-links.desktop>a {
                display: none !important;
            }
        }
    }
    
    @media print {
        #calculator-container {
            width: 670px;
            opacity: 1 !important;
        }
        #toolbar {
            display: none
        }
        .category>h3 span,
        .item .total {
            width: 100px;
            float: right;
            text-align: right;
        }
        .item label {
            display: inline-block;
            width: 300px
        }
        .item input {
            border: 0px solid;
            width: 100px;
            text-align: right;
            margin-right: 20px
        }
        #calculator-container .category {
            border-top: solid 1px #ccc;
        }
        #calculator-container .item {
            border-top: dotted 1px #ccc;
        }
        #content .dialog,
        #content .dialog-bg {
            display: none !important;
        }
    }