.invoice-container { padding: 20px; max-width: 100%; margin: 0 auto; -webkit-print-color-adjust: exact; direction: rtl; font: 9pt irancell; } .page { background: white; page-break-after: always; padding: 0.5cm; } .flex { display: flex; } .flex > * { float: left; } .flex-grow { flex-grow: 10000000; } .barcode { text-align: center; margin: 12px 0 0 0; height: 30px; } .barcode span { font-size: 35pt; font-family: "Libre Barcode 128"; } .portait { transform: rotate(-90deg) translate(0, 40%); text-align: center; } .header-item-wrapper { border: 1px solid #000; width: 100%; height: 100%; background: #eee; display: flex; align-content: center; } thead, tfoot { background: #eee; } .header-item-data { height: 100%; width: 100%; } .bordered { border: 1px solid #000; padding: 0.12cm; } .header-table { width: 100%; table-layout: fixed; border-spacing: 0; } .header-table td { padding: 0; vertical-align: top; } .content-table { border-collapse: collapse; width: 100%; table-layout: fixed; border-spacing: 0; } .content-table td, .content-table th { border: 1px solid #000; text-align: center; padding: 0.1cm; font-weight: normal; } .centered td { vertical-align: middle; } .serials { direction: ltr; text-align: left; } .title { text-align: right; } .grow { width: 100%; height: 100%; } .font-small { font-size: 8pt; } .font-medium { font-size: 10pt; } .font-big { font-size: 15pt; } .label { font-weight: bold; padding: 0 0 0 2px; } .ltr { direction: ltr; display: block; } @media print { .print-button { display: none; visibility: hidden; } } @page { size: A4 landscape; margin: 0; margin-bottom: 0.5cm; margin-top: 0.5cm; } .mobile-scroll-wrapper { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; } @media screen and (max-width: 768px) { .mobile-scroll-wrapper { margin: 0 -20px; padding: 0 20px; } .page { min-width: 1200px; } }