diff --git a/src/lib/form/Form.svelte b/src/lib/form/Form.svelte
index 7d3a374..10e422b 100644
--- a/src/lib/form/Form.svelte
+++ b/src/lib/form/Form.svelte
@@ -1,220 +1,229 @@
 <script>
-	import { onMount } from 'svelte';
-	import html2canvas from 'html2canvas';
-	import Organized from '$lib/form/Organized.svelte';
-	import Colabs from './Colabs.svelte';
-	import {
-		title,
-		heading,
-		subtitle,
-		content,
-		date,
-		time,
-		weekday,
-		address,
-		city,
-		canvas
-	} from '$lib/stores/store';
-
-	/** @type {HTMLDivElement} */ let editor;
-
-	const handleSubmit = async () => {
-		console.log('submit');
-	};
-
-	const getContent = () => {
-		if (!editor) {
-			console.log('no hay editor');
-			return;
-		}
-		if (editor && editor.firstChild !== null) {
-			// @ts-ignore
-			$content = editor.firstChild.innerHTML;
-		}
-	};
-	const saveCanvas = async () => {
-		if ($canvas !== undefined) {
-			const img = await html2canvas($canvas, { scale: 2 });
-			const image = img.toDataURL('image/png');
-			const data = new FormData();
-			data.append('image', image);
-			data.append(
-				'content',
-				JSON.stringify({
-					title: $title,
-					heading: $heading,
-					subtitle: $subtitle,
-					content: $content,
-					date: $date,
-					time: $time,
-					weekday: $weekday,
-					address: $address,
-					city: $city
-				})
-			);
-
-			const req = await fetch('/admin', {
-				method: 'POST',
-				body: data
-			});
-			console.log(req);
-		}
-	};
-
-	const downloadCanvas = async () => {
-		if ($canvas !== undefined) {
-			const res = await html2canvas($canvas, { scale: 2 });
-			const image = res.toDataURL('image/png');
-			const link = document.createElement('a');
-			link.download = `${$date.split('-')[0]}-${$date.split('-')[1]}-${
-				$date.split('-')[2].split('T')[0]
-			}-${$city.replace(' ', '_')}-cartel.png`;
-			link.href = image;
-			link.click();
-		}
-	};
-
-	const quillOptions = {
-		modules: {
-			toolbar: [['bold', 'italic']]
-		},
-		theme: 'snow'
-	};
-
-	onMount(async () => {
-		const { default: Quill } = await import('quill');
-
-		let quill = new Quill(editor, {
-			modules: {
-				toolbar: quillOptions
-			},
-			theme: 'snow',
-			placeholder:
-				'Participan:\nFernando Marín (DMD)\nPresenta:\nFernanda del Castillo (DMD Asturias)'
-		});
-	});
+  import { onMount } from "svelte";
+  import html2canvas from "html2canvas";
+  import Organized from "$lib/form/Organized.svelte";
+  import Colabs from "./Colabs.svelte";
+  import {
+    title,
+    heading,
+    subtitle,
+    content,
+    date,
+    time,
+    weekday,
+    address,
+    city,
+    canvas,
+  } from "$lib/stores/store";
+
+  /** @type {HTMLDivElement} */ let editor;
+
+  const handleSubmit = async () => {
+    console.log("submit");
+  };
+
+  const getContent = () => {
+    if (!editor) {
+      console.log("no hay editor");
+      return;
+    }
+    if (editor && editor.firstChild !== null) {
+      // @ts-ignore
+      $content = editor.firstChild.innerHTML;
+    }
+  };
+  const saveCanvas = async () => {
+    if ($canvas !== undefined) {
+      const img = await html2canvas($canvas, { scale: 2 });
+      const image = img.toDataURL("image/png");
+      const data = new FormData();
+      data.append("image", image);
+      data.append(
+        "content",
+        JSON.stringify({
+          title: $title,
+          heading: $heading,
+          subtitle: $subtitle,
+          content: $content,
+          date: $date,
+          time: $time,
+          weekday: $weekday,
+          address: $address,
+          city: $city,
+        })
+      );
+
+      const req = await fetch("/admin", {
+        method: "POST",
+        body: data,
+      });
+      console.log(req);
+    }
+  };
+
+  const downloadCanvas = async () => {
+    if ($canvas !== undefined) {
+      const res = await html2canvas($canvas, { scale: 2 });
+      const image = res.toDataURL("image/png");
+      const link = document.createElement("a");
+      link.download = `${$date.split("-")[0]}-${$date.split("-")[1]}-${
+        $date.split("-")[2].split("T")[0]
+      }-${$city.replace(" ", "_")}-cartel.png`;
+      link.href = image;
+      link.click();
+    }
+  };
+
+  const quillOptions = {
+    modules: {
+      toolbar: [["bold", "italic"]],
+    },
+    theme: "snow",
+  };
+
+  onMount(async () => {
+    const { default: Quill } = await import("quill");
+
+    let quill = new Quill(editor, {
+      modules: {
+        toolbar: quillOptions,
+      },
+      theme: "snow",
+      placeholder:
+        "Participan:\nFernando Marín (DMD)\nPresenta:\nFernanda del Castillo (DMD Asturias)",
+    });
+  });
 </script>
 
 <form on:submit|preventDefault={handleSubmit}>
-	<div class="form-group">
-		<label for="heading">Tipo de actividad</label>
-		<input
-			bind:value={$heading}
-			type="text"
-			name="heading"
-			placeholder="Ej: Taller, charla, coloquio, debate, curso"
-		/>
-	</div>
-
-	<div clasS="form-group">
-		<label for="title">Título</label>
-		<input bind:value={$title} type="text" name="title" placeholder="Título" />
-	</div>
-
-	<div class="form-group">
-		<label for="subtitle">Subtítulo</label>
-		<input bind:value={$subtitle} type="text" name="subtitle" placeholder="Subtítulo" />
-	</div>
-
-	<div class="form-group">
-		<label for="content">Contenido</label>
-		<div id="editor" on:click={getContent}>
-			<div on:click={getContent} on:keyup={getContent} bind:this={editor} />
-		</div>
-	</div>
-
-	<div class="form-group when">
-		<div class="daymonth">
-			<label for="date">Fecha</label>
-			<input bind:value={$date} type="date" name="date" />
-		</div>
-		<div class="time">
-			<label for="time">Hora</label>
-			<input bind:value={$time} type="time" name="time" />
-		</div>
-		<div class="dayname">
-			<label for="weekday">Día de la semana</label>
-			<input bind:value={$weekday} type="text" name="weekday" placeholder="Ej. Lunes" />
-		</div>
-	</div>
-
-	<div class="form-group">
-		<label for="address">Dirección</label>
-		<textarea
-			bind:value={$address}
-			type="text"
-			name="address"
-			placeholder="Ej. Calle del Abeto, 4"
-		/>
-		<label for="city">Ciudad</label>
-		<input bind:value={$city} type="text" name="" placeholder="Ej. Cádiz" />
-	</div>
-
-	<div class="form-group ">
-		<label for="organizedBy">Organiza:</label>
-		<Organized />
-		<label for="colabs">Colabora:</label>
-		<Colabs />
-	</div>
+  <div class="form-group">
+    <label for="heading">Tipo de actividad</label>
+    <input
+      bind:value={$heading}
+      type="text"
+      name="heading"
+      placeholder="Ej: Taller, charla, coloquio, debate, curso"
+    />
+  </div>
+
+  <div clasS="form-group">
+    <label for="title">Título</label>
+    <input bind:value={$title} type="text" name="title" placeholder="Título" />
+  </div>
+
+  <div class="form-group">
+    <label for="subtitle">Subtítulo</label>
+    <input
+      bind:value={$subtitle}
+      type="text"
+      name="subtitle"
+      placeholder="Subtítulo"
+    />
+  </div>
+
+  <div class="form-group">
+    <label for="content">Contenido</label>
+    <div id="editor" on:click={getContent}>
+      <div on:click={getContent} on:keyup={getContent} bind:this={editor} />
+    </div>
+  </div>
+
+  <div class="form-group when">
+    <div class="daymonth">
+      <label for="date">Fecha</label>
+      <input bind:value={$date} type="date" name="date" />
+    </div>
+    <div class="time">
+      <label for="time">Hora</label>
+      <input bind:value={$time} type="time" name="time" />
+    </div>
+    <div class="dayname">
+      <label for="weekday">Día de la semana</label>
+      <input
+        bind:value={$weekday}
+        type="text"
+        name="weekday"
+        placeholder="Ej. Lunes"
+      />
+    </div>
+  </div>
+
+  <div class="form-group">
+    <label for="address">Dirección</label>
+    <textarea
+      bind:value={$address}
+      name="address"
+      placeholder="Ej. Calle del Abeto, 4"
+    />
+    <label for="city">Ciudad</label>
+    <input bind:value={$city} type="text" name="" placeholder="Ej. Cádiz" />
+  </div>
+
+  <div class="form-group ">
+    <label for="organizedBy">Organiza:</label>
+    <Organized />
+    <label for="colabs">Colabora:</label>
+    <Colabs />
+  </div>
 </form>
 
 <button on:click|preventDefault={downloadCanvas}>Descargar</button>
 <button on:click|preventDefault={saveCanvas}>Guardar</button>
 
 <style>
-	.form-group {
-		margin: 1rem 0;
-	}
-
-	form {
-		margin: 1rem;
-		display: block;
-	}
-
-	.form-group {
-		display: block;
-	}
-
-	input {
-		display: block;
-		width: 100%;
-		font-size: 0.8rem;
-		font-family: sans-serif;
-		padding: 0.5rem;
-	}
-
-	textarea {
-		display: block;
-		width: 100%;
-		font-size: 0.8rem;
-		font-family: sans-serif;
-		padding: 0.5rem;
-		min-height: 3rem;
-		line-height: 1.3rem;
-		resize: vertical;
-	}
-
-	label {
-		display: block;
-		font-size: 0.8rem;
-		font-family: monospace;
-		margin: 0.25rem 0;
-	}
-
-	#editor {
-		background-color: white;
-	}
-
-	button {
-		margin: 1rem;
-		padding: 0.5rem;
-		font-size: 1.1rem;
-		cursor: pointer;
-	}
-
-	.form-group.when {
-		display: grid;
-		grid-template-columns: 1fr 1fr 1fr;
-		grid-gap: 0.25rem;
-	}
+  .form-group {
+    margin: 1rem 0;
+  }
+
+  form {
+    margin: 1rem;
+    display: block;
+  }
+
+  .form-group {
+    display: block;
+  }
+
+  input {
+    display: block;
+    width: 100%;
+    font-size: 0.8rem;
+    font-family: sans-serif;
+    padding: 0.5rem;
+  }
+
+  textarea {
+    display: block;
+    width: 100%;
+    font-size: 0.8rem;
+    font-family: sans-serif;
+    padding: 0.5rem;
+    min-height: 3rem;
+    line-height: 1.3rem;
+    resize: vertical;
+  }
+
+  label {
+    display: block;
+    font-size: 0.8rem;
+    font-family: monospace;
+    margin: 0.25rem 0;
+  }
+
+  #editor {
+    background-color: white;
+  }
+
+  button {
+    margin: 1rem;
+    padding: 0.5rem;
+    font-size: 1.1rem;
+    cursor: pointer;
+  }
+
+  .form-group.when {
+    display: grid;
+    grid-template-columns: 1fr 1fr 1fr;
+    grid-gap: 0.25rem;
+  }
 </style>
diff --git a/src/lib/templates/acuarela.js b/src/lib/templates/acuarela.js
new file mode 100644
index 0000000..89fc25d
--- /dev/null
+++ b/src/lib/templates/acuarela.js
@@ -0,0 +1,117 @@
+import '$lib/templates/templates'
+
+/** @type {import('$lib/templates/templates').Template} */
+export const acuarela = {
+  name: "acuarela",
+  description: "Acuarela",
+  image: "acuarela.png",
+  heading: {
+    top: 20,
+    height: 32,
+    left: 20,
+    right: 350,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 36,
+    textAlign: "left",
+    fontWeight: 400
+  },
+  title: {
+    top: 58,
+    height: 120,
+    left: 8,
+    right: 8,
+    fontSize: 35,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 28,
+    textAlign: "center",
+    fontWeight: 500
+
+  },
+  subtitle: {
+    top: 160,
+    height: 48,
+    left: 8,
+    right: 8,
+    fontSize: 25,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 48,
+    textAlign: "center",
+    fontWeight: 300
+  },
+  content: {
+    top: 480,
+    height: 8.5,
+    left: 1.5,
+    right: 17,
+    fontSize: 0,
+    color: "#222",
+    fontFamily: "sans-serif",
+    lineHeight: 1.1,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  date: {
+    top: 540,
+    height: 32,
+    left: 128,
+    right: 8,
+    fontSize: 32,
+    color: "#fff",
+    fontFamily: "'Arial', sans-serif",
+    lineHeight: 32,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  time: {
+    top: 600,
+    height: 32,
+    left: 128,
+    right: 8,
+    fontSize: 32,
+    color: "#fff",
+    fontFamily: "'Arial', sans-serif",
+    lineHeight: 32,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  weekday: {
+    top: 8,
+    height: 32,
+    left: 8,
+    right: 80,
+    fontSize: 0,
+    color: "#fff",
+    fontFamily: "sans-serif",
+    lineHeight: 1.8,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  address: {
+    top: 650,
+    height: 48,
+    left: 128,
+    right: 8,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 20,
+    textAlign: "left",
+    fontWeight: 400
+  },
+  city: {
+    top: 20,
+    height: 32,
+    left: 240,
+    right: 20,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 36,
+    textAlign: "right",
+    fontWeight: 500
+  },
+}
diff --git a/src/lib/templates/amarillo.js b/src/lib/templates/amarillo.js
new file mode 100644
index 0000000..c841372
--- /dev/null
+++ b/src/lib/templates/amarillo.js
@@ -0,0 +1,117 @@
+import '$lib/templates/templates'
+
+/** @type {import('$lib/templates/templates').Template} */
+export const amarillo = {
+  name: "amarillo",
+  description: "amarillo",
+  image: "amarillo.png",
+  heading: {
+    top: 20,
+    height: 32,
+    left: 20,
+    right: 350,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 36,
+    textAlign: "left",
+    fontWeight: 400
+  },
+  title: {
+    top: 58,
+    height: 120,
+    left: 8,
+    right: 8,
+    fontSize: 35,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 28,
+    textAlign: "center",
+    fontWeight: 500
+
+  },
+  subtitle: {
+    top: 160,
+    height: 48,
+    left: 8,
+    right: 8,
+    fontSize: 25,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 48,
+    textAlign: "center",
+    fontWeight: 300
+  },
+  content: {
+    top: 480,
+    height: 8.5,
+    left: 1.5,
+    right: 17,
+    fontSize: 0,
+    color: "#222",
+    fontFamily: "sans-serif",
+    lineHeight: 1.1,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  date: {
+    top: 540,
+    height: 32,
+    left: 128,
+    right: 8,
+    fontSize: 32,
+    color: "#fff",
+    fontFamily: "'Arial', sans-serif",
+    lineHeight: 32,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  time: {
+    top: 600,
+    height: 32,
+    left: 128,
+    right: 8,
+    fontSize: 32,
+    color: "#fff",
+    fontFamily: "'Arial', sans-serif",
+    lineHeight: 32,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  weekday: {
+    top: 8,
+    height: 32,
+    left: 8,
+    right: 80,
+    fontSize: 0,
+    color: "#fff",
+    fontFamily: "sans-serif",
+    lineHeight: 1.8,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  address: {
+    top: 650,
+    height: 48,
+    left: 128,
+    right: 8,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 20,
+    textAlign: "left",
+    fontWeight: 400
+  },
+  city: {
+    top: 20,
+    height: 32,
+    left: 240,
+    right: 20,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 36,
+    textAlign: "right",
+    fontWeight: 500
+  },
+}
diff --git a/src/lib/templates/corazon.js b/src/lib/templates/corazon.js
index 076c9bd..7ff6bfd 100644
--- a/src/lib/templates/corazon.js
+++ b/src/lib/templates/corazon.js
@@ -9,11 +9,11 @@ export const corazon = {
     top: 20,
     height: 32,
     left: 20,
-    right: 50,
+    right: 350,
     fontSize: 18,
     color: "white",
     fontFamily: "'Alegreya Sans SC', sans-serif",
-    lineHeight: 32,
+    lineHeight: 36,
     textAlign: "left",
     fontWeight: 400
   },
@@ -105,7 +105,7 @@ export const corazon = {
   city: {
     top: 20,
     height: 32,
-    left: 200,
+    left: 240,
     right: 20,
     fontSize: 18,
     color: "white",
diff --git a/src/lib/templates/curvas_azul.js b/src/lib/templates/curvas_azul.js
new file mode 100644
index 0000000..174f8c5
--- /dev/null
+++ b/src/lib/templates/curvas_azul.js
@@ -0,0 +1,117 @@
+import '$lib/templates/templates'
+
+/** @type {import('$lib/templates/templates').Template} */
+export const curvas_azul = {
+  name: "Curvas azul",
+  description: "Curvas azul",
+  image: "curvas_azul.png",
+  heading: {
+    top: 20,
+    height: 32,
+    left: 20,
+    right: 350,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 36,
+    textAlign: "left",
+    fontWeight: 400
+  },
+  title: {
+    top: 58,
+    height: 120,
+    left: 8,
+    right: 8,
+    fontSize: 35,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 28,
+    textAlign: "center",
+    fontWeight: 500
+
+  },
+  subtitle: {
+    top: 160,
+    height: 48,
+    left: 8,
+    right: 8,
+    fontSize: 25,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 48,
+    textAlign: "center",
+    fontWeight: 300
+  },
+  content: {
+    top: 480,
+    height: 8.5,
+    left: 1.5,
+    right: 17,
+    fontSize: 0,
+    color: "#222",
+    fontFamily: "sans-serif",
+    lineHeight: 1.1,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  date: {
+    top: 540,
+    height: 32,
+    left: 128,
+    right: 8,
+    fontSize: 32,
+    color: "#fff",
+    fontFamily: "'Arial', sans-serif",
+    lineHeight: 32,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  time: {
+    top: 600,
+    height: 32,
+    left: 128,
+    right: 8,
+    fontSize: 32,
+    color: "#fff",
+    fontFamily: "'Arial', sans-serif",
+    lineHeight: 32,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  weekday: {
+    top: 8,
+    height: 32,
+    left: 8,
+    right: 80,
+    fontSize: 0,
+    color: "#fff",
+    fontFamily: "sans-serif",
+    lineHeight: 1.8,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  address: {
+    top: 650,
+    height: 48,
+    left: 128,
+    right: 8,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 20,
+    textAlign: "left",
+    fontWeight: 400
+  },
+  city: {
+    top: 20,
+    height: 32,
+    left: 240,
+    right: 20,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 36,
+    textAlign: "right",
+    fontWeight: 500
+  },
+}
diff --git a/src/lib/templates/diente_de_leon.js b/src/lib/templates/diente_de_leon.js
new file mode 100644
index 0000000..0ccb89b
--- /dev/null
+++ b/src/lib/templates/diente_de_leon.js
@@ -0,0 +1,119 @@
+import '$lib/templates/templates'
+
+/** @type {import('$lib/templates/templates').Template} */
+export const diente_de_leon = {
+  name: "diente_de_leon",
+  description: "diente_de_leon",
+  image: "diente_de_leon.png",
+  heading: {
+    top: 20,
+    height: 32,
+    left: 20,
+    right: 350,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 36,
+    textAlign: "left",
+    fontWeight: 400
+  },
+  title: {
+    top: 58,
+    height: 120,
+    left: 8,
+    right: 8,
+    fontSize: 35,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 28,
+    textAlign: "center",
+    fontWeight: 500
+
+  },
+  subtitle: {
+    top: 160,
+    height: 48,
+    left: 8,
+    right: 8,
+    fontSize: 25,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 48,
+    textAlign: "center",
+    fontWeight: 300
+  },
+  content: {
+    top: 480,
+    height: 8.5,
+    left: 1.5,
+    right: 17,
+    fontSize: 0,
+    color: "#222",
+    fontFamily: "sans-serif",
+    lineHeight: 1.1,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  date: {
+    top: 540,
+    height: 32,
+    left: 128,
+    right: 8,
+    fontSize: 32,
+    color: "#fff",
+    fontFamily: "'Arial', sans-serif",
+    lineHeight: 32,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  time: {
+    top: 600,
+    height: 32,
+    left: 128,
+    right: 8,
+    fontSize: 32,
+    color: "#fff",
+    fontFamily: "'Arial', sans-serif",
+    lineHeight: 32,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  weekday: {
+    top: 8,
+    height: 32,
+    left: 8,
+    right: 80,
+    fontSize: 0,
+    color: "#fff",
+    fontFamily: "sans-serif",
+    lineHeight: 1.8,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  address: {
+    top: 650,
+    height: 48,
+    left: 128,
+    right: 8,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 20,
+    textAlign: "left",
+    fontWeight: 400
+  },
+  city: {
+    top: 20,
+    height: 32,
+    left: 240,
+    right: 20,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 36,
+    textAlign: "right",
+    fontWeight: 500
+  },
+}
+
+
diff --git a/src/lib/templates/marroncito.js b/src/lib/templates/marroncito.js
new file mode 100644
index 0000000..6292c03
--- /dev/null
+++ b/src/lib/templates/marroncito.js
@@ -0,0 +1,118 @@
+import '$lib/templates/templates'
+
+/** @type {import('$lib/templates/templates').Template} */
+export const marroncito = {
+  name: "marroncito",
+  description: "marroncito",
+  image: "marroncito.png",
+  heading: {
+    top: 20,
+    height: 32,
+    left: 20,
+    right: 350,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 36,
+    textAlign: "left",
+    fontWeight: 400
+  },
+  title: {
+    top: 58,
+    height: 120,
+    left: 8,
+    right: 8,
+    fontSize: 35,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 28,
+    textAlign: "center",
+    fontWeight: 500
+
+  },
+  subtitle: {
+    top: 160,
+    height: 48,
+    left: 8,
+    right: 8,
+    fontSize: 25,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 48,
+    textAlign: "center",
+    fontWeight: 300
+  },
+  content: {
+    top: 480,
+    height: 8.5,
+    left: 1.5,
+    right: 17,
+    fontSize: 0,
+    color: "#222",
+    fontFamily: "sans-serif",
+    lineHeight: 1.1,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  date: {
+    top: 540,
+    height: 32,
+    left: 128,
+    right: 8,
+    fontSize: 32,
+    color: "#fff",
+    fontFamily: "'Arial', sans-serif",
+    lineHeight: 32,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  time: {
+    top: 600,
+    height: 32,
+    left: 128,
+    right: 8,
+    fontSize: 32,
+    color: "#fff",
+    fontFamily: "'Arial', sans-serif",
+    lineHeight: 32,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  weekday: {
+    top: 8,
+    height: 32,
+    left: 8,
+    right: 80,
+    fontSize: 0,
+    color: "#fff",
+    fontFamily: "sans-serif",
+    lineHeight: 1.8,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  address: {
+    top: 650,
+    height: 48,
+    left: 128,
+    right: 8,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 20,
+    textAlign: "left",
+    fontWeight: 400
+  },
+  city: {
+    top: 20,
+    height: 32,
+    left: 240,
+    right: 20,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 36,
+    textAlign: "right",
+    fontWeight: 500
+  },
+}
+
diff --git a/src/lib/templates/pajaros_papel.js b/src/lib/templates/pajaros_papel.js
new file mode 100644
index 0000000..d278636
--- /dev/null
+++ b/src/lib/templates/pajaros_papel.js
@@ -0,0 +1,118 @@
+import '$lib/templates/templates'
+
+/** @type {import('$lib/templates/templates').Template} */
+export const pajaros_papel = {
+  name: "pajaros_papel",
+  description: "pajaros_papel",
+  image: "pajaros_papel.png",
+  heading: {
+    top: 20,
+    height: 32,
+    left: 20,
+    right: 350,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 36,
+    textAlign: "left",
+    fontWeight: 400
+  },
+  title: {
+    top: 58,
+    height: 120,
+    left: 8,
+    right: 8,
+    fontSize: 35,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 28,
+    textAlign: "center",
+    fontWeight: 500
+
+  },
+  subtitle: {
+    top: 160,
+    height: 48,
+    left: 8,
+    right: 8,
+    fontSize: 25,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 48,
+    textAlign: "center",
+    fontWeight: 300
+  },
+  content: {
+    top: 480,
+    height: 8.5,
+    left: 1.5,
+    right: 17,
+    fontSize: 0,
+    color: "#222",
+    fontFamily: "sans-serif",
+    lineHeight: 1.1,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  date: {
+    top: 540,
+    height: 32,
+    left: 128,
+    right: 8,
+    fontSize: 32,
+    color: "#fff",
+    fontFamily: "'Arial', sans-serif",
+    lineHeight: 32,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  time: {
+    top: 600,
+    height: 32,
+    left: 128,
+    right: 8,
+    fontSize: 32,
+    color: "#fff",
+    fontFamily: "'Arial', sans-serif",
+    lineHeight: 32,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  weekday: {
+    top: 8,
+    height: 32,
+    left: 8,
+    right: 80,
+    fontSize: 0,
+    color: "#fff",
+    fontFamily: "sans-serif",
+    lineHeight: 1.8,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  address: {
+    top: 650,
+    height: 48,
+    left: 128,
+    right: 8,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 20,
+    textAlign: "left",
+    fontWeight: 400
+  },
+  city: {
+    top: 20,
+    height: 32,
+    left: 240,
+    right: 20,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 36,
+    textAlign: "right",
+    fontWeight: 500
+  },
+}
+
diff --git a/src/lib/templates/posits.js b/src/lib/templates/posits.js
index b5fdb00..86be85b 100644
--- a/src/lib/templates/posits.js
+++ b/src/lib/templates/posits.js
@@ -4,7 +4,7 @@ import '$lib/templates/templates'
 export const posits = {
   name: "posits",
   image: "plantilla_posits.jpg",
-  description: "Corazón",
+  description: "Postits",
   heading: {
     top: 100,
     height: 1.2,
diff --git a/src/lib/templates/sanitarios.js b/src/lib/templates/sanitarios.js
new file mode 100644
index 0000000..40d1729
--- /dev/null
+++ b/src/lib/templates/sanitarios.js
@@ -0,0 +1,118 @@
+import '$lib/templates/templates'
+
+/** @type {import('$lib/templates/templates').Template} */
+export const sanitarios = {
+  name: "sanitarios",
+  description: "sanitarios",
+  image: "sanitarios.png",
+  heading: {
+    top: 20,
+    height: 32,
+    left: 20,
+    right: 350,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 36,
+    textAlign: "left",
+    fontWeight: 400
+  },
+  title: {
+    top: 58,
+    height: 120,
+    left: 8,
+    right: 8,
+    fontSize: 35,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 28,
+    textAlign: "center",
+    fontWeight: 500
+
+  },
+  subtitle: {
+    top: 160,
+    height: 48,
+    left: 8,
+    right: 8,
+    fontSize: 25,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 48,
+    textAlign: "center",
+    fontWeight: 300
+  },
+  content: {
+    top: 480,
+    height: 8.5,
+    left: 1.5,
+    right: 17,
+    fontSize: 0,
+    color: "#222",
+    fontFamily: "sans-serif",
+    lineHeight: 1.1,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  date: {
+    top: 540,
+    height: 32,
+    left: 128,
+    right: 8,
+    fontSize: 32,
+    color: "#fff",
+    fontFamily: "'Arial', sans-serif",
+    lineHeight: 32,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  time: {
+    top: 600,
+    height: 32,
+    left: 128,
+    right: 8,
+    fontSize: 32,
+    color: "#fff",
+    fontFamily: "'Arial', sans-serif",
+    lineHeight: 32,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  weekday: {
+    top: 8,
+    height: 32,
+    left: 8,
+    right: 80,
+    fontSize: 0,
+    color: "#fff",
+    fontFamily: "sans-serif",
+    lineHeight: 1.8,
+    textAlign: "left",
+    fontWeight: 700
+  },
+  address: {
+    top: 650,
+    height: 48,
+    left: 128,
+    right: 8,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 20,
+    textAlign: "left",
+    fontWeight: 400
+  },
+  city: {
+    top: 20,
+    height: 32,
+    left: 240,
+    right: 20,
+    fontSize: 18,
+    color: "white",
+    fontFamily: "'Alegreya Sans SC', sans-serif",
+    lineHeight: 36,
+    textAlign: "right",
+    fontWeight: 500
+  },
+}
+
diff --git a/src/lib/templates/templates.js b/src/lib/templates/templates.js
index ed9ab57..f86a476 100644
--- a/src/lib/templates/templates.js
+++ b/src/lib/templates/templates.js
@@ -2,6 +2,13 @@ import { verde } from '$lib/templates/verde';
 import { azul } from '$lib/templates/azul';
 import { corazon } from '$lib/templates/corazon';
 import { posits } from '$lib/templates/posits';
+import { acuarela } from '$lib/templates/acuarela';
+import { amarillo } from '$lib/templates/amarillo';
+import { curvas_azul } from '$lib/templates/curvas_azul';
+import { diente_de_leon } from '$lib/templates/diente_de_leon';
+import { marroncito } from '$lib/templates/marroncito';
+import { pajaros_papel } from '$lib/templates/pajaros_papel';
+import { sanitarios } from '$lib/templates/sanitarios';
 /** 
 * @typedef {{
 * top: number;
@@ -35,4 +42,4 @@ import { posits } from '$lib/templates/posits';
 */
 
 /** @type Array<Template> */
-export const templates = [verde, azul, corazon, posits];
+export const templates = [verde, azul, corazon, posits, acuarela, amarillo, curvas_azul, diente_de_leon, marroncito, pajaros_papel, sanitarios];
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 3c19828..ae698ba 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -12,23 +12,21 @@
 <section>
   <p>Elige plantilla</p>
   <div class="main">
-    <ul>
-      {#each templates as template}
-        <li>
-          <a href="/{template.name}" data-sveltekit-prefetch
-            ><img
-              src="/{template.image}"
-              alt="Plantilla en blanco estilo {template.name}"
-            />
-            {#if template.description}
-              <div class="caption">{@html template.description}</div>
-            {:else}
-              <div class="caption">{template.name}</div>
-            {/if}
-          </a>
-        </li>
-      {/each}
-    </ul>
+    {#each templates as template}
+      <div class="element">
+        <a href="/{template.name}" data-sveltekit-prefetch
+          ><img
+            src="/{template.image}"
+            alt="Plantilla en blanco estilo {template.name}"
+          />
+          {#if template.description}
+            <div class="caption">{@html template.description}</div>
+          {:else}
+            <div class="caption">{template.name}</div>
+          {/if}
+        </a>
+      </div>
+    {/each}
   </div>
 </section>
 
@@ -42,8 +40,8 @@
 
   .main {
     display: grid;
-    grid-auto-columns: 1fr;
-    grid-auto-rows: 1fr;
+    grid-template-columns: repeat(4, min-content);
+    /* grid-auto-rows: 1fr; */
     grid-gap: 1rem;
     padding: 1rem 0;
   }
@@ -51,11 +49,7 @@
     font-size: 1.5rem;
     color: #333;
   }
-  ul {
-    list-style: none;
-    display: flex;
-  }
-  li {
+  .element {
     line-height: 2rem;
     display: inline-block;
     padding: 0.25rem;
@@ -82,4 +76,9 @@
     text-align: left;
     padding: 0.25rem;
   }
+  @media (max-width: 768px) {
+    .main {
+      grid-template-columns: repeat(2, min-content);
+    }
+  }
 </style>
diff --git a/static/acuarela.png b/static/acuarela.png
new file mode 100644
index 0000000..47edbce
Binary files /dev/null and b/static/acuarela.png differ
diff --git a/static/amarillo.png b/static/amarillo.png
new file mode 100644
index 0000000..164acac
Binary files /dev/null and b/static/amarillo.png differ
diff --git a/static/curvas_azul.png b/static/curvas_azul.png
new file mode 100644
index 0000000..29edcbb
Binary files /dev/null and b/static/curvas_azul.png differ
diff --git a/static/diente_de_leon.png b/static/diente_de_leon.png
new file mode 100644
index 0000000..18121d2
Binary files /dev/null and b/static/diente_de_leon.png differ
diff --git a/static/marroncito.png b/static/marroncito.png
new file mode 100644
index 0000000..8794f57
Binary files /dev/null and b/static/marroncito.png differ
diff --git a/static/pajaros_papel.png b/static/pajaros_papel.png
new file mode 100644
index 0000000..ebc7f29
Binary files /dev/null and b/static/pajaros_papel.png differ
diff --git a/static/sanitarios.png b/static/sanitarios.png
new file mode 100644
index 0000000..e3bb773
Binary files /dev/null and b/static/sanitarios.png differ