diff --git a/.index-cheatsheet.md b/.index-cheatsheet.md
new file mode 100644
index 00000000..9390bdfc
--- /dev/null
+++ b/.index-cheatsheet.md
@@ -0,0 +1,131 @@
+---
+layout: default
+---
+
+Text can be **bold**, _italic_, or ~~strikethrough~~.
+
+
+
+[Link to another page](./another-page.html).
+
+There should be whitespace between paragraphs.
+
+There should be whitespace between paragraphs. We recommend including a README, or a file with information about your project.
+
+# Header 1
+
+This is a normal paragraph following a header. GitHub is a code hosting platform for version control and collaboration. It lets you and others work together on projects from anywhere.
+
+## Header 2
+
+> This is a blockquote following a header.
+>
+> When something is important enough, you do it even if the odds are not in your favor.
+
+### Header 3
+
+```js
+// Javascript code with syntax highlighting.
+var fun = function lang(l) {
+ dateformat.i18n = require('./lang/' + l)
+ return true;
+}
+```
+
+```ruby
+# Ruby code with syntax highlighting
+GitHubPages::Dependencies.gems.each do |gem, version|
+ s.add_dependency(gem, "= #{version}")
+end
+```
+
+#### Header 4
+
+* This is an unordered list following a header.
+* This is an unordered list following a header.
+* This is an unordered list following a header.
+
+##### Header 5
+
+1. This is an ordered list following a header.
+2. This is an ordered list following a header.
+3. This is an ordered list following a header.
+
+###### Header 6
+
+| head1 | head two | three |
+|:-------------|:------------------|:------|
+| ok | good swedish fish | nice |
+| out of stock | good and plenty | nice |
+| ok | good `oreos` | hmm |
+| ok | good `zoute` drop | yumm |
+
+### There's a horizontal rule below this.
+
+* * *
+
+### Here is an unordered list:
+
+* Item foo
+* Item bar
+* Item baz
+* Item zip
+
+### And an ordered list:
+
+1. Item one
+1. Item two
+1. Item three
+1. Item four
+
+### And a nested list:
+
+- level 1 item
+ - level 2 item
+ - level 2 item
+ - level 3 item
+ - level 3 item
+- level 1 item
+ - level 2 item
+ - level 2 item
+ - level 2 item
+- level 1 item
+ - level 2 item
+ - level 2 item
+- level 1 item
+
+### Small image
+
+
+
+### Large image
+
+
+
+
+### Definition lists can be used with HTML syntax.
+
+
+
Name
+
Godzilla
+
Born
+
1952
+
Birthplace
+
Japan
+
Color
+
Green
+
+
+## Welcome to another page
+
+_yay_
+
+[back](./)
+
+```
+Long, single-line code blocks should not wrap. They should horizontally scroll if they are too long. This line should be long enough to demonstrate this.
+```
+
+```
+The final element.
+```
diff --git a/Gemfile b/Gemfile
index be173b20..29e1a94c 100644
--- a/Gemfile
+++ b/Gemfile
@@ -3,3 +3,5 @@
source "https://rubygems.org"
gemspec
+
+gem "webrick", "~> 1.7"
diff --git a/_config.yml b/_config.yml
index df32348b..520b42cc 100644
--- a/_config.yml
+++ b/_config.yml
@@ -1,5 +1,5 @@
-title: Tactile theme
-description: Tactile is a theme for GitHub Pages.
-show_downloads: true
+title: Miguel Vidal
+description:
+show_downloads: false
google_analytics:
theme: jekyll-theme-tactile
\ No newline at end of file
diff --git a/_layouts/miguel.html b/_layouts/miguel.html
new file mode 100644
index 00000000..1f175801
--- /dev/null
+++ b/_layouts/miguel.html
@@ -0,0 +1,55 @@
+
+
+
+
+
+
+
+
+
+
+
+
+{% seo %}
+ {% include head-custom.html %}
+
+
+
+
+
+
diff --git a/another-page.md b/another-page.md
deleted file mode 100644
index 03ce0c23..00000000
--- a/another-page.md
+++ /dev/null
@@ -1,9 +0,0 @@
----
-layout: default
----
-
-## Welcome to another page
-
-_yay_
-
-[back](./)
diff --git a/assets/css/custom-elements.css b/assets/css/custom-elements.css
new file mode 100644
index 00000000..5b0f95a9
--- /dev/null
+++ b/assets/css/custom-elements.css
@@ -0,0 +1,47 @@
+/* colors */
+.vue-color {
+ color: #3fb984;
+}
+.wp-color {
+ color: #21759b;
+}
+.shopify-color {
+ color: #3a8b32;
+}
+
+.separator {
+ height: .3em;
+}
+
+/* gradient */
+
+.gradient-bg {
+ background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
+ background-size: 400% 400%;
+ -webkit-animation: gradient 15s ease infinite;
+ animation: gradient 15s ease infinite;
+}
+
+@-webkit-keyframes gradient {
+ 0% {
+ background-position: 0% 50%;
+ }
+ 50% {
+ background-position: 100% 50%;
+ }
+ 100% {
+ background-position: 0% 50%;
+ }
+}
+
+@keyframes gradient {
+ 0% {
+ background-position: 0% 50%;
+ }
+ 50% {
+ background-position: 100% 50%;
+ }
+ 100% {
+ background-position: 0% 50%;
+ }
+}
diff --git a/assets/css/custom-fonts.css b/assets/css/custom-fonts.css
new file mode 100644
index 00000000..b498f1d1
--- /dev/null
+++ b/assets/css/custom-fonts.css
@@ -0,0 +1,8 @@
+@font-face {
+ font-family: "Aileron Black";
+ src: url("../fonts/Aileron-Black.otf");
+}
+
+header h1 {
+ font-family: 'Aileron Black', 'Chivo', 'Helvetica Neue', Helvetica, Arial, serif;
+}
\ No newline at end of file
diff --git a/assets/fonts/Aileron-Black.otf b/assets/fonts/Aileron-Black.otf
new file mode 100644
index 00000000..c5eb31fb
Binary files /dev/null and b/assets/fonts/Aileron-Black.otf differ
diff --git a/assets/fonts/Aileron-BlackItalic.otf b/assets/fonts/Aileron-BlackItalic.otf
new file mode 100644
index 00000000..4fdd1670
Binary files /dev/null and b/assets/fonts/Aileron-BlackItalic.otf differ
diff --git a/assets/fonts/Aileron-Bold.otf b/assets/fonts/Aileron-Bold.otf
new file mode 100644
index 00000000..c2bfaabf
Binary files /dev/null and b/assets/fonts/Aileron-Bold.otf differ
diff --git a/assets/fonts/Aileron-BoldItalic.otf b/assets/fonts/Aileron-BoldItalic.otf
new file mode 100644
index 00000000..0de2da9f
Binary files /dev/null and b/assets/fonts/Aileron-BoldItalic.otf differ
diff --git a/assets/fonts/Aileron-Heavy.otf b/assets/fonts/Aileron-Heavy.otf
new file mode 100644
index 00000000..86adc32f
Binary files /dev/null and b/assets/fonts/Aileron-Heavy.otf differ
diff --git a/assets/fonts/Aileron-HeavyItalic.otf b/assets/fonts/Aileron-HeavyItalic.otf
new file mode 100644
index 00000000..5a7b44b4
Binary files /dev/null and b/assets/fonts/Aileron-HeavyItalic.otf differ
diff --git a/assets/fonts/Aileron-Italic.otf b/assets/fonts/Aileron-Italic.otf
new file mode 100644
index 00000000..4fcf7e0b
Binary files /dev/null and b/assets/fonts/Aileron-Italic.otf differ
diff --git a/assets/fonts/Aileron-Light.otf b/assets/fonts/Aileron-Light.otf
new file mode 100644
index 00000000..ec443430
Binary files /dev/null and b/assets/fonts/Aileron-Light.otf differ
diff --git a/assets/fonts/Aileron-LightItalic.otf b/assets/fonts/Aileron-LightItalic.otf
new file mode 100644
index 00000000..5a095abd
Binary files /dev/null and b/assets/fonts/Aileron-LightItalic.otf differ
diff --git a/assets/fonts/Aileron-Regular.otf b/assets/fonts/Aileron-Regular.otf
new file mode 100644
index 00000000..4248f6ff
Binary files /dev/null and b/assets/fonts/Aileron-Regular.otf differ
diff --git a/assets/fonts/Aileron-SemiBold.otf b/assets/fonts/Aileron-SemiBold.otf
new file mode 100644
index 00000000..b1f507df
Binary files /dev/null and b/assets/fonts/Aileron-SemiBold.otf differ
diff --git a/assets/fonts/Aileron-SemiBoldItalic.otf b/assets/fonts/Aileron-SemiBoldItalic.otf
new file mode 100644
index 00000000..2b7924ee
Binary files /dev/null and b/assets/fonts/Aileron-SemiBoldItalic.otf differ
diff --git a/assets/fonts/Aileron-Thin.otf b/assets/fonts/Aileron-Thin.otf
new file mode 100644
index 00000000..39b6e990
Binary files /dev/null and b/assets/fonts/Aileron-Thin.otf differ
diff --git a/assets/fonts/Aileron-ThinItalic.otf b/assets/fonts/Aileron-ThinItalic.otf
new file mode 100644
index 00000000..df40ebf9
Binary files /dev/null and b/assets/fonts/Aileron-ThinItalic.otf differ
diff --git a/assets/fonts/Aileron-UltraLight.otf b/assets/fonts/Aileron-UltraLight.otf
new file mode 100644
index 00000000..4131241b
Binary files /dev/null and b/assets/fonts/Aileron-UltraLight.otf differ
diff --git a/assets/fonts/Aileron-UltraLightItalic.otf b/assets/fonts/Aileron-UltraLightItalic.otf
new file mode 100644
index 00000000..17d762e6
Binary files /dev/null and b/assets/fonts/Aileron-UltraLightItalic.otf differ
diff --git a/favicon.ico b/favicon.ico
new file mode 100644
index 00000000..7cff4ea3
Binary files /dev/null and b/favicon.ico differ
diff --git a/index.md b/index.md
index 86110519..298dc092 100644
--- a/index.md
+++ b/index.md
@@ -1,123 +1,10 @@
---
-layout: default
+layout: miguel
+title: Soy Miguel Vidal
---
-Text can be **bold**, _italic_, or ~~strikethrough~~.
+# Desarrollador web front-end
+# Experiencia con Wordpress, Shopify y Vue.js
+# Figma y Adobe XD
-[Link to another page](./another-page.html).
-
-There should be whitespace between paragraphs.
-
-There should be whitespace between paragraphs. We recommend including a README, or a file with information about your project.
-
-# Header 1
-
-This is a normal paragraph following a header. GitHub is a code hosting platform for version control and collaboration. It lets you and others work together on projects from anywhere.
-
-## Header 2
-
-> This is a blockquote following a header.
->
-> When something is important enough, you do it even if the odds are not in your favor.
-
-### Header 3
-
-```js
-// Javascript code with syntax highlighting.
-var fun = function lang(l) {
- dateformat.i18n = require('./lang/' + l)
- return true;
-}
-```
-
-```ruby
-# Ruby code with syntax highlighting
-GitHubPages::Dependencies.gems.each do |gem, version|
- s.add_dependency(gem, "= #{version}")
-end
-```
-
-#### Header 4
-
-* This is an unordered list following a header.
-* This is an unordered list following a header.
-* This is an unordered list following a header.
-
-##### Header 5
-
-1. This is an ordered list following a header.
-2. This is an ordered list following a header.
-3. This is an ordered list following a header.
-
-###### Header 6
-
-| head1 | head two | three |
-|:-------------|:------------------|:------|
-| ok | good swedish fish | nice |
-| out of stock | good and plenty | nice |
-| ok | good `oreos` | hmm |
-| ok | good `zoute` drop | yumm |
-
-### There's a horizontal rule below this.
-
-* * *
-
-### Here is an unordered list:
-
-* Item foo
-* Item bar
-* Item baz
-* Item zip
-
-### And an ordered list:
-
-1. Item one
-1. Item two
-1. Item three
-1. Item four
-
-### And a nested list:
-
-- level 1 item
- - level 2 item
- - level 2 item
- - level 3 item
- - level 3 item
-- level 1 item
- - level 2 item
- - level 2 item
- - level 2 item
-- level 1 item
- - level 2 item
- - level 2 item
-- level 1 item
-
-### Small image
-
-
-
-### Large image
-
-
-
-
-### Definition lists can be used with HTML syntax.
-
-
-
Name
-
Godzilla
-
Born
-
1952
-
Birthplace
-
Japan
-
Color
-
Green
-
-
-```
-Long, single-line code blocks should not wrap. They should horizontally scroll if they are too long. This line should be long enough to demonstrate this.
-```
-
-```
-The final element.
-```
+# [Mi portfolio](./portfolio)
\ No newline at end of file
diff --git a/portfolio.md b/portfolio.md
new file mode 100644
index 00000000..25a1d31a
--- /dev/null
+++ b/portfolio.md
@@ -0,0 +1,8 @@
+---
+layout: default
+---
+
+# Mi portfolio
+## Elemento 1
+Imagen:
+
\ No newline at end of file