/* Portrait Tablet */
@media screen and (max-width:1000px) 
{
    #access
    {
        margin-right: -0.75em;
    }
    #access a
    {
        padding: 0 0.8em;
    }
    #container
    {
        min-width: 320px;
    }
    #page
    {
        max-width: 820px;
        width: auto;
    }
    #home-feature
    {
        width: 100%;
    }
    .employer-responsive-table th
    {
        display: none!important;
    }
    .employer-responsive-table td
    {
        display: block!important;
        text-align: left!important;
    }
    .employer-responsive-table td:nth-child(1)
    {
        padding-top: 3px;
    }
    .employer-responsive-table td:last-child
    {
        padding-bottom: 3px;
    }
    #logins-table td:nth-child(3),
    #logins-table td:nth-child(4)
    {
        display: inline-block!important;
    }
    #logins-table td:nth-child(4):before
    {
        content: "|";
    }
    #logins-table td:nth-child(5):before
    {
        display: inline;
        content: "Registered: ";
    }
    .odo-table td:nth-child(1),
    .odo-table td:nth-child(2)
    {
        display: none!important;
    }
    .odo-table td:nth-child(3)
    {
        padding-top: 3px;
    }
    .odo-table td:nth-child(4),
    .odo-table td:nth-child(5)
    {
        display: inline-block!important;
    }
    .odo-table td:nth-child(5):before
    {
        content: "|";
    }
    .leases-table-active td:first-child,
    .leases-table-terminated td:first-child
    {
        display: none!important;
    }
    .leases-table-active td:nth-child(2),
    .leases-table-terminated td:nth-child(2)
    {
        padding-top: 3px;
    }
    /*.leases-table-active td:nth-child(2),
    .leases-table-active td:nth-child(3),
    .leases-table-terminated td:nth-child(2),
    .leases-table-terminated td:nth-child(3)
    {
        display: block!important;
        float: left;
        padding-top: 3px;
        width: 70%;
    }
    .leases-table-active td:nth-child(3),
    .leases-table-terminated td:nth-child(3)
    {
        width: 25%;
        text-align: right!important;
        float: right;
    }*/
    .leases-table-active tfoot tr:first-child td
    {
        display: block!important;
    }
    .leases-table-active tfoot td:nth-child(2):before
    {
        content: "TOTAL";

    }
    .leases-table-active td:nth-child(4),
    .leases-table-active td:nth-child(5),
    .leases-table-active td:nth-child(6)
    {
        box-sizing: border-box;
        display: block;
        width: 33.333%;
        float: left;
        position: relative;
    }
    .leases-table-active td:nth-child(4):before,
    .leases-table-active td:nth-child(5):before,
    .leases-table-active td:nth-child(6):before
    {
        font-size: 10px;
        display: block;
        color: #F7941D;
        display: block!important;
    }
    /*.leases-table-active tr:first-child td:before,
    .leases-table-active tfoot tr td:before
    {
        display: block!important;
    }*/
    .leases-table-active td:nth-child(4)
    {
        text-align: left!important;
    }
    .leases-table-active td:nth-child(4):before
    {
        content: "Balance (inc FBT):";
    }
    .leases-table-active td:nth-child(5)
    {
        text-align: center!important;
    }
    .leases-table-active td:nth-child(5):before
    {
        content: "YTD FBT:";
    }
    .leases-table-active td:nth-child(6)
    {
        text-align: right!important;
    }
    .leases-table-active td:nth-child(6):before
    {
        content: "Balance (ex FBT):";
    }
    .leases-table-terminated td:nth-child(4):before
    {
        color: #F7941D;
        content: "Terminated: ";
    }
    
    
}

/* Calc Autosize */
@media screen and (max-width:900px) 
{   
    #home-feature-bottom-left,
    #home-feature-bottom-right,
    #home-feature-sub-bottom-left,
    #home-feature-sub-bottom-right
    {
        width: 47%;
        padding-left: 1%;
        padding-right: 1.2%;
        margin-left: 0;
        margin-right: 0;


    }
    #home-feature-bottom-left h4,
    #home-feature-bottom-right h4,
    #home-feature-sub-bottom-left h4,
    #home-feature-sub-bottom-right h4
    {
        font-size: 2.6vw;
    }
    #home-feature-bottom-right,
    #home-feature-sub-bottom-right
    {
        float: right;
    }
    .feature-image
    {
        width: 100%;
    }
    .footer-item
    {
        width: 24%;
    }
    .footer-margin-left
    {
        margin-left: 1.333%
    }
    #content-left
    {
        float: none;
        width: auto;
        margin-right: 210px;
        max-width: 600px;
    }
    #content-left.no-sidebar
    {
        margin-right: 0;
    }
    #content-left *
    {
        max-width: 100%;
    }
    #content-right
    {
        float: none;
        position: absolute;;
        right: 0;
        top: 0;
        padding-left: 0;
        top: 57px;
        width: 190px;
    }
    .calc-overview-section
    {
        height: 14vw;
    }
    .calc-overview-field
    {
        font-size: 2.75vw;
        top: 50%;
        margin-top: -0.5em;
    }
    #calc-results-summary
    {
        width: 90%;
    }
    #calc-pdf-embed
    {
        height: 100vw;
        display: none;
    }
    #ajaxoutput
    {
        width: 100%;
    }
    .post-edit-link
    {
        display: none;
    }
    .login-main
    {
        float: none;
        width: auto;
    }
    .login-info
    {
        width: 100%;
        float:none;
        margin-left: 0;
        margin-top: 0;
        clear: both;
        padding-top: 20px;
        max-width: 500px;
    }
    #detailsform table input
    {
        width: 300px;
    }
    .transaction-table th
    {
        font-size: 15px!important;
    }
    .form-details-table td
    {
        display: block;
    }
    .form-details-table 
    {
        /*color: #0068a8;*/
    }
    .form-details-table input
    {
        width: 100%;
        max-width: 600px!important;
        /*color: black;*/
        box-sizing: border-box;
    }
    .form-details-heading
    {
        margin-top: 20px;
        color: #0068a8;
    }
    textarea.expenses-text-area
    {
        width: 100%!important;
        float: none!important;
        margin-top: 10px;
        margin-right: 0!important;
        box-sizing: border-box;
    }
    .expensesTable input
    {
        width: 85%!important;
    }
    .expensesTable td:nth-child(5) input
    {
        width: 100%!important;
    }
    .odo_reading_tip
    {
        display: inline-block;
        margin-top: 10px;
    }
    input[name="odo_reading_value"]
    {
        display: inline-block;
        margin-top: 10px;
    }
    #daysUnavailable tr:first-child td:nth-child(4)
    {
        display: none!important;
    }
    #daysUnavailable tr:not(:first-child)
    {
        display: block;
        padding-top: 10px;
        clear: both;
    }
    #daysUnavailable td
    {
        box-sizing: border-box;
        display: block!important;
        width: 33%!important;
        float: left;
    }
    #daysUnavailable td input
    {
        padding: 0;
    }
    #daysUnavailable td br
    {
        display: none;
    }
    #daysUnavailable td:nth-child(1)
    {
        clear: both;
    }
    #daysUnavailable td:nth-child(4)
    {
        width: 100%!important;
        clear: both;
        margin-top: 10px;
        margin-bottom: 30px;
    }
  
    #daysUnavailable td:nth-child(1):before
    {
        content: "Date Stored:";
        color: #F7941D;
    }
    #daysUnavailable td:nth-child(2):before
    {
        content: "Date Collected:";
        color: #F7941D;
    }
    #daysUnavailable td:nth-child(3):before
    {
        content: "Total Days:";
        color: #F7941D;
    }
    #daysUnavailable tr:first-child td:before,
    #daysUnavailable tr:last-child td:before
    {
        display: none!important;
    }   
    #daysUnavailable td:nth-child(4):before
    {
        content: "Reason for \201D Days Unavailable\201C:";
        color: #F7941D;
    }
    #merchant-name-field {
        display: block;
        float: none;
        font-size: 14px;
        margin-top: 5px;
    }
}


/* Small Tablet */
@media screen and (max-width:680px)
{
    #home-feature-bottom-left h4,
    #home-feature-bottom-right h4,
    #home-feature-sub-bottom-left h4,
    #home-feature-sub-bottom-right h4
    {
        font-size: 2.8vw;
    }
    #content
    {
        overflow-x: auto;    
    }
    #content-left
    {
        margin-right: 0;
        max-width: 100%;
    }
    #content-right
    {
        display: none;
    }
    .footer-item,
    .footer-margin-left
    {
        width: 49%;
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 10px;
    }
    .footer-item .fh
    {
        margin-bottom: 0;
    }
    .footer-item:nth-child(odd)
    {
        margin-right: 1%;
    }
    .footer-item:nth-child(even)
    {
        margin-left: 1%;
    }
    #calculator-form td
    {
        width: 50%;
        float: left;
        display: block;
        padding: 5px 10px;
    }
    .calc-overview-section
    {
        background-size: contain;
        width: 100%;
        height: 110px;
        float: none;
        
    }
    .calc-overview-field
    {
        text-align: right;
        right: 50%;
        margin-right: -90px;
        font-size: 24px!important;
    }
    .contact-right
    {
        float: none;
        clear: both;
        display: block;
        width: auto;
    }
    .contact-right:before
    {
        content: "Contact Details";
        display: block;
        color: #0068A8;
        margin-bottom: 10px;
        padding-top: 20px;
        font-size: 20px;
    }
    #header
    {
        height: 90px;
    }
    #page
    {
        padding: 10px 20px;
    }
    #top-toolbar
    {
        top: 5px;
        text-align: center;
        font-size: 10px;
    }
    #top-toolbar img
    {
        width: 8px;
    }
    .is-logged-in #top-toolbar
    {
        text-align: right;
    }
    #toolbar-phone
    {
        display: none;
    }

    .is-logged-in #toolbar-links
    {
        top: 15px;
        right: 0;
        position: absolute;
    }
    .toolbar-item
    {
        display: block;
        line-height: 1.5;
        padding: 0;
    }
    .toolbar-item:before
    {
        display: none;
    }
    #access
    {
        display: none;
    }
    #mobile-phone,
    #mobile-menu
    {
        display: block;
        position: absolute;
        right: 0;
        top: 20px;
        height: 40px;
        width: 30px;
        cursor: pointer;
    }
    .is-logged-in #mobile-phone,
    .is-logged-in #mobile-menu
    {
        top: 35px;
    }
    #mobile-menu
    {
        background: url(resources/mobile-menu.png) no-repeat center center;
        background-size: contain;
        
    }
    #mobile-phone
    {
        background: url(resources/mobile-phone.png) no-repeat center center;
        background-size: contain;
        right: 42px;
        width: 22px;
    }
    #access
    {
        margin-top: 0px;
        margin-right: 0px;
        z-index: 100;
        display: block;
        position: fixed;
        right: 40px;
        top: 110px;
        bottom: 100%;
        margin-bottom: 0;
        overflow-y: auto;
        background: none;
        transition: bottom 0.001s 0.25s;

        /*bottom: 0;
        display: none;*/

    }
    #access.menu-open
    {
        transition: bottom 0.001s 0s;
        bottom: 0;

        /*display: block;*/
    }
    #access .menu-main-menu-container
    {
        background: rgba(0,104,168,0.9);
        transform: scale(0.9);
        opacity: 0;
        transition: all 0.15s 0.1s;
    }
    #access.menu-open .menu-main-menu-container
    {
        transform: scale(1);
        opacity: 1;
    }



    #access ul
    {
        display: block;
        margin: 0;
        padding: 0.25em 0;
    }
    #access li
    {
        display: block;
        float: none;
    }
    #access a
    {
        color: white;
        border: 0;
        width: auto;
        line-height: 1.25;
        padding: 5px 10px;
        padding-right: 30px;
        width: 150px;
    }
    #access .sub-menu a
    {
        background: transparent;
        text-indent: 0;
        padding: 3px 20px;
        width: 150px;
    }
    #access ul ul.sub-menu
    {
        top: 0;
        left: 0px!important;
        width: 100%;
        opacity: 1;
        display: block;
        position: relative;
        background: transparent;
        opacity: 1!important;
        padding: 0;
        float: none;
        overflow: hidden;
        display: none;
        /*transition: max-height 0s;*/
        /*max-height: 0;*/
    }
    #access ul li:hover > ul 
    {
        /*max-height: 0;*/
        display: none;
    }
    #access ul li.menu-expanded ul.sub-menu
    {
        /*transition: max-height 0.5s;
        max-height: 500px;*/
        display: block;
    }    
    #header
    {
        position: fixed;
        left: 20px;
        right: 20px;
        border-left: 20px solid white;
        border-right: 20px solid white;
        border-bottom: 32px solid white;
        top: 0;
        height: 80px;
        z-index: 998;
        /*overflow-y: hidden;*/
        background: white;

    }
    #top-logo
    {
        left: -5px;
        top: -5px;
        width: auto;
        cursor: pointer;
        height: 100px;
    }
    #main
    {
        padding-top: 120px;
    }
    #page-category-bar
    {
        position: fixed;
        left: 40px;
        right: 40px;
        top: 80px;
        z-index: 999;
    }
    #access .current-menu-item > a, #access .current-menu-ancestor > a
    {
        color: #F7941D;
    }
    #detailsform table input
    {
        width: 250px;
    }
    .transaction-table
    {
        /*font-size: 12px;   */
    }
    .transaction-table tr.
    .fuel-table tr
    {
        display: block;
        clear: both;
    }
    .transaction-table tr:after,
    .fuel-table tr:after
    {
        content: "";
        display: block;
        clear: both;
    }
    .transaction-table th,
    .fuel-table th
    {
        /*font-size: 14px!important;*/
        display: none;
    }
    .transaction-table td,
    .fuel-table td
    {
        display: block;
        width: 100%!important;
        box-sizing: border-box;
    }
    .transaction-table td:nth-child(1),
    .fuel-table td:nth-child(1)
    {
        color: #f7941d;
        padding-top: 3px;
    }
    .transaction-table td:nth-child(2)
    {

    }
    .transaction-table td:nth-child(3)
    {
        color: black;
        text-align: left!important;   
        float: left;
        width: 50%!important;
    }
    .transaction-table td:nth-child(3):not(:empty):before
    {
        display: inline-block;
        content: "+";
    }
    .transaction-table td:nth-child(4)
    {
        color: red;
        text-align: left!important;   
        float: left;
        width: 50%!important;
    }
    .transaction-table td:nth-child(4):not(:empty):before
    {
        display: inline-block;
        content: "-";
    }
    .transaction-table td:nth-child(5)
    {
        color: #0068A8;
        text-align: right!important;   
        float: right;
        width: 50%!important;
        padding-bottom: 3px;
        /*font-size: 14px;*/
    }
    #fuel-overlay
    {
        left: 0;
    }
    .fuel-table td:nth-child(4)
    {
        text-align: left!important;
        display: inline-block!important;
        width: auto!important;
    }
    .fuel-table td:nth-child(4):before
    {
        color: #0068A8;
        content: "Total Cost: ";
    }
    .fuel-table td:nth-child(5)
    {
        text-align: left!important;
        display: inline-block!important;
        width: auto!important;
    }
    .fuel-table td:nth-child(5):before
    {
        color: #0068A8;
        content: "GST: ";
    }
    .expensesTable tr
    {
        clear: both;
        display: block;
        box-sizing: border-box;
    }
    .expensesTable tr:after
    {
        content: "";
        display: block;
        clear: both;
    }
    .expensesTable th:nth-child(1)
    {
        display: none;
    }
    .expensesTable td:nth-child(1)
    {
        display: block;
        width: 100%!important;
        margin-top: 20px;
        margin-bottom: 5px;
        color: #0068a8;
    }
    .expensesTable th,
    .expensesTable td
    {   
        width: 25%;
        display: block;
        box-sizing: border-box;
        padding-left: 3px;
        padding-right: 3px;
        float: left;
    }
    .expensesTable td input
    {
        width: 85%!important;
    }
    textarea[name="employer_countersign_note"]
    {
        width: 100%!important;
    }
    
}


/* Large Mobile */
@media screen and (max-width:500px)
{
    #pagewrap
    {
        padding: 0px 10px;    
    }   
    #page
    {
        padding: 10px;
    }
    #footer-linkedin
    {
        right: 10px;
    }
    #footer-linkedin img
    {
        width: 60px;
    }
    #header
    {
        left: 10px;
        right: 10px;
        border-left: 10px solid white;
        border-right: 10px solid white;
    }
    #page-category-bar
    {
        left: 20px;
        right: 20px;
    }
    #access
    {
        right: 20px;
    }
    #content-left table
    {

    }
    .login-offer
    {
        padding-left: 80px;
        background-size: 50px;
    }
    #calc-results-tab-overview,
    #calc-results-tab-summary
    {
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        width: 100px;
    }
    h1
    {
        font-size: 32px;
        line-height: 1;
    }
    h2
    {
        font-size: 24px;
        line-height: 1;
    }
    h3
    {
        font-size: 20px;
        line-height: 1;
    }
    h4
    {
        font-size: 18px;
        line-height: 1;
    }
    h5
    {
        font-size: 17px;
        line-height: 1;
    }
    h6
    {
        font-size: 15px;
        line-height: 1;
    }
    #detailsform table input
    {
        width: 190px;
    }
    #emp_acc_select
    {
        width: 100%;
    }
    .responsive-table td
    {
        width: auto;
        display: block;
        padding-left: 0;
        padding-right: 0;
    }
    .responsive-table td:first-child
    {
        padding-top: 5px;
        color: #0068a8;
    }
    .responsive-table input[type="text"]
    {
        width: 100%;
    }
    .provisions-table td
    {
        vertical-align: middle;
    }
    .provisions-table td:first-child
    {
        padding-top: 5px;
    }
    #page-title
    {
        font-size: 24px;
    }
    .leasefilter,.yearselect,.odoyearselect,.odotypeselect
    {
        font-size: 11px;
        padding: 5px 10px;
    }
    #home-feature-bottom-left,
    #home-feature-bottom-right,
    #home-feature-sub-bottom-left,
    #home-feature-sub-bottom-right
    {
        width: 100%;
        margin: 0 0 0.5em 0!important;
        padding: 0.5em!important;
        box-sizing: border-box;
        height: auto!important;
    }
    #home-feature-bottom-left h4,
    #home-feature-bottom-right h4,
    #home-feature-sub-bottom-left h4,
    #home-feature-sub-bottom-right h4
    {
        font-size: 5vw;
    }
    #home-feature-sub-bottom-right
    {
        display: none;
    }


}

/* Medium Mobile */
@media screen and (max-width:400px)
{
    .footer-item
    {
        width: 100%;
        margin-left: 0!important;
        margin-right: 0!important;
    }
   

    
    .expensesTable th
    {
        font-size: 12px;
    }

    h1
    {
        font-size: 28px;
    }
    h2
    {
        font-size: 22px;
    }
    h3
    {
        font-size: 18px;
    }
    h4
    {
        font-size: 17px;
    }
    h5
    {
        font-size: 15px;
    }
    h6
    {
        font-size: 13px;
    }
    .expensesTable input
    {
        font-size: 14px;
    }
    .expensesTable th, .expensesTable td
    {
        padding-left: 1px;
        padding-right: 1px;
    }
    #daysUnavailable td
    {
        font-size: 11px;
    }
}

/* Small Mobile */
@media screen and (max-width: 350px)
{
    #calculator-form td
    {
        width: 100%;
    }
    #page-title
    {
        font-size: 20px;
    }
    .expensesTable,
    .expensesTable input
    {
        font-size: 11.5px;
    }
    .expensesTable th
    {
        font-size: 10px;
    }
    #content
    {
        font-size: 12px;

    }
    #daysUnavailable td
    {
        font-size: 10px;
    }
   
}