body {
    font-family: Geneva, Arial, Helvetica, sans-serif;
    font-size: 12px;
    padding: 0;
}

.main{
    margin-left: auto;
    margin-right: auto;
    padding: 10px;
    width: 960px;
    border: 1px solid #CCCCCC;
}

.actions{
    border-top: 1px solid gray;
}

.styled-table {
    border-collapse: collapse;
    margin: 25px 0;
    font-size: 0.9em;
    font-family: sans-serif;
    min-width: 400px;
    word-break: break-word;
}

.styled-table th,
.styled-table td {
    min-width: 200px;
    padding: 12px 15px;
}

.styled-table tbody tr {
    border: 1px solid #dddddd;
}

.styled-table tbody tr:nth-of-type(odd) {
    background-color: #f3f3f3;
}

.styled-table tbody tr:last-of-type {
    border-bottom: 1px solid #f5b507;
}

.estimate-wrapper > .main > .content .row {
    margin-left: 0 !important;
}

/* Desktop: respect HTML width/height by preventing block-level expansion */
@media (min-width: 801px) {
    .estimate-wrapper > .main > .content img[width][height] {
        display: inline !important;   /* key fix: don't be block-level */
        width:   revert-layer;       /* let attributes/intrinsic control */
        height: revert-layer;
        max-width: none !important;   /* defeat any global img {max-width:100%} */
        max-height: none !important;
        vertical-align: top !important;
        box-sizing: content-box !important;
    }
}

/* Chrome: Override with attr() */
@supports (width: attr(width px)) {
    .estimate-wrapper > .main > .content > p img[width][height],
    .estimate-wrapper > .main > .content > div img[width][height],
    .estimate-wrapper > .main > .content > strong img[width][height],
    .estimate-wrapper > .main > .content > span img[width][height] {
        width: attr(width px) !important;
        height: attr(height px) !important;
    }
}

.estimate-wrapper > .main > .content > table.styled-table > tbody > tr > td {
    vertical-align: baseline;
    word-break: break-word !important;
}

@media only screen and (min-width: 320px) and (max-width: 800px) {
    .estimate-wrapper > .main {
        width: auto;
    }

    .estimate-wrapper > .main > .content > table.styled-table {
        min-width: auto
    }

    .estimate-wrapper > .main > .content > table.styled-table > tbody > tr > td {
        vertical-align: baseline;
        min-width: 150px !important;
        max-width: 170px;
        word-break: break-word !important;
    }

    .estimate-wrapper > .main > .content > table.styled-table > tbody > tr > td:nth-child(2) {
        min-width: auto;
        max-width: 100% !important;
        word-break: break-word;
    }

    .tr-bottom {
        vertical-align: middle;
    }

    .estimate-wrapper > .main > .content > table:first-of-type {
        display: flex !important;
        flex-direction: column !important;
        width: 100%;
    }

    .estimate-wrapper > .main > .content > table:first-of-type > tbody {
        display: flex !important;
        flex-direction: column !important;
    }

    .estimate-wrapper > .main > .content > table:first-of-type > tbody > tr {
        ustify-content: flex-start;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
    }

    .estimate-wrapper > .main > .content > table:first-of-type > tbody > tr {
        width: 100%;
    }

    .estimate-wrapper > .main > .content > table:first-of-type > tbody > tr > td.tr-bottom:nth-child(1) {
        order: 2;
        margin-bottom: -25px;
        border-bottom: none !important;
    }

    .estimate-wrapper > .main > .content > table:first-of-type > tbody > tr > td.tr-bottom:nth-child(2) {
        order: 1;
        width: 100%;
        word-break: break-word !important;
    }
    .estimate-wrapper > .main > .content > table:first-of-type > tbody > tr > td.tr-top {
        order: 0;
        width: 100%;
        word-break: break-word !important;
    }
    /*.estimate-wrapper > .main > .content > table:first-of-type > tbody > tr {*/
    /*    display: block;*/
    /*}*/

    .estimate-wrapper > .main > .content > table:first-of-type > tbody > tr > td {
        text-align: left !important;
        padding: 0.5em;
        border-left: none !important;
        border-top: none !important;
        border-right: none !important;
        display: block !important;
        border: 1px solid rgba(0, 0, 0, .1);
        word-break: break-word;
        overflow: scroll;
    }

    .tr-top > strong::after {
        content: "\00a0";
        word-break: break-word;
        display: block;
        height: 0;
    }

    .estimate-wrapper > .main > .content > p {
        margin-bottom: 0 !important;
        line-height: 1.2 !important;
    }


    .estimate-wrapper > .main > .content > p img {
        display: flex !important;
        margin: 0px auto !important;
    }

    .estimate-wrapper > .main > .content > p > span > strong > img:nth-child(1) {
        margin-top: 20px !important;
    }
}

@media only screen and (min-width: 1024px) {
    .estimate-wrapper > .main > .content > p > span > strong > img {
        width: 300px !important;
        height: 174px !important;
    }
}

body:has(.estimate-wrapper) #page-header {
    display: none !important;
}