diff --git a/drcr/css/tailwind.config.js b/drcr/css/tailwind.config.js
index cd868d8..5f45ab3 100644
--- a/drcr/css/tailwind.config.js
+++ b/drcr/css/tailwind.config.js
@@ -7,5 +7,7 @@ module.exports = {
 			"sans": ["Roboto Flex", "Helvetica", "Arial", "sans-serif"],
 		}
 	},
-	plugins: [],
+	plugins: [
+		require('@tailwindcss/forms'),
+	],
 }
diff --git a/drcr/templates/statements/statement_lines.html b/drcr/templates/statements/statement_lines.html
index 31cc1b2..428b89a 100644
--- a/drcr/templates/statements/statement_lines.html
+++ b/drcr/templates/statements/statement_lines.html
@@ -15,73 +15,107 @@
     along with this program.  If not, see <https://www.gnu.org/licenses/>.
 #}
 
-{% extends 'base.html' %}
+{% extends 'base_tailwind.html' %}
 {% block title %}Statement lines{% endblock %}
 
 {% block content %}
-	<h1 class="h2 mt-4 mb-2">Statement lines</h1>
+	<h1 class="text-3xl text-gray-900">
+		Statement lines
+	</h1>
 	
 	<form method="POST">
-		<div class="py-2 d-flex bg-white sticky-top">
-			<div class="flex-grow-1">
-				<button type="submit" class="btn btn-outline-secondary" formaction="{{ url_for('statement_line_reconcile_transfer') }}">Reconcile selected as transfer</button>
-				<a href="{{ url_for('statement_lines_import') }}" class="btn btn-outline-secondary">Import statement</a>
+		<div class="my-2 py-2 flex bg-white sticky top-0">
+			<div class="grow flex gap-x-2">
+				<button formaction="{{ url_for('statement_line_reconcile_transfer') }}" class="self-baseline px-3 py-1 text-emerald-700 ring-1 ring-inset ring-emerald-600 bg-white hover:bg-gray-50" type="submit">
+					Reconcile selected as transfer
+				</button>
+				<a href="{{ url_for('statement_lines_import') }}" class="self-baseline px-3 py-1 text-gray-800 ring-1 ring-inset ring-gray-400 hover:bg-gray-50">
+					Import statement
+				</a>
 				{% if request.args.get('unclassified', '0') != '1' %}
-					<a href="{{ url_for('statement_lines', **dict(request.args, unclassified=1)) }}" class="btn btn-outline-secondary">Show only unclassified lines</a>
+					<a href="{{ url_for('statement_lines', **dict(request.args, unclassified=1)) }}" class="self-baseline px-3 py-1 text-gray-800 ring-1 ring-inset ring-gray-400 hover:bg-gray-50">
+						Show only unclassified lines
+					</a>
 				{% endif %}
 			</div>
-			<nav class="flex-end">
-				<ul class="pagination">
-					{% if page.prev_num %}<li class="page-item"><a class="page-link" href="{{ url_for('statement_lines', **dict(request.args, page=page.prev_num)) }}">&lsaquo;</a></li>{% endif %}
-					{% for pageno in page.iter_pages() %}
-						{% if pageno %}
-							<li class="page-item{% if pageno == page.page %} active{% endif %}"><a class="page-link" href="{{ url_for('statement_lines', **dict(request.args, page=pageno)) }}">{{ pageno }}</a></li>
+			<nav class="isolate inline-flex -space-x-px rounded-md shadow-sm">
+				{% if page.prev_num %}
+					<a href="{{ url_for('statement_lines', **dict(request.args, page=page.prev_num)) }}" class="relative inline-flex items-center rounded-l-md px-2 py-2 text-gray-400 ring-1 ring-inset ring-gray-300 hover:bg-gray-50">
+						<svg class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
+							<path fill-rule="evenodd" d="M12.79 5.23a.75.75 0 01-.02 1.06L8.832 10l3.938 3.71a.75.75 0 11-1.04 1.08l-4.5-4.25a.75.75 0 010-1.08l4.5-4.25a.75.75 0 011.06.02z" clip-rule="evenodd" />
+						</svg>
+					</a>
+				{% endif %}
+				{% for pageno in page.iter_pages() %}
+					{% if pageno %}
+						{% if pageno == page.page %}
+							<a href="{{ url_for('statement_lines', **dict(request.args, page=pageno)) }}" class="relative inline-flex items-center px-4 py-2 text-sm font-semibold text-white bg-emerald-600">{{ pageno }}</a>
 						{% else %}
-							<li class="page-item disabled"><a class="page-link">…</a></li>
+							<a href="{{ url_for('statement_lines', **dict(request.args, page=pageno)) }}" class="relative inline-flex items-center px-4 py-2 text-sm text-gray-900 ring-1 ring-inset ring-gray-300 hover:bg-gray-50">{{ pageno }}</a>
 						{% endif %}
-					{% endfor %}
-					{% if page.next_num %}<li class="page-item"><a class="page-link" href="{{ url_for('statement_lines', **dict(request.args, page=page.next_num)) }}">&rsaquo;</a></li>{% endif %}
-				</ul>
+					{% else %}
+						<span class="relative inline-flex items-center px-4 py-2 text-sm font-semibold text-gray-700 ring-1 ring-inset ring-gray-300">…</span>
+					{% endif %}
+				{% endfor %}
+				{% if page.next_num %}
+					<a href="{{ url_for('statement_lines', **dict(request.args, page=page.next_num)) }}" class="relative inline-flex items-center rounded-r-md px-2 py-2 text-gray-400 ring-1 ring-inset ring-gray-300 bg-white hover:bg-gray-50">
+						<svg class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
+							<path fill-rule="evenodd" d="M7.21 14.77a.75.75 0 01.02-1.06L11.168 10 7.23 6.29a.75.75 0 111.04-1.08l4.5 4.25a.75.75 0 010 1.08l-4.5 4.25a.75.75 0 01-1.06-.02z" clip-rule="evenodd" />
+						</svg>
+					</a>
+				{% endif %}
 			</nav>
 		</div>
 		
-		<table class="table">
+		<table class="min-w-full">
 			<thead>
-				<tr>
+				<tr class="border-b border-gray-300">
 					<th></th>
-					<th>Source account</th>
-					<th>Date</th>
-					<th>Description</th>
-					<th>Charged to</th>
-					<th class="text-end">Dr</th>
-					<th class="text-end">Cr</th>
-					<th class="text-end">Balance</th>
+					<th class="py-0.5 pr-2 align-bottom text-gray-900 font-semibold text-start">Source account</th>
+					<th class="py-0.5 pr-2 align-bottom text-gray-900 font-semibold text-start">Date</th>
+					<th class="py-0.5 pr-2 align-bottom text-gray-900 font-semibold text-start">Description</th>
+					<th class="py-0.5 pr-2 align-bottom text-gray-900 font-semibold text-start">Charged to</th>
+					<th class="py-0.5 pr-2 align-bottom text-gray-900 font-semibold text-end">Dr</th>
+					<th class="py-0.5 pr-2 align-bottom text-gray-900 font-semibold text-end">Cr</th>
+					<th class="py-0.5 align-bottom text-gray-900 font-semibold text-end">Balance</th>
 				</tr>
 			</thead>
 			<tbody>
 				{% for line in page.items %}
 					<tr data-line-id="{{ line.id }}">
-						<td><input type="checkbox" name="sel-line-id" value="{{ line.id }}"></td>
-						<td><a href="{{ url_for('statement_lines', account=line.source_account) }}">{{ line.source_account }}</a></td>
-						<td>{{ line.dt.strftime('%Y-%m-%d') }}</td>
-						<td>{{ line.description }}</td>
-						<td class="charge-account">
+						<td class="py-0.5 pr-2 align-baseline"><input class="h-4 w-4 border-gray-300 text-emerald-600 focus:ring-emerald-600 -mt-0.5" type="checkbox" name="sel-line-id" value="{{ line.id }}"></td>
+						<td class="py-0.5 pr-2 align-baseline text-gray-900"><a href="{{ url_for('statement_lines', account=line.source_account) }}" class="hover:text-blue-700 hover:underline">{{ line.source_account }}</a></td>
+						<td class="py-0.5 pr-2 align-baseline text-gray-900">{{ line.dt.strftime('%Y-%m-%d') }}</td>
+						<td class="py-0.5 pr-2 align-baseline text-gray-900">{{ line.description }}</td>
+						<td class="charge-account py-0.5 pr-2 align-baseline text-gray-900">
 							{% if not line.reconciliation %}
-								<a href="#" class="text-danger" onclick="classifyLine({{ line.id }});return false;">Unclassified</a>
-								<a href="{{ url_for('statement_line_charge_complex') }}?line-id={{ line.id }}" class="text-muted"><i class="bi bi-pencil"></i></a>
+								<a href="#" class="text-red-500 hover:text-red-600 hover:underline" onclick="classifyLine({{ line.id }});return false;">Unclassified</a>
+								<a href="{{ url_for('statement_line_charge_complex') }}?line-id={{ line.id }}" class="text-gray-500 hover:text-gray-700">
+									<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4 inline align-middle -mt-0.5">
+										<path stroke-linecap="round" stroke-linejoin="round" d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L6.832 19.82a4.5 4.5 0 0 1-1.897 1.13l-2.685.8.8-2.685a4.5 4.5 0 0 1 1.13-1.897L16.863 4.487Zm0 0L19.5 7.125" />
+									</svg>
+								</a>
 							{% elif line.is_complex() %}
 								<i>(Complex)</i>
-								<a href="{{ url_for('journal_edit_transaction', id=line.reconciliation.posting.transaction.id) }}" class="text-muted"><i class="bi bi-pencil"></i></a>
+								<a href="{{ url_for('journal_edit_transaction', id=line.reconciliation.posting.transaction.id) }}" class="text-gray-500 hover:text-gray-700">
+									<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4 inline align-middle -mt-0.5">
+										<path stroke-linecap="round" stroke-linejoin="round" d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L6.832 19.82a4.5 4.5 0 0 1-1.897 1.13l-2.685.8.8-2.685a4.5 4.5 0 0 1 1.13-1.897L16.863 4.487Zm0 0L19.5 7.125" />
+									</svg>
+								</a>
 							{% else %}
 								{% for posting in line.reconciliation.posting.transaction.postings if posting.account != line.source_account %}
-									<a href="#" class="text-body" onclick="classifyLine({{ line.id }});return false;">{{ posting.account }}</a>
+									<a href="#" class="hover:text-blue-700 hover:underline" onclick="classifyLine({{ line.id }});return false;">{{ posting.account }}</a>
 								{% endfor %}
-								<a href="{{ url_for('journal_edit_transaction', id=line.reconciliation.posting.transaction.id) }}" class="text-muted"><i class="bi bi-pencil"></i></a>
+								<a href="{{ url_for('journal_edit_transaction', id=line.reconciliation.posting.transaction.id) }}" class="text-gray-500 hover:text-gray-700">
+									<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4 inline align-middle -mt-0.5">
+										<path stroke-linecap="round" stroke-linejoin="round" d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L6.832 19.82a4.5 4.5 0 0 1-1.897 1.13l-2.685.8.8-2.685a4.5 4.5 0 0 1 1.13-1.897L16.863 4.487Zm0 0L19.5 7.125" />
+									</svg>
+								</a>
 							{% endif %}
 						</td>
-						<td class="text-end">{{ line.amount().format() if line.quantity >= 0 else '' }}</td>
-						<td class="text-end">{{ (line.amount()|abs).format() if line.quantity < 0 else '' }}</td>
-						<td class="text-end">{{ line.balance or '' }}</td>
+						<td class="py-0.5 pr-2 align-baseline text-gray-900 text-end">{{ line.amount().format() if line.quantity >= 0 else '' }}</td>
+						<td class="py-0.5 pr-2 align-baseline text-gray-900 text-end">{{ (line.amount()|abs).format() if line.quantity < 0 else '' }}</td>
+						<td class="py-0.5 align-baseline text-gray-900 text-end">{{ line.balance or '' }}</td>
 					</tr>
 				{% endfor %}
 			</tbody>