@page {
        size: A4 portrait;
        margin: 0mm 0mm 0mm 0mm;
    }

    body{
        background-color: #f7f7ff;
    }

    .maincontainer {
        margin-top: 60px;
        display: flex;
        width: 95%;
    }

    #invoice {
        padding: 0px;
    }
    
    .invoice {
        position: relative;
        background-color: #FFF;
        min-height: 680px;
        padding: 15px
    }
    
    .invoice header {
        padding: 10px 0;
        margin-bottom: 20px;
        border-bottom: 1px solid darkred
    }
    
    .invoice .infoazienda {
        margin: 0 0 0 20px;
    }

    .invoice .company-details {
        text-align: right
    }
    
    .invoice .company-details .name {
        margin-top: 0;
        margin-bottom: 0
    }
    
    .invoice .contacts {
        margin: 0 0 100px 0;
        font-size: 20px;
    }
    
    .invoice .invoice-to {
        text-align: right;
        font-size: medium;
    }
    
    .invoice .invoice-to .to {
        margin-top: 0;
        margin-bottom: 0
    }
    
    .invoice .invoice-details {
        text-align: right;
        font-size: 1.5em;
        font-weight: bold;
    }

    .productImg {
        width: 100px;
    }

    .text-center {
        text-align: center;
    }

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

    .text-left {
        text-align: left;
    }

    .invoice .invoice-details .invoice-id {
        margin-top: 0;
        color: darkred;
    }

    .invoice main {
        padding-bottom: 50px
    }

    .rtlogo {
        max-width : 300px;
        height : auto;
    }

    .thanks {
        margin-top: 70px;
        font-size: 1.3em;
        margin-bottom: 50px
    }
    
    .notices {
        border-left: 6px solid orange;
        background: rgba(250, 150, 0, 0.15);
        padding: 10px;
        margin: 100px 0px;
    }

    .invoice main .notices .notice {
        font-size: 1.2em
    }
    
    .invoice table {
        width: 100%;
        border-collapse: collapse;
        border-spacing: 0;
        margin-bottom: 20px;
        border-bottom: 1px solid gray;
    }
    
    .invoice table td,
    .invoice table th {
        padding: 15px;
/*        background: #eee; */
        border-bottom: 2px solid lightgrey
    }
    
    .invoice table th {
        white-space: nowrap;
        font-weight: 400;
        color: darkred;
    }
    
    .invoice table td h3 {
        margin: 0;
        font-weight: 400;
        color: darkred;
    }

    .invoice table .qty,
    .invoice table .unit {
        text-align: right;
    }
    
    .invoice table .no {
        color: #fff;
        font-size: 1.6em;
        background: darkred;
    }
/*
    .invoice table .unit {
        background: #ddd
    }
*/
    .invoice table .total {
        color: darkred;
        font-weight: bold;
    }
    
    .invoice table .totalrow {
/*        background: rgba(0,0,0,0.1);*/
        font-weight: bold;
    }

    .invoice table .noborder {
        border: none;
        background: transparent;
    }

    .fat_total {
        margin-left: auto;
        width: 50%;
        margin-top: 20px;
    }

    table .fat_total td:first-child,
    table .fat_total th:first-child {
        border: none;
        background-color: transparent;
    }

    .invoice table tbody tr:last-child td {
        border: none
    }
    
    .invoice table tfoot td {
        background: 0 0;
        border-bottom: none;
        white-space: nowrap;
        text-align: right;
        padding: 10px 20px;
        font-size: 1.2em;
        border-top: 1px solid #aaa
    }
    
    .invoice table tfoot tr:first-child td {
        border-top: none
    }
    .card {
        position: relative;
        display: flex;
        flex-direction: column;
        min-width: 0;
        word-wrap: break-word;
        background-color: #fff;
        background-clip: border-box;
        border: 0px solid rgba(0, 0, 0, 0);
        border-radius: .25rem;
        margin-bottom: 1.5rem;
        box-shadow: 0 2px 6px 0 rgb(218 218 253 / 65%), 0 2px 6px 0 rgb(206 206 238 / 54%);
    }
    
    .invoice table tfoot tr:last-child td {
        color: darkred;
        font-size: 1.4em;
        border-top: 1px solid darkred;
        font-weight: bolder;
    }
    
    .invoice table tfoot tr td:first-child {
        border: none
    }
    
    .invoice footer {
        width: 100%;
        text-align: center;
        color: #777;
        border-top: 1px solid #aaa;
        padding: 8px 0
    }
    
    .flexleft {
        display: flex;
        flex-direction: row;
        font-size: 0.7em;
    }


    @media print {

        .rtlogo {
            max-width : 180px;
            height : auto;
            margin-top: 20px;
        }

        .container {
            margin: 0 0 0 0;
            padding: 0 0 0 0;
        }

        .maincontainer {
            margin: 10px 0px 10px 0px;
            width: 100%;
        }

        .card {
            box-shadow: none;
        }

        .invoice {
            font-size: 1em !important;
            overflow: hidden !important;
        }

        .invoice .invoice-to {
            text-align: right;
            font-size: small;
        }

        .invoice footer {
            position: absolute;
            bottom: 10px;
            page-break-after: always;
        }

        .hidden-print {
            display: none;
        }

        .invoice table {
            font-size: 0.7em;
        }
    
        .invoice table td, .invoice table th {
            padding: 5px 5px;
        }

        .invoice .tablerow thead {
            color: darkred;
            border-bottom: 2px solid lightgrey;
        }
/*
        .invoice .tablerow tbody {
            border-bottom: 1px solid gray;
        }

        .fat_total tbody {
            border-bottom: 1px solid gray;
        }

        .fat_total thead th {
            border-bottom: 2px solid lightgrey;
        }
*/
        .fat_total .noborder {
            border: none !important;
        }

        .productImg {
            width: 60px;            
        }

    }