@page { margin: 0; size: A4 landscape; } @font-face { font-family: 'D-DIN Bold'; src: url("https://media.k-space.ee/fonts/D-DIN-Bold.woff2") format("woff2"); src: url("https://media.k-space.ee/fonts/D-DIN-Bold.woff") format('woff'); src: url("https://media.k-space.ee/fonts/D-DIN-Bold.ttf") format('ttf'); src: url("https://media.k-space.ee/fonts/D-DIN-Bold.otf") format('otf'); src: url("D-DIN-Bold.woff2") format("woff2"); } body { margin: 0 } .sheet { display: table; margin: 0; position: relative; box-sizing: border-box; page-break-after: always; padding: 10mm; padding-top: 5mm; width: 297mm; height: 209mm; border-spacing: 0; } /* Put everything in the correct location */ .logo { display: table-row; } .logo img { height:35mm; pointer-events: none; float:initial; } .main { font-family: "D-DIN Bold", sans-serif; display: table-row; font-size: 25mm; width: 100%; height: 12.5cm; max-height: 12.5cm; margin: 0; text-align: center; } .subline { font-family: "D-DIN Bold", sans-serif; display: table-row; font-size: 12mm; text-align: center; } .editable { display: table-cell; vertical-align: middle; -webkit-user-modify: read-write; -moz-user-modify: read-write; user-modify: read-write; border: none; outline: none; -ms-word-break: break-all; /* Non standard for webkit */ word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; } /** Screen **/ @media screen { body { background: #eee } .sheet { background: white; box-shadow: 0 .5mm 2mm rgba(0, 0, 0, .3); margin: 20mm auto; } .sheet, .sheet::before, .sheet::after { box-shadow: 1px 1px 1px rgba(0, 0, 0, .4); border: 1px solid #bbb; } .sheet::before, .sheet::after { content: ""; position: absolute; width: 297mm; height: 210mm; background-color: #eee; } .sheet::before { right: 15px; top: 0; transform: rotate(-1deg); z-index: -1; } .sheet::after { top: 5px; right: -5px; transform: rotate(1deg); z-index: -2; } } @media print { body { width: 297mm } .sheet { overflow: hidden; /* Make input caret transparent */ color: transparent; text-shadow: 0 0 0 #000; } }