diff --git a/index.html b/index.html
new file mode 100644
index 0000000..48a07d2
--- /dev/null
+++ b/index.html
@@ -0,0 +1,16 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/main.js b/main.js
new file mode 100644
index 0000000..b7412ac
--- /dev/null
+++ b/main.js
@@ -0,0 +1,42 @@
+var books = [
+{
+ title: 'CSS: The Definitive Guide',
+ author: 'Eric Meyer',
+ link: 'http://shop.oreilly.com/product/0636920012726.do',
+ type: 'css',
+},
+{
+ title: 'CSS Development with CSS3',
+ author: 'Zachary Kingston',
+ link: 'http://shop.oreilly.com/product/0636920057970.do',
+ type: 'css',
+},
+{
+ title: 'You Don\'t Know JS: Up & Going',
+ author: 'Kyle Simpson',
+ link: 'http://shop.oreilly.com/product/0636920039303.do',
+ type: 'js',
+},
+{
+ title: 'Programming JavaScript Applications',
+ author: 'Eric Elliott',
+ link: 'http://shop.oreilly.com/product/0636920033141.do',
+ type: 'js',
+},
+{
+ title: 'Modern JavaScript',
+ author: 'unknown',
+ link: 'http://www.oreilly.com/web-platform/free/modern-javascript.csp',
+ type: 'js',
+}
+];
+var n = 0;
+$.each(books, function(){
+ $(".container").append("");
+ $(".book"+ n).append(""+books[n].title+"
");
+ $(".book"+ n).append('')
+ $(".info"+ n).append(""+books[n].author + "
");
+ $(".info"+ n).append(""+books[n].type + "
");
+ $(".info"+ n).append("More");
+ n = n + 1;
+});
diff --git a/master.css b/master.css
new file mode 100644
index 0000000..d4967f9
--- /dev/null
+++ b/master.css
@@ -0,0 +1,50 @@
+*{
+ margin: 0;
+ padding: 0;
+ font-family: futura;
+ font-weight: 200;
+ color: white;
+ text-shadow: 0 0 5px rgba(167, 167, 167, 0.5);
+}
+body{
+ display: flex;
+ align-items: center;
+ justify-content: space-around;
+ background-color: rgb(142, 231, 164)
+}
+.container{
+ margin: 60px 0;
+ width: 80vw;
+ border-top: 2px solid white;
+ display: flex;
+ flex-direction: column;
+ justify-content: space-around;
+}
+.books h1{
+ text-align: center;
+ letter-spacing: 1px;
+}
+.books{
+ border-bottom: 2px solid white;
+ padding: 20px;
+}
+.books .infos{
+ height: 0;
+ opacity: 0;
+ display: flex;
+ transition: opacity 1s ease, height 1s ease;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+}
+.books:hover .infos{
+ height: 100px;
+ opacity: 1;
+}
+a{
+ text-decoration: none;
+ background-color: rgb(233, 138, 138);
+ color: white;
+ padding: 5px 15px;
+ box-shadow: 0px 0px 5px rgba(111, 111, 111, 0.6) ;
+}