diff --git a/src/components/Footer.astro b/src/components/Footer.astro
new file mode 100644
index 0000000..28ed9e8
--- /dev/null
+++ b/src/components/Footer.astro
@@ -0,0 +1,24 @@
+
+
+
diff --git a/src/components/Header.astro b/src/components/Header.astro
new file mode 100644
index 0000000..856aaa5
--- /dev/null
+++ b/src/components/Header.astro
@@ -0,0 +1,20 @@
+
+
+
diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro
new file mode 100644
index 0000000..f9468e7
--- /dev/null
+++ b/src/layouts/BaseLayout.astro
@@ -0,0 +1,53 @@
+---
+import 'chota/dist/chota.min.css';
+import '../styles/global.css';
+
+import Header from '../components/Header.astro';
+import Footer from '../components/Footer.astro';
+
+export interface Props {
+ title?: string;
+ description?: string;
+ image?: string;
+}
+
+const {
+ title: titleProp,
+ description = 'Cats of people working in the tech industry',
+ image
+} = Astro.props;
+
+const title = `${titleProp ? `${titleProp} - ` : ''}Cats Of Tech`;
+const imageUrl = image ? new URL(image, Astro.site) : null;
+---
+
+
+
+
+
+
+ {title}
+
+
+
+
+
+
+
+ {
+ imageUrl && (
+ <>
+
+
+ >
+ )
+ }
+
+
+
+
+
+
+
+
+
diff --git a/src/styles/global.css b/src/styles/global.css
new file mode 100644
index 0000000..c993737
--- /dev/null
+++ b/src/styles/global.css
@@ -0,0 +1,8 @@
+:root {
+ --grid-gutter: 3rem;
+}
+
+body {
+ margin: 0 auto;
+ max-width: min(1200px, 85%);
+}