diff --git a/Lecture1 b/Lecture1
new file mode 100644
index 0000000000000000000000000000000000000000..86b39d5ba204a24204fa0fcc8550235d4cdf15c4
--- /dev/null
+++ b/Lecture1
@@ -0,0 +1,61 @@
+<html>
+<head>
+
+<link href="https://fonts.googleapis.com/css?family=Open+Sans:300&display=swap" rel="stylesheet">
+<link rel="stylesheet" type="text/css" href="styles.css" media="screen" >
+</head>
+
+
+<body>
+
+<div id="header">
+<div id="title1"></div>
+
+<h1><b>Alfonso Parra Rubio. </b>  aprubio [at] mit.edu</h1>
+<p><a href=index.html><img class="loogo"src="img/logo.png" alt="LOGO" /></img></a></p>
+</div>
+<div id="mySidenav" class="sidenav">
+    <p><span class = "weeknum"><a href="https://alfonso.pages.cba.mit.edu/home/"> _About me</a>   </span></p>
+    <p><span class = "weeknum"><a href="http://cba.mit.edu/about/index.html"> _About my lab</a>   </span></p>
+
+
+</div>
+
+
+
+    <div id="content">
+
+<h1>Lecture 1 and 2.</h1>
+<h4><b>Lecture 1</b> </h4>
+<p>Introduction, folding any shape with a long strip. 1D foldability algorithm.</p>
+
+<h4><b>Lecture 2</b></h4>
+<p>Local behaviour of fold pattern. Single Vortex Crease Pattern, Kawasakis and Maekawas theorems, mountain valley map. </p>
+
+
+
+
+
+
+<p><img class="image" src="img/l11.jpg" width=900px alt="" /></p>
+<p><img class="image" src="img/l12.jpg" width=900px alt="" /></p>
+<p><img class="image" src="img/l13.jpg" width=900px alt="" /></p>
+<p><img class="image" src="img/l14.jpg" width=900px alt="" /></p>
+<p><img class="image" src="img/l15.jpg" width=900px alt="" /></p>
+<p><img class="image" src="img/l16.jpg" width=900px alt="" /></p>
+<p><img class="image" src="img/l17.jpg" width=900px alt="" /></p>
+<p><img class="image" src="img/l18.jpg" width=900px alt="" /></p>
+<p><img class="image" src="img/l21.jpg" width=900px alt="" /></p>
+<p><img class="image" src="img/l22.jpg" width=900px alt="" /></p>
+<p><img class="image" src="img/l23.jpg" width=900px alt="" /></p>
+<p><img class="image" src="img/l24.jpg" width=900px alt="" /></p>
+<p><img class="image" src="img/l25.jpg" width=900px alt="" /></p>
+<p><img class="image" src="img/l26.jpg" width=900px alt="" /></p>
+
+
+
+
+<a href="index.html"> back to menu</a>
+
+    </div> <!-- end content !-->
+    </html>
diff --git a/hw1.html b/hw1.html
new file mode 100644
index 0000000000000000000000000000000000000000..8ec84c992d8bafed0227f7149d82edceb5b46ec8
--- /dev/null
+++ b/hw1.html
@@ -0,0 +1,46 @@
+<html>
+<head>
+
+<link href="https://fonts.googleapis.com/css?family=Open+Sans:300&display=swap" rel="stylesheet">
+<link rel="stylesheet" type="text/css" href="styles.css" media="screen" >
+</head>
+
+
+<body>
+
+<div id="header">
+<div id="title1"></div>
+
+<h1><b>Alfonso Parra Rubio. </b>  aprubio [at] mit.edu</h1>
+<p><a href=index.html><img class="loogo"src="img/logo.png" alt="LOGO" /></img></a></p>
+</div>
+<div id="mySidenav" class="sidenav">
+    <p><span class = "weeknum"><a href="https://alfonso.pages.cba.mit.edu/home/"> _About me</a>   </span></p>
+    <p><span class = "weeknum"><a href="http://cba.mit.edu/about/index.html"> _About my lab</a>   </span></p>
+
+
+</div>
+
+
+
+    <div id="content">
+
+<h1>Problem Set 1.</h1>
+<h4><b>Corresponding to Lectures 1 and 2</b> </h4>
+
+
+<h4><b>Lecture 2</b></h4>
+<p>Local behaviour of fold pattern. Single Vortex Crease Pattern, Kawasakis and Maekawas theorems, mountain valley map. </p>
+
+
+
+<p><embed src="img/ps1.pdf" type="application/pdf"  width=900px  /></p>
+
+
+
+
+
+<a href="index.html"> back to menu</a>
+
+    </div> <!-- end content !-->
+    </html>
diff --git a/img/hw1title.png b/img/hw1title.png
new file mode 100644
index 0000000000000000000000000000000000000000..67cd14dfbe5399b6a2b19ef92cb7aa3c7f4b42f6
Binary files /dev/null and b/img/hw1title.png differ
diff --git a/img/l11.jpg b/img/l11.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..9c7c632ba54c7c292f0fd4ff5adb43d43d9924fa
Binary files /dev/null and b/img/l11.jpg differ
diff --git a/img/l12.jpg b/img/l12.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..fcda77aabef7fbf64cb15b32a78a4a5bb30a80ec
Binary files /dev/null and b/img/l12.jpg differ
diff --git a/img/l13.jpg b/img/l13.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..9f8bca48c04e48a269c487461bd947e86ca37380
Binary files /dev/null and b/img/l13.jpg differ
diff --git a/img/l14.jpg b/img/l14.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..12fb76378cce0c9b424c99b6ed8b8af3fcb1fd57
Binary files /dev/null and b/img/l14.jpg differ
diff --git a/img/l15.jpg b/img/l15.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..48ce5a5e7714db2e7d529fea4a4ed13e7d3d9cc9
Binary files /dev/null and b/img/l15.jpg differ
diff --git a/img/l16.jpg b/img/l16.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..f3a0ad3cac8d6048ad0d56a9d6bbc20fd52c1172
Binary files /dev/null and b/img/l16.jpg differ
diff --git a/img/l17.jpg b/img/l17.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..50a52623c108722b530e3e10b3a9abb3055b71dc
Binary files /dev/null and b/img/l17.jpg differ
diff --git a/img/l18.jpg b/img/l18.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..1bbd1ac32303f5da7e91f825fe4eb1990b79fe95
Binary files /dev/null and b/img/l18.jpg differ
diff --git a/img/l21.jpg b/img/l21.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..f2a7bee9839b9eb240b386ac285b27aa0523ab60
Binary files /dev/null and b/img/l21.jpg differ
diff --git a/img/l22.jpg b/img/l22.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..30607d67061e565f594fb5a034f5fa15b89cd2bd
Binary files /dev/null and b/img/l22.jpg differ
diff --git a/img/l23.jpg b/img/l23.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..a349c48f9668d0d525fc37170270edc9825fcb65
Binary files /dev/null and b/img/l23.jpg differ
diff --git a/img/l24.jpg b/img/l24.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..8b054822ae43d93136889a794af374e202f92427
Binary files /dev/null and b/img/l24.jpg differ
diff --git a/img/l25.jpg b/img/l25.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..fd7ce1cc81a3367d4ff1553058d312b0a2e34f20
Binary files /dev/null and b/img/l25.jpg differ
diff --git a/img/l26.jpg b/img/l26.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..0e154f0ed0c66c9093b70b70bac9e39f00af59be
Binary files /dev/null and b/img/l26.jpg differ
diff --git a/img/lecturetitle.png b/img/lecturetitle.png
new file mode 100644
index 0000000000000000000000000000000000000000..fa7a8f2c9d931664e2937365abcfe564c774d3bd
Binary files /dev/null and b/img/lecturetitle.png differ
diff --git a/img/logo.png b/img/logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..42c1a1d31d5c0ca858ddae12b93c5db10d937397
Binary files /dev/null and b/img/logo.png differ
diff --git a/img/ps1.pdf b/img/ps1.pdf
new file mode 100644
index 0000000000000000000000000000000000000000..c3e2f555e9a4d7ede74a19095d1f1b878be779ef
Binary files /dev/null and b/img/ps1.pdf differ
diff --git a/index.html b/index.html
index 0e278b63c5126983ba4c0882176ed5b0c9e9fb64..f92a3546e2fd95460b6df49773c2c09a2269cdfd 100644
--- a/index.html
+++ b/index.html
@@ -1 +1,38 @@
-hello algorithms
\ No newline at end of file
+<html>
+<head>
+
+<link href="https://fonts.googleapis.com/css?family=Open+Sans:300&display=swap" rel="stylesheet">
+<link rel="stylesheet" type="text/css" href="styles.css" media="screen" >
+</head>
+
+
+<body>
+
+<div id="header">
+<div id="title1"></div>
+
+<h1><b>Alfonso Parra Rubio. </b>  aprubio [at] mit.edu</h1>
+<p><a href=index.html><img class="loogo"src="img/logo.png" alt="LOGO" /></img></a></p>
+</div>
+<div id="mySidenav" class="sidenav">
+    <p><span class = "weeknum"><a href="https://alfonso.pages.cba.mit.edu/home/"> _About me</a>   </span></p>
+    <p><span class = "weeknum"><a href="http://cba.mit.edu/about/index.html"> _About my lab</a>   </span></p>
+
+
+</div>
+
+<div id="container">
+
+<div class="thumb_wrap"><div class="thumb"><b>Lecture1 and Lecture2 </b> Notes<a href="lecture1.html"><img class="thumb_img" src="img/lecturetitle.png" width=800px></a></br></div></div>
+<div class="thumb_wrap"><div class="thumb"><b>HW1</b> Pset 1 due Sept 10th 2020.<a href="hw1.html"><img class="thumb_img" src="img/hw1title.png" width=800px></a></br></div></div>
+
+
+
+</div> <!-- end container !-->
+
+
+
+
+
+</body>
+</html>
diff --git a/styles.css b/styles.css
new file mode 100644
index 0000000000000000000000000000000000000000..e9207a873caea9dff095cdef476b7ee095976ce1
--- /dev/null
+++ b/styles.css
@@ -0,0 +1,180 @@
+body {
+	margin:0px;
+	padding: 0px;
+  font-family: 'Open Sans', sans-serif;
+	font-size: 16px;
+	line-height: 20px;
+
+}
+
+.center {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+  width: 50%;
+}
+
+
+#titulo1 {
+    width: 960px;
+    margin:auto;
+    background-color: white;
+    height : 200px;
+
+}
+#titulo {
+    width: 960px;
+    margin:auto;
+    background-color: white;
+    height : 070px;
+  }
+#image {
+    width: 960px;
+    margin:auto;
+    background-color: white;
+    height : 350px;
+
+}
+
+#general {
+    width: 960px;
+    margin:auto;
+    background-color: white;
+    height : 500px;
+
+}
+#presentacion {
+    width: 550px;
+    float: left;
+    background-color: white;
+    height : 500px;
+    margin :auto;
+  }
+
+#header {
+ margin: auto;
+  width: 1000px;
+  padding: 8px;
+}
+
+.sidenav {
+    height: 100%;
+    width: 150px;
+    position: fixed;
+
+    top: 0;
+    left: 0;
+
+    background-color: #FEFFB8;
+
+
+    padding-top: 450px;
+    padding-left: 15px;
+    overflow-y: auto;
+    font-weight: bold;
+}
+
+
+
+#title1 {
+
+  text-align: left;
+	padding-top: 30px;
+	font-size: 40px;
+	font-weight: bold;
+  color:#00000;
+
+}
+
+#title {
+
+  text-align: center;
+	padding-top: 30px;
+	font-size: 40px;
+	font-weight: bold;
+  color:#00000;
+
+}
+
+#loogo {
+  object-fit: contain;
+
+
+}
+
+
+#container {
+  margin: auto;
+  width: 800px;
+  padding: 10px;
+
+
+}
+
+.thumb_wrap {
+	font-size: 20px;
+	padding-bottom: 100px;
+  text-align: right;
+	float:left;
+}
+
+.thumb_img {
+
+}
+.thumb {
+	cursor: pointer;
+	width:800px;
+	height:281px;
+	float:left;
+	background-color: yellow;
+}
+
+/* Internal Menu */
+
+#menu {
+	width:320px;
+	padding-top: 20px;
+	position: fixed;
+	background-color: grey;
+	height:100%;
+
+}
+
+ul {
+  list-style-type: none;
+  margin: 0;
+  padding: 0;
+}
+
+#menu_list {
+	padding-top: 50px;
+}
+#nav {
+	padding-bottom: 20px;
+}
+
+.thumb_internal img{
+	width:300px;
+}
+
+/* Internal Body */
+
+#content {
+	width:1000px;
+	margin:0 auto;
+	padding-top:20px;
+}
+
+#content .image {
+  margin-left: auto;
+  margin-right: auto;
+  display: block;
+	padding-top: 20px;
+	padding-bottom: 20px;
+
+	max-width: 1000px;
+}
+
+.video {
+	padding-bottom: 20px;
+}