fix pdf render to match html

templates/resume.template

@@ -5,55 +5,119 @@
   <meta charset="UTF-8">
   <title>{{ name }}</title>
   <style>
+    /* PDF page settings - Weasyprint */
     @page {
       size: letter;
-      margin: 0.5in;
+      margin: 0.75in;
+    }
+
+    /* reset body -let @page handle margins */
+
+    * {
+      margin: 0;
+      padding 0;
+      box-sizing: border-box;
     }
 
     body {
       font-family: Arial, sans-serif;
-      max-width: 100ch;
+      font-size: 11pt;
-      /* 100 characters max width */
+      line-height: 1.3;
-      margin: 0 auto;
+      color #000;
-      padding: 20px;
-      line-height: 1.6;
     }
 
-    h1 {
+    /* contact section */
-      text-align: center;
+    #contact {
-      margin-bottom: 20px;
+      margin-bottom: 12pt;
     }
 
+    #contact-table {
+      width: 100%;
+      border-collapse: collapse;
+    }
+
+    #contact-table td {
+      vertical-align: top;
+      font-size: 9pt;
+      line-height: 1.3;
+      padding: 0;
+    }
+
+    #contact-table h1 {
+      font-size: 22pt;
+      font-weight: bold;
+      margin: 0;
+    }
+
+    /* section headers */
+    h3 {
+      font-size: 11pt;
+      font-weight: bold;
+      margin-top: 10pt;
+      margin-bottom: 4pt;
+      padding-bottom: 2pt;
+      border-bottom: 1pt solid #333;
+    }
+
+    /* first section no top margin */
+    div[id]:first-of-type h3 {
+      margin-top: 0;
+    }
+
+    /* experience tables */
+    #exprience-table,
     table {
       width: 100%;
-      table-layout: fixed;
       border-collapse: collapse;
-      margin: 20px 0;
+      margin: 6pt 0;
     }
 
-    th,
+    #exprience-table td,
-    td {
+    table td {
-      text-align: left;
-      padding: 8px;
-      border-bottom: 1px solid #ddd;
       vertical-align: top;
+      font-size: 10pt;
+      padding: 0;
+      border: none;
     }
 
+    #experience-table b,
+    table b {
+      font-weight: bold;
+    }
+
+    /* paragraphs */
+    p {
+      margin: 4pt 0,
+        font-size: 10pt;
+    }
+
+    /* lists */
     ul {
-      padding-left: 20px;
+      marginL 4pt 0 8pt 0;
+      padding-left: 18pt;
+      list-style-type: disc;
     }
 
     li {
-      margin-bottom: 5px;
+      margin-bottom: 2pt;
+      font-size: 10pt;
+      line-height: 1.3;
     }
 
-    .section {
+    /* sections */
-      margin-bottom: 20px;
+    div[id] {
+      margin-bottom: 10pt;
     }
 
-    .section h2 {
+    /* web only styles */
-      border-bottom: 2px solid #333;
+    @media screen {
-      padding-bottom: 5px;
+      body {
+        max-width: 8.5in;
+        margin: 20px auto;
+        padding: 30px;
+        background: white;
+        box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+      }
     }
   </style>
 </head>