diff --git a/package-lock.json b/package-lock.json
index 0dd08314..1fde9d51 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -4525,6 +4525,11 @@
         "glogg": "https://registry.npmjs.org/glogg/-/glogg-1.0.0.tgz"
       }
     },
+    "hammerjs": {
+      "version": "2.0.8",
+      "resolved": "https://registry.npmjs.org/hammerjs/-/hammerjs-2.0.8.tgz",
+      "integrity": "sha1-BO93hiz/K7edMPdpIJWTAiK/YPE="
+    },
     "handle-thing": {
       "version": "https://registry.npmjs.org/handle-thing/-/handle-thing-1.2.5.tgz",
       "integrity": "sha1-/Xqtcmvxpf0W38KbL3pmAdJxOcQ=",
@@ -5271,8 +5276,7 @@
     },
     "jquery": {
       "version": "https://registry.npmjs.org/jquery/-/jquery-3.2.1.tgz",
-      "integrity": "sha1-XE2d5lKvbNCncBVKYxu6ErAVx4c=",
-      "dev": true
+      "integrity": "sha1-XE2d5lKvbNCncBVKYxu6ErAVx4c="
     },
     "js-base64": {
       "version": "https://registry.npmjs.org/js-base64/-/js-base64-2.1.9.tgz",
@@ -5877,6 +5881,15 @@
         "node-emoji": "https://registry.npmjs.org/node-emoji/-/node-emoji-1.5.1.tgz"
       }
     },
+    "materialize-css": {
+      "version": "0.100.2",
+      "resolved": "https://registry.npmjs.org/materialize-css/-/materialize-css-0.100.2.tgz",
+      "integrity": "sha512-Bf4YeoJCIdk4dlpnmVX+DIOJBbqOKwfBPD+tT5bxwXNFMLk649CGbldqtnctkkfMp+fGgSAsdYu9lo1ZolZqgA==",
+      "requires": {
+        "hammerjs": "2.0.8",
+        "jquery": "https://registry.npmjs.org/jquery/-/jquery-3.2.1.tgz"
+      }
+    },
     "md5": {
       "version": "https://registry.npmjs.org/md5/-/md5-2.2.1.tgz",
       "integrity": "sha1-U6s41f48iJG6RlMp6iP6wFQBJvk=",
diff --git a/package.json b/package.json
index b8ff77c7..08239cc8 100644
--- a/package.json
+++ b/package.json
@@ -19,6 +19,7 @@
     "vue": "^2.4.3"
   },
   "dependencies": {
-    "composer": "^0.14.2"
+    "composer": "^0.14.2",
+    "materialize-css": "^0.100.2"
   }
 }
diff --git a/resources/views/layouts/app.blade.php b/resources/views/layouts/app.blade.php
index c9d39038..5f5eba32 100644
--- a/resources/views/layouts/app.blade.php
+++ b/resources/views/layouts/app.blade.php
@@ -3,7 +3,9 @@
         <meta charset="utf-8">
         <meta http-equiv="X-UA-Compatible" content="IE=edge">
         <meta name="viewport" content="width=device-width, initial-scale=1">
-        <link href="/css/app.css" rel="stylesheet" type="text/css">
+        <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
+        
+        <link href="/css/app.css" rel="stylesheet" type="text/css" media="screen/projection">
         <script src="https://use.fontawesome.com/c7dd014e97.js"></script>
         <title>@yield('title') - Gastro</title>
     </head>
diff --git a/webpack.mix.js b/webpack.mix.js
index d6bf54be..74113ccd 100644
--- a/webpack.mix.js
+++ b/webpack.mix.js
@@ -13,8 +13,10 @@ const { mix } = require('laravel-mix');
 
 mix.scripts([
 	'node_modules/jquery/dist/jquery.min.js',
-	'node_modules/tether/dist/js/tether.min.js',
-	'node_modules/bootstrap/dist/js/bootstrap.min.js',
+	'node_modules/materialize-css/dist/js/materialize.min.js',
 	'resources/assets/js/site.js'
 	], 'public/js/app.js')
-   .sass('resources/assets/sass/app.scss', 'public/css');
+   .sass('resources/assets/sass/app.scss', 'public/css')
+   .css(
+	   'node_modules/materialize-css/dist/css/materialize.css'
+   );