289 lines
7.4 KiB
HTML
289 lines
7.4 KiB
HTML
<!-- Template Version: 3 -->
|
|
<style>
|
|
* { box-sizing: border-box; }
|
|
|
|
@page { size: A4; margin: 10mm; }
|
|
|
|
body {
|
|
font-family: Arial, Helvetica, sans-serif;
|
|
color: #1f2937;
|
|
font-size: 9pt;
|
|
line-height: 1.24;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.page { width: 100%; position: relative; z-index: 1; }
|
|
|
|
.watermark {
|
|
position: fixed;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%) rotate(-35deg);
|
|
font-size: 72pt;
|
|
color: rgba(220, 38, 38, 0.12);
|
|
font-weight: bold;
|
|
letter-spacing: 7px;
|
|
z-index: 0;
|
|
pointer-events: none;
|
|
user-select: none;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.header {
|
|
margin-bottom: 5mm;
|
|
min-height: 28mm;
|
|
}
|
|
|
|
.logo-right {
|
|
float: right;
|
|
width: 42mm;
|
|
margin-left: 4mm;
|
|
text-align: right;
|
|
}
|
|
|
|
.header-text {
|
|
overflow: hidden;
|
|
}
|
|
|
|
.title {
|
|
font-size: 14.5pt;
|
|
font-weight: bold;
|
|
color: #0f172a;
|
|
margin: 0 0 1mm 0;
|
|
}
|
|
|
|
.subtitle {
|
|
margin: 0;
|
|
font-size: 9.2pt;
|
|
color: #4b5563;
|
|
}
|
|
|
|
.rule {
|
|
margin: 2.6mm 0 2.2mm 0;
|
|
border: 0;
|
|
border-top: 2px solid #d97706;
|
|
}
|
|
|
|
.fee-banner {
|
|
margin: 0 0 2.2mm 0;
|
|
padding: 1.8mm 2.5mm;
|
|
background: #fff7ed;
|
|
border-left: 4px solid #d97706;
|
|
font-size: 10pt;
|
|
font-weight: bold;
|
|
color: #9a3412;
|
|
}
|
|
|
|
.note {
|
|
margin: 0 0 1.2mm 0;
|
|
font-style: italic;
|
|
color: #374151;
|
|
}
|
|
|
|
.note-line {
|
|
margin: 0 0 3.6mm 0;
|
|
color: #111827;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.pane {
|
|
border: 1px solid #d1d5db;
|
|
margin: 0 0 3.2mm 0;
|
|
}
|
|
|
|
.pane-title {
|
|
background: #f3f4f6;
|
|
border-bottom: 1px solid #d1d5db;
|
|
padding: 1.4mm 2.2mm;
|
|
font-weight: bold;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.4px;
|
|
font-size: 8pt;
|
|
color: #374151;
|
|
}
|
|
|
|
.pane-body { padding: 2mm 2.2mm; }
|
|
|
|
.two-col {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
table-layout: fixed;
|
|
}
|
|
|
|
.two-col td {
|
|
width: 50%;
|
|
vertical-align: top;
|
|
padding: 0 1.4mm;
|
|
}
|
|
|
|
.two-col td:first-child { padding-left: 0; }
|
|
.two-col td:last-child { padding-right: 0; }
|
|
|
|
table.details {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
table-layout: fixed;
|
|
}
|
|
|
|
table.details td {
|
|
border: 1px solid #e5e7eb;
|
|
padding: 1.4mm 2mm;
|
|
vertical-align: top;
|
|
}
|
|
|
|
table.details td.label {
|
|
width: 40%;
|
|
font-weight: bold;
|
|
color: #374151;
|
|
background: #f9fafb;
|
|
}
|
|
|
|
table.details td.value {
|
|
width: 60%;
|
|
color: #111827;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.sign {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
margin-top: 3.2mm;
|
|
}
|
|
|
|
.sign td {
|
|
width: 50%;
|
|
border: 1px solid #d1d5db;
|
|
padding: 2.2mm 2.5mm;
|
|
vertical-align: bottom;
|
|
}
|
|
|
|
.sig-label {
|
|
font-size: 8.1pt;
|
|
font-weight: bold;
|
|
color: #374151;
|
|
margin-bottom: 4.6mm;
|
|
}
|
|
|
|
.sig-line {
|
|
border-bottom: 1px solid #111827;
|
|
height: 4mm;
|
|
}
|
|
|
|
.payments {
|
|
margin-top: 3.2mm;
|
|
border-top: 1px solid #d1d5db;
|
|
padding-top: 2.6mm;
|
|
}
|
|
|
|
.payments-title {
|
|
font-size: 9.2pt;
|
|
font-weight: bold;
|
|
margin: 0 0 1.8mm 0;
|
|
color: #111827;
|
|
}
|
|
|
|
.payments p { margin: 0 0 1.8mm 0; }
|
|
|
|
.clear { clear: both; }
|
|
</style>
|
|
|
|
<div class="watermark">DRAFT</div>
|
|
<div class="page">
|
|
<div class="header">
|
|
<div class="logo-right">{{ pdf_asset("Fen Edge Logo") }}</div>
|
|
<div class="header-text">
|
|
<p class="title">Membership Renewal 2026-2027</p>
|
|
<p class="subtitle">Fen Edge Community Association</p>
|
|
<hr class="rule">
|
|
<div class="fee-banner">Group Membership Fee: GBP15</div>
|
|
<p class="note">Please amend any details that have changed before returning this form.</p>
|
|
<p class="note-line">Please amend:</p>
|
|
</div>
|
|
<div class="clear"></div>
|
|
</div>
|
|
|
|
<div class="pane">
|
|
<div class="pane-title">Account And Public Contact</div>
|
|
<div class="pane-body">
|
|
<table class="two-col">
|
|
<tr>
|
|
<td>
|
|
<table class="details">
|
|
<tr><td class="label">Account</td><td class="value">{{ account_name }}</td></tr>
|
|
<tr><td class="label">Type</td><td class="value">{{ account_type }}</td></tr>
|
|
<tr><td class="label">Sector</td><td class="value">{{ account_sector }}</td></tr>
|
|
<tr><td class="label">Public Location</td><td class="value">{{ public_location }}</td></tr>
|
|
<tr><td class="label">Members</td><td class="value">{{ account_no_of_members }}</td></tr>
|
|
</table>
|
|
</td>
|
|
<td>
|
|
<table class="details">
|
|
<tr><td class="label">Public Contact</td><td class="value">{{ public_contact_name }}</td></tr>
|
|
<tr><td class="label">Public Email</td><td class="value">{{ public_contact_public_email }}</td></tr>
|
|
<tr><td class="label">Public Phone</td><td class="value">{{ public_contact_public_phone }}</td></tr>
|
|
<tr><td class="label">Facebook</td><td class="value">tbd</td></tr>
|
|
</table>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pane">
|
|
<div class="pane-title">Primary Contact (Contact 1)</div>
|
|
<div class="pane-body">
|
|
<table class="details">
|
|
<tr><td class="label">Name</td><td class="value">{{ contact_1_name }}</td></tr>
|
|
<tr><td class="label">Position</td><td class="value">{{ contact_1_position }}</td></tr>
|
|
<tr><td class="label">Address</td><td class="value">{{ contact_1_address_1 }} {{ contact_1_address_2 }}, {{ contact_1_town }}, {{ contact_1_county }}, {{ contact_1_postcode }}</td></tr>
|
|
<tr><td class="label">Email</td><td class="value">{{ contact_1_email }}</td></tr>
|
|
<tr><td class="label">Phone / Mobile</td><td class="value">{{ contact_1_phone }} {{ contact_1_mobile }}</td></tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pane">
|
|
<div class="pane-title">Secondary Contacts</div>
|
|
<div class="pane-body">
|
|
<table class="two-col">
|
|
<tr>
|
|
<td>
|
|
<table class="details">
|
|
<tr><td class="label">Contact 2 Name</td><td class="value">{{ contact_2_name }}</td></tr>
|
|
<tr><td class="label">Position</td><td class="value">{{ contact_2_position }}</td></tr>
|
|
<tr><td class="label">Email</td><td class="value">{{ contact_2_email }}</td></tr>
|
|
<tr><td class="label">Phone / Mobile</td><td class="value">{{ contact_2_phone }} {{ contact_2_mobile }}</td></tr>
|
|
</table>
|
|
</td>
|
|
<td>
|
|
<table class="details">
|
|
<tr><td class="label">Fen Contact Name</td><td class="value">{{ fen_contact_name }}</td></tr>
|
|
<tr><td class="label">Fen Contact Email</td><td class="value">{{ fen_contact_email }}</td></tr>
|
|
</table>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<table class="sign">
|
|
<tr>
|
|
<td>
|
|
<div class="sig-label">Signed</div>
|
|
<div class="sig-line"></div>
|
|
</td>
|
|
<td>
|
|
<div class="sig-label">Date</div>
|
|
<div class="sig-line"></div>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
|
|
<div class="payments">
|
|
<p class="payments-title">Payment Options</p>
|
|
<p><strong>1. Cheque:</strong> payable to <strong>Fen Edge Community Association</strong>, sent with this form to <strong>FECA Community Office, Cottenham Village College, Cottenham, CB24 8UA</strong>.</p>
|
|
<p><strong>2. BACS:</strong> <strong>Sort Code 20-17-22</strong>, <strong>Account No. 40349178</strong>; then scan and email the form to <strong>info@fenedge.co.uk</strong>.</p>
|
|
</div>
|
|
</div>
|