diff --git a/package-lock.json b/package-lock.json
index 5759af94eb14ea75d249fd305293b620435f6102..78368c996343f8c59c2c611a3c0b8b9d01881767 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2965,9 +2965,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -3916,14 +3916,32 @@
       }
     },
     "browserslist": {
-      "version": "4.12.0",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.12.0.tgz",
-      "integrity": "sha512-UH2GkcEDSI0k/lRkuDSzFl9ZZ87skSy9w2XAn1MsZnL+4c4rqbBd3e82UWHbYDpztABrPBhZsTEeuxVfHppqDg==",
+      "version": "4.16.6",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.16.6.tgz",
+      "integrity": "sha512-Wspk/PqO+4W9qp5iUTJsa1B/QrYn1keNCcEP5OvP7WBwT4KaDly0uONYmC6Xa3Z5IqnUgS0KcgLYu1l74x0ZXQ==",
       "requires": {
-        "caniuse-lite": "^1.0.30001043",
-        "electron-to-chromium": "^1.3.413",
-        "node-releases": "^1.1.53",
-        "pkg-up": "^2.0.0"
+        "caniuse-lite": "^1.0.30001219",
+        "colorette": "^1.2.2",
+        "electron-to-chromium": "^1.3.723",
+        "escalade": "^3.1.1",
+        "node-releases": "^1.1.71"
+      },
+      "dependencies": {
+        "caniuse-lite": {
+          "version": "1.0.30001239",
+          "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001239.tgz",
+          "integrity": "sha512-cyBkXJDMeI4wthy8xJ2FvDU6+0dtcZSJW3voUF8+e9f1bBeuvyZfc3PNbkOETyhbR+dGCPzn9E7MA3iwzusOhQ=="
+        },
+        "electron-to-chromium": {
+          "version": "1.3.755",
+          "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.755.tgz",
+          "integrity": "sha512-BJ1s/kuUuOeo1bF/EM2E4yqW9te0Hpof3wgwBx40AWJE18zsD1Tqo0kr7ijnOc+lRsrlrqKPauJAHqaxOItoUA=="
+        },
+        "node-releases": {
+          "version": "1.1.73",
+          "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.73.tgz",
+          "integrity": "sha512-uW7fodD6pyW2FZNZnp/Z3hvWKeEW1Y8R1+1CnErE8cXFXzl5blBOoVB41CvMer6P6Q0S5FXDwcHgFd1Wj0U9zg=="
+        }
       }
     },
     "bser": {
@@ -4014,9 +4032,9 @@
       },
       "dependencies": {
         "y18n": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.0.tgz",
-          "integrity": "sha512-r9S/ZyXu/Xu9q1tYlpsLIsa3EeLXXk0VwlxqTcFRfg9EhMW+17kbt9G0NrgCmhGb5vT2hyhJZLfDGx+7+5Uj/w=="
+          "version": "4.0.3",
+          "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.3.tgz",
+          "integrity": "sha512-JKhqTOwSrqNA1NY5lSztJ1GrBiUodLMmIZuLiDaMRJ+itFd+ABVE8XBjOvIWL+rSqNDC74LCSFmlb/U4UZ4hJQ=="
         }
       }
     },
@@ -4475,6 +4493,11 @@
         "simple-swizzle": "^0.2.2"
       }
     },
+    "colorette": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/colorette/-/colorette-1.2.2.tgz",
+      "integrity": "sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w=="
+    },
     "colornames": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/colornames/-/colornames-1.1.1.tgz",
@@ -4823,9 +4846,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -4867,9 +4890,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -4906,9 +4929,9 @@
           "integrity": "sha512-MsCAG1z9lPdoO/IUMLSBWBSVxVtJ1395VGIQ+Fc2gNdkQ1hNDnQdw3YhA71WJCBW1vdwA0cAnk/DnW6bqoEUYg=="
         },
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -4968,9 +4991,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -5123,9 +5146,9 @@
           }
         },
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -5190,9 +5213,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -5233,9 +5256,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -5640,9 +5663,9 @@
       "integrity": "sha1-s55/HabrCnW6nBcySzR1PEfgZU0="
     },
     "dns-packet": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.3.1.tgz",
-      "integrity": "sha512-0UxfQkMhYAUaZI+xrNZOz/as5KgDU0M/fQ9b6SpkyLbk3GEswDi6PADJVaYJradtRVsRIlF1zLyOodbcTCDzUg==",
+      "version": "1.3.4",
+      "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.3.4.tgz",
+      "integrity": "sha512-BQ6F4vycLXBvdrJZ6S3gZewt6rcrks9KBgM9vrhW+knGRqc8uEdT7fuCwloc7nny5xNoMJ17HGH0R/6fpo8ECA==",
       "requires": {
         "ip": "^1.1.0",
         "safe-buffer": "^5.0.1"
@@ -5728,11 +5751,18 @@
       }
     },
     "domhandler": {
-      "version": "2.4.2",
-      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.2.tgz",
-      "integrity": "sha512-JiK04h0Ht5u/80fdLMCEmV4zkNh2BcoMFBmZ/91WtYZ8qVXSKjiw7fXMgFPnHcSZgOo3XdinHvmnDUeMf5R4wA==",
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-4.2.0.tgz",
+      "integrity": "sha512-zk7sgt970kzPks2Bf+dwT/PLzghLnsivb9CcxkvR8Mzr66Olr0Ofd8neSbglHJHaHa2MadfoSdNlKYAaafmWfA==",
       "requires": {
-        "domelementtype": "1"
+        "domelementtype": "^2.2.0"
+      },
+      "dependencies": {
+        "domelementtype": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.2.0.tgz",
+          "integrity": "sha512-DtBMo82pv1dFtUmHyr48beiuq792Sxohr+8Hm9zoxklYPfa6n0Z3Byjj2IV7bmr2IyqClnqEQhfgHJJ5QF0R5A=="
+        }
       }
     },
     "domutils": {
@@ -5999,8 +6029,7 @@
     "escalade": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz",
-      "integrity": "sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==",
-      "dev": true
+      "integrity": "sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw=="
     },
     "escape-html": {
       "version": "1.0.3",
@@ -8287,9 +8316,9 @@
       "integrity": "sha512-9Qn4yBxelxoh2Ow62nP+Ka/kMnOXRi8BXnRaUwezLNhqelnN49xKz4F/dPP8OYLxLxq6JDtZb2i9XznUQbNPTg=="
     },
     "handlebars": {
-      "version": "4.7.6",
-      "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.7.6.tgz",
-      "integrity": "sha512-1f2BACcBfiwAfStCKZNrUCgqNZkGsAT7UM3kkYtXuLo0KnaVfjKOyf7PRzB6++aK9STyT1Pd2ZCPe3EGOXleXA==",
+      "version": "4.7.7",
+      "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.7.7.tgz",
+      "integrity": "sha512-aAcXm5OAfE/8IXkcZvCepKU3VzW1/39Fb5ZuqMtgI/hT8X2YgoMvBY5dLhq/cpOvw7Lk1nK/UF71aLG/ZnVYRA==",
       "requires": {
         "minimist": "^1.2.5",
         "neo-async": "^2.6.0",
@@ -8304,13 +8333,10 @@
           "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g=="
         },
         "uglify-js": {
-          "version": "3.9.4",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.9.4.tgz",
-          "integrity": "sha512-8RZBJq5smLOa7KslsNsVcSH+KOXf1uDU8yqLeNuVKwmT0T3FA0ZoXlinQfRad7SDcbZZRZE4ov+2v71EnxNyCA==",
-          "optional": true,
-          "requires": {
-            "commander": "~2.20.3"
-          }
+          "version": "3.13.9",
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.13.9.tgz",
+          "integrity": "sha512-wZbyTQ1w6Y7fHdt8sJnHfSIuWeDgk6B5rCb4E/AM6QNNPbOMIZph21PW5dRB3h7Df0GszN+t7RuUH6sWK5bF0g==",
+          "optional": true
         }
       }
     },
@@ -8486,9 +8512,9 @@
       "integrity": "sha512-HRcs+2mr52W0K+x8RzcLzuPPmVIKMSv97RGHy0Ea9y/mpcaK+xTrjICA04KAHi4GRzxliNqNJEFYWHghy3rSfQ=="
     },
     "hosted-git-info": {
-      "version": "2.8.8",
-      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.8.tgz",
-      "integrity": "sha512-f/wzC2QaWBs7t9IYqB4T3sR1xviIViXJRJTWBlx2Gf3g0Xi5vI7Yy4koXQ1c9OYDGHN9sBy1DQ2AB8fqZBWhUg=="
+      "version": "2.8.9",
+      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.9.tgz",
+      "integrity": "sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw=="
     },
     "hpack.js": {
       "version": "2.1.6",
@@ -8626,22 +8652,40 @@
       }
     },
     "htmlparser2": {
-      "version": "3.10.1",
-      "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.10.1.tgz",
-      "integrity": "sha512-IgieNijUMbkDovyoKObU1DUhm1iwNYE/fuifEoEHfd1oZKZDaONBSkal7Y01shxsM49R4XaMdGez3WnF9UfiCQ==",
-      "requires": {
-        "domelementtype": "^1.3.1",
-        "domhandler": "^2.3.0",
-        "domutils": "^1.5.1",
-        "entities": "^1.1.1",
-        "inherits": "^2.0.1",
-        "readable-stream": "^3.1.1"
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-6.1.0.tgz",
+      "integrity": "sha512-gyyPk6rgonLFEDGoeRgQNaEUvdJ4ktTmmUh/h2t7s+M8oPpIPxgNACWa+6ESR57kXstwqPiCut0V8NRpcwgU7A==",
+      "requires": {
+        "domelementtype": "^2.0.1",
+        "domhandler": "^4.0.0",
+        "domutils": "^2.5.2",
+        "entities": "^2.0.0"
       },
       "dependencies": {
-        "entities": {
-          "version": "1.1.2",
-          "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.2.tgz",
-          "integrity": "sha512-f2LZMYl1Fzu7YSBKg+RoROelpOaNrcGmE9AZubeDfrCEia483oW4MI4VyFd5VNHIgQ/7qm1I0wUHK1eJnn2y2w=="
+        "dom-serializer": {
+          "version": "1.3.2",
+          "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.3.2.tgz",
+          "integrity": "sha512-5c54Bk5Dw4qAxNOI1pFEizPSjVsx5+bpJKmL2kPn8JhBUq2q09tTCa3mjijun2NfK78NMouDYNMBkOrPZiS+ig==",
+          "requires": {
+            "domelementtype": "^2.0.1",
+            "domhandler": "^4.2.0",
+            "entities": "^2.0.0"
+          }
+        },
+        "domelementtype": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.2.0.tgz",
+          "integrity": "sha512-DtBMo82pv1dFtUmHyr48beiuq792Sxohr+8Hm9zoxklYPfa6n0Z3Byjj2IV7bmr2IyqClnqEQhfgHJJ5QF0R5A=="
+        },
+        "domutils": {
+          "version": "2.7.0",
+          "resolved": "https://registry.npmjs.org/domutils/-/domutils-2.7.0.tgz",
+          "integrity": "sha512-8eaHa17IwJUPAiB+SoTYBo5mCdeMgdcAoXJ59m6DT1vw+5iLS3gNoqYaRowaBKtGVrOF1Jz4yDTgYKLK2kvfJg==",
+          "requires": {
+            "dom-serializer": "^1.0.1",
+            "domelementtype": "^2.2.0",
+            "domhandler": "^4.2.0"
+          }
         }
       }
     },
@@ -10643,9 +10687,9 @@
       }
     },
     "lodash": {
-      "version": "4.17.20",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.20.tgz",
-      "integrity": "sha512-PlhdFcillOINfeV7Ni6oF1TAEayyZBoZ8bcshTHqOYJYlrqzRK5hagpagky5o4HfCzzd1TRkXPMFq6cKk9rGmA=="
+      "version": "4.17.21",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
+      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
     },
     "lodash-es": {
       "version": "4.17.21",
@@ -10922,9 +10966,9 @@
       }
     },
     "merge-deep": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/merge-deep/-/merge-deep-3.0.2.tgz",
-      "integrity": "sha512-T7qC8kg4Zoti1cFd8Cr0M+qaZfOwjlPDEdZIIPPB2JZctjaPM4fX+i7HOId69tAti2fvO6X5ldfYUONDODsrkA==",
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/merge-deep/-/merge-deep-3.0.3.tgz",
+      "integrity": "sha512-qtmzAS6t6grwEkNrunqTBdn0qKwFgNWvlxUbAV8es9M7Ot1EbyApytCnvE0jALPa46ZpKDUo527kKiaWplmlFA==",
       "requires": {
         "arr-union": "^3.1.0",
         "clone-deep": "^0.2.4",
@@ -13904,9 +13948,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -13939,9 +13983,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -13978,9 +14022,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14013,9 +14057,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14047,9 +14091,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14082,9 +14126,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14116,9 +14160,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14153,9 +14197,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14187,9 +14231,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14220,9 +14264,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14254,9 +14298,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14293,9 +14337,9 @@
           "integrity": "sha512-MsCAG1z9lPdoO/IUMLSBWBSVxVtJ1395VGIQ+Fc2gNdkQ1hNDnQdw3YhA71WJCBW1vdwA0cAnk/DnW6bqoEUYg=="
         },
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14342,9 +14386,9 @@
           "integrity": "sha512-MsCAG1z9lPdoO/IUMLSBWBSVxVtJ1395VGIQ+Fc2gNdkQ1hNDnQdw3YhA71WJCBW1vdwA0cAnk/DnW6bqoEUYg=="
         },
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14385,9 +14429,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14418,9 +14462,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14451,9 +14495,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14484,9 +14528,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14518,9 +14562,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14552,9 +14596,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14585,9 +14629,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14618,9 +14662,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14651,9 +14695,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14684,9 +14728,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14717,9 +14761,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14751,9 +14795,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14785,9 +14829,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14820,9 +14864,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14910,9 +14954,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14943,9 +14987,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -14976,9 +15020,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15012,9 +15056,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15050,9 +15094,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15094,9 +15138,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15130,9 +15174,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15168,9 +15212,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15204,9 +15248,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15282,9 +15326,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15315,9 +15359,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15350,9 +15394,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15386,9 +15430,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15422,9 +15466,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15457,9 +15501,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15492,9 +15536,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15527,9 +15571,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15563,9 +15607,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15597,9 +15641,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15632,9 +15676,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15665,9 +15709,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15698,9 +15742,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15732,9 +15776,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15801,9 +15845,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15840,9 +15884,9 @@
           "integrity": "sha512-MsCAG1z9lPdoO/IUMLSBWBSVxVtJ1395VGIQ+Fc2gNdkQ1hNDnQdw3YhA71WJCBW1vdwA0cAnk/DnW6bqoEUYg=="
         },
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15886,9 +15930,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15922,9 +15966,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15955,9 +15999,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -15988,9 +16032,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -16022,9 +16066,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -16056,9 +16100,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -16102,9 +16146,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -16137,9 +16181,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -16383,9 +16427,9 @@
       "integrity": "sha1-nsYfeQSYdXB9aUFFlv2Qek1xHnM="
     },
     "querystringify": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.1.1.tgz",
-      "integrity": "sha512-w7fLxIRCRT7U8Qu53jQnJyPkYZIaR4n5151KMfcJlO/A9397Wxb1amJvROTK6TOnp7PfoAmg/qXiNHI+08jRfA=="
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.2.0.tgz",
+      "integrity": "sha512-FIqgj2EUvTa7R50u0rGsyTftzjYmv/a3hO345bZNrqabNqjtgiDMgmo4mkUjd+nzU5oF3dClKqFIPUKybUyqoQ=="
     },
     "raf": {
       "version": "3.4.1",
@@ -17111,9 +17155,9 @@
       }
     },
     "react-dropdown": {
-      "version": "1.9.0",
-      "resolved": "https://registry.npmjs.org/react-dropdown/-/react-dropdown-1.9.0.tgz",
-      "integrity": "sha512-BDApCUhs0qHqnFW3b54SuqI200FOOsmiy0dejdmtdTn/MMY11jcou3CLX1oT2Qa1PdN7viTyAGT8YCpK5qb9xg==",
+      "version": "1.9.2",
+      "resolved": "https://registry.npmjs.org/react-dropdown/-/react-dropdown-1.9.2.tgz",
+      "integrity": "sha512-g4eufErTi5P5T5bGK+VmLl//qvAHy79jm6KKx8G2Tl3mG90bpigb+Aw85P+C2JUdAnIIQdv8kP/oHN314GvAfw==",
       "requires": {
         "classnames": "^2.2.3"
       }
@@ -17979,40 +18023,65 @@
       "integrity": "sha1-wkvOKig62tW8P1jg1IJJuSN52O8="
     },
     "renderkid": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/renderkid/-/renderkid-2.0.3.tgz",
-      "integrity": "sha512-z8CLQp7EZBPCwCnncgf9C4XAi3WR0dv+uWu/PjIyhhAb5d6IJ/QZqlHFprHeKT+59//V6BNUsLbvN8+2LarxGA==",
+      "version": "2.0.7",
+      "resolved": "https://registry.npmjs.org/renderkid/-/renderkid-2.0.7.tgz",
+      "integrity": "sha512-oCcFyxaMrKsKcTY59qnCAtmDVSLfPbrv6A3tVbPdFMMrv5jaK10V6m40cKsoPNhAqN6rmHW9sswW4o3ruSrwUQ==",
       "requires": {
-        "css-select": "^1.1.0",
-        "dom-converter": "^0.2",
-        "htmlparser2": "^3.3.0",
-        "strip-ansi": "^3.0.0",
-        "utila": "^0.4.0"
+        "css-select": "^4.1.3",
+        "dom-converter": "^0.2.0",
+        "htmlparser2": "^6.1.0",
+        "lodash": "^4.17.21",
+        "strip-ansi": "^3.0.1"
       },
       "dependencies": {
         "css-select": {
-          "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz",
-          "integrity": "sha1-KzoRBTnFNV8c2NMUYj6HCxIeyFg=",
+          "version": "4.1.3",
+          "resolved": "https://registry.npmjs.org/css-select/-/css-select-4.1.3.tgz",
+          "integrity": "sha512-gT3wBNd9Nj49rAbmtFHj1cljIAOLYSX1nZ8CB7TBO3INYckygm5B7LISU/szY//YmdiSLbJvDLOx9VnMVpMBxA==",
           "requires": {
-            "boolbase": "~1.0.0",
-            "css-what": "2.1",
-            "domutils": "1.5.1",
-            "nth-check": "~1.0.1"
+            "boolbase": "^1.0.0",
+            "css-what": "^5.0.0",
+            "domhandler": "^4.2.0",
+            "domutils": "^2.6.0",
+            "nth-check": "^2.0.0"
           }
         },
         "css-what": {
-          "version": "2.1.3",
-          "resolved": "https://registry.npmjs.org/css-what/-/css-what-2.1.3.tgz",
-          "integrity": "sha512-a+EPoD+uZiNfh+5fxw2nO9QwFa6nJe2Or35fGY6Ipw1R3R4AGz1d1TEZrCegvw2YTmZ0jXirGYlzxxpYSHwpEg=="
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/css-what/-/css-what-5.0.1.tgz",
+          "integrity": "sha512-FYDTSHb/7KXsWICVsxdmiExPjCfRC4qRFBdVwv7Ax9hMnvMmEjP9RfxTEZ3qPZGmADDn2vAKSo9UcN1jKVYscg=="
+        },
+        "dom-serializer": {
+          "version": "1.3.2",
+          "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.3.2.tgz",
+          "integrity": "sha512-5c54Bk5Dw4qAxNOI1pFEizPSjVsx5+bpJKmL2kPn8JhBUq2q09tTCa3mjijun2NfK78NMouDYNMBkOrPZiS+ig==",
+          "requires": {
+            "domelementtype": "^2.0.1",
+            "domhandler": "^4.2.0",
+            "entities": "^2.0.0"
+          }
+        },
+        "domelementtype": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.2.0.tgz",
+          "integrity": "sha512-DtBMo82pv1dFtUmHyr48beiuq792Sxohr+8Hm9zoxklYPfa6n0Z3Byjj2IV7bmr2IyqClnqEQhfgHJJ5QF0R5A=="
         },
         "domutils": {
-          "version": "1.5.1",
-          "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.5.1.tgz",
-          "integrity": "sha1-3NhIiib1Y9YQeeSMn3t+Mjc2gs8=",
+          "version": "2.7.0",
+          "resolved": "https://registry.npmjs.org/domutils/-/domutils-2.7.0.tgz",
+          "integrity": "sha512-8eaHa17IwJUPAiB+SoTYBo5mCdeMgdcAoXJ59m6DT1vw+5iLS3gNoqYaRowaBKtGVrOF1Jz4yDTgYKLK2kvfJg==",
           "requires": {
-            "dom-serializer": "0",
-            "domelementtype": "1"
+            "dom-serializer": "^1.0.1",
+            "domelementtype": "^2.2.0",
+            "domhandler": "^4.2.0"
+          }
+        },
+        "nth-check": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-2.0.0.tgz",
+          "integrity": "sha512-i4sc/Kj8htBrAiH1viZ0TgU8Y5XqCaV/FziYK6TBczxmeKm3AEFWqqF3195yKudrarqy7Zu80Ra5dobFjn9X/Q==",
+          "requires": {
+            "boolbase": "^1.0.0"
           }
         }
       }
@@ -19418,9 +19487,9 @@
       }
     },
     "ssri": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/ssri/-/ssri-6.0.1.tgz",
-      "integrity": "sha512-3Wge10hNcT1Kur4PDFwEieXSCMCJs/7WvSACcrMYrNp+b8kDL1/0wJch5Ni2WrtwEa2IO8OsVfeKIciKCDx/QA==",
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/ssri/-/ssri-6.0.2.tgz",
+      "integrity": "sha512-cepbSq/neFK7xB6A50KHN0xHDotYzq58wWCa5LeWqnPrHG8GzfEjO/4O8kpmcGW+oaxkvhEJCWgbgNk4/ZV93Q==",
       "requires": {
         "figgy-pudding": "^3.5.1"
       }
@@ -19803,9 +19872,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.32",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.32.tgz",
-          "integrity": "sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "requires": {
             "chalk": "^2.4.2",
             "source-map": "^0.6.1",
@@ -20049,9 +20118,9 @@
           }
         },
         "y18n": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.0.tgz",
-          "integrity": "sha512-r9S/ZyXu/Xu9q1tYlpsLIsa3EeLXXk0VwlxqTcFRfg9EhMW+17kbt9G0NrgCmhGb5vT2hyhJZLfDGx+7+5Uj/w=="
+          "version": "4.0.3",
+          "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.3.tgz",
+          "integrity": "sha512-JKhqTOwSrqNA1NY5lSztJ1GrBiUodLMmIZuLiDaMRJ+itFd+ABVE8XBjOvIWL+rSqNDC74LCSFmlb/U4UZ4hJQ=="
         }
       }
     },
@@ -20505,9 +20574,9 @@
       }
     },
     "url-parse": {
-      "version": "1.4.7",
-      "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.4.7.tgz",
-      "integrity": "sha512-d3uaVyzDB9tQoSXFvuSUNFibTd9zxd2bkVrDRvF5TmvWWQwqE4lgYJ5m+x1DbecWkw+LK4RNl2CU1hHuOKPVlg==",
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.5.1.tgz",
+      "integrity": "sha512-HOfCOUJt7iSYzEx/UqgtwKRMC6EU91NFhsCHMv9oM03VJcVo2Qrp8T8kI9D7amFf1cu+/3CEhgb3rF9zL7k85Q==",
       "requires": {
         "querystringify": "^2.1.1",
         "requires-port": "^1.0.0"
@@ -20708,9 +20777,9 @@
           "optional": true
         },
         "glob-parent": {
-          "version": "5.1.1",
-          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.1.tgz",
-          "integrity": "sha512-FnI+VGOpnlGHWZxthPGR+QhR78fuiK0sNLkHQv+bL9fQi57lNNdquIbna/WrfROrolq8GK5Ek6BiMwqL/voRYQ==",
+          "version": "5.1.2",
+          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
+          "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
           "optional": true,
           "requires": {
             "is-glob": "^4.0.1"
@@ -21618,9 +21687,9 @@
       }
     },
     "ws": {
-      "version": "5.2.2",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-5.2.2.tgz",
-      "integrity": "sha512-jaHFD6PFv6UgoIVda6qZllptQsMlDEJkTQcybzzXDYM1XO9Y8em691FGMPmM46WGyLU4z9KMgQN+qrux/nhlHA==",
+      "version": "5.2.3",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-5.2.3.tgz",
+      "integrity": "sha512-jZArVERrMsKUatIdnLzqvcfydI85dvd/Fp1u/VOpfdDWQ4c9qWXe+VIeAbQ5FrDwciAkr+lzofXLz3Kuf26AOA==",
       "requires": {
         "async-limiter": "~1.0.0"
       }
@@ -21642,8 +21711,7 @@
     },
     "y18n": {
       "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/y18n/-/y18n-3.2.1.tgz",
-      "integrity": "sha1-bRX7qITAhnnA136I53WegR4H+kE="
+      "resolved": ""
     },
     "yallist": {
       "version": "3.1.1",
@@ -21672,6 +21740,13 @@
         "which-module": "^2.0.0",
         "y18n": "^3.2.1",
         "yargs-parser": "^9.0.2"
+      },
+      "dependencies": {
+        "y18n": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/y18n/-/y18n-3.2.2.tgz",
+          "integrity": "sha512-uGZHXkHnhF0XeeAPgnKfPv1bgKAYyVvmNL1xlKsPYZPaIHxGti2hHqvOCQv71XMsLxu1QjergkqogUnms5D3YQ=="
+        }
       }
     },
     "yargs-parser": {
diff --git a/package.json b/package.json
index 6a21760714ff3d963b0a965899970ae86e670018..e7c0063b2fc5376f27d698c4b3007410598a025d 100644
--- a/package.json
+++ b/package.json
@@ -31,7 +31,7 @@
     "react": "^16.14.0",
     "react-cookie": "^4.0.3",
     "react-dom": "^16.14.0",
-    "react-dropdown": "^1.9.0",
+    "react-dropdown": "^1.9.2",
     "react-dropdown-select": "^4.7.1",
     "react-easy-crop": "^2.1.0",
     "react-fine-uploader": "^1.1.1",
diff --git a/src/Components/AreasSubPagesFunction.js b/src/Components/AreasSubPagesFunction.js
index 00b14174419378c2c01ff43257210983f6ebc6b1..9d244903799c32031745a3a888d06f3874056ea9 100644
--- a/src/Components/AreasSubPagesFunction.js
+++ b/src/Components/AreasSubPagesFunction.js
@@ -27,7 +27,8 @@ import ResourceCardFunction from "./ResourceCardFunction.js";
 import CollectionCardFunction from "./CollectionCardFunction.js";
 import colecoes_obj from './FormationMaterialsResources/formationMaterials';
 import ExpandedMaterial from './ExpandedMaterials';
-import Dropdown from "react-dropdown";
+import TextField from '@material-ui/core/TextField';
+import MenuItem from '@material-ui/core/MenuItem';
 import { getRequest } from './HelperFunctions/getAxiosConfig.js'
 import Grid from '@material-ui/core/Grid';
 import { Link } from 'react-router-dom'
@@ -225,7 +226,7 @@ function TabRecurso() {
           {
             window.innerWidth <= 501 &&
             <div style={{ display: "flex", justifyContent: "center" }}>
-              <Link to={`/busca?query=*&search_class=LearningObject`} className="button-ver">VER RECURSOS</Link>
+              <Link to={`/busca?page=0&results_per_page=12&order=review_average&query=*&search_class=LearningObject`} className="button-ver">VER RECURSOS</Link>
             </div>
           }
         </StyledTab>
@@ -259,15 +260,31 @@ function TabRecurso() {
                 <Grid item>
                   <p style={{ margin: 0, padding: 0 }}>
                     Ordenar por:
-                                    </p>
+                  </p>
                 </Grid>
                 <Grid item>
-                  <Dropdown options={ordenar} value={currOrder} onChange={(e) => {
-                    setCurrOrder(e.label)
-                    setCurrValue(e.value)
-                  }}
-                    placeholder="Selecione uma opção"
-                  />
+                  <TextField
+                    select
+                    fullWidth
+                    value={currValue}
+                    variant="outlined"
+                  >
+                    {ordenar.map((option) => (
+                      <MenuItem
+                        key={option.value}
+                        value={option.value}
+                        name={option.value}
+                        onClick={() => {
+                          setCurrOrder(option.label)
+                          setCurrValue(option.value)
+                        }}
+                      >
+                        <span style={currValue === option.value ? { color: "#ff7f00" } : null} >
+                          {option.label}
+                        </span>
+                      </MenuItem>
+                    ))}
+                  </TextField>
                 </Grid>
               </Grid>
             </Grid>
@@ -322,7 +339,7 @@ function TabColecoes() {
           {
             window.innerWidth <= 501 &&
             <div style={{ display: "flex", justifyContent: "center" }}>
-              <Link to={`/busca?query=*&search_class=Collection`} className="button-ver">VER COLEÇÕES</Link>
+              <Link to={`/busca?page=0&results_per_page=12&order=review_average&query=*&search_class=Collection`} className="button-ver">VER COLEÇÕES</Link>
             </div>
           }
         </StyledTab>
@@ -359,12 +376,28 @@ function TabColecoes() {
                                     </p>
                 </Grid>
                 <Grid item>
-                  <Dropdown options={ordenar} value={currOrder} onChange={(e) => {
-                    setCurrOrder(e.label)
-                    setCurrValue(e.value)
-                  }}
-                    placeholder="Selecione uma opção"
-                  />
+                  <TextField
+                    select
+                    fullWidth
+                    value={currValue}
+                    variant="outlined"
+                  >
+                    {ordenar.map((option) => (
+                      <MenuItem
+                        key={option.value}
+                        value={option.value}
+                        name={option.value}
+                        onClick={() => {
+                          setCurrOrder(option.label)
+                          setCurrValue(option.value)
+                        }}
+                      >
+                        <span style={currValue === option.value ? { color: "#673ab7" } : null} >
+                          {option.label}
+                        </span>
+                      </MenuItem>
+                    ))}
+                  </TextField>
                 </Grid>
               </Grid>
             </Grid>
diff --git a/src/Components/CollectionCommentSection.js b/src/Components/CollectionCommentSection.js
index 63fd1097663ef8b5299abc513d3b765a1c7451c3..4f16d012eb2e8adf52e53e5aed76fb59e63c291d 100644
--- a/src/Components/CollectionCommentSection.js
+++ b/src/Components/CollectionCommentSection.js
@@ -52,6 +52,8 @@ export default function CollectionCommentSection(props) {
 		color: ''
 	});
 	const [reviews, setReviews] = useState([]);
+	const [totalReviews, setTotalReviews] = useState(0);
+	const [currPageReviews, setCurrPageReviews] = useState(0);
 	const comment_ref = useRef(null);
 
 	const forceUpdate = () => { setRenderState(!render_state); }
@@ -102,6 +104,20 @@ export default function CollectionCommentSection(props) {
 		return <MuiAlert elevation={6} variant="filled" {...props} />;
 	}
 
+	function handleLoadMoreReviews() {
+		if (reviews.length !== parseInt(totalReviews))
+			setCurrPageReviews((previous) => previous + 1)
+		else {
+			const info = {
+				open: true,
+				text: 'Não há mais comentários para carregar.',
+				severity: 'warning',
+				color: '',
+			}
+			handleSnackInfo(info)
+		}
+	}
+
 	const NoCommentsMessage = () => {
 		const NoCommentsContainer = styled.div`
 			text-align: center;
@@ -138,7 +154,7 @@ export default function CollectionCommentSection(props) {
 	const CollectionComments = () => {
 		return (
 			<ComentariosBox>
-				<h3>{reviews.length} {reviews.length !== 1 ? 'Relatos' : 'Relato'} sobre o uso do Recurso</h3>
+				<h3>{totalReviews} {totalReviews !== 1 ? 'Relatos' : 'Relato'} sobre o uso do Recurso</h3>
 				{reviews.map(r => {
 					return (
 						<div className="comentario-template" key={r.created_at}>
@@ -161,27 +177,34 @@ export default function CollectionCommentSection(props) {
 						</div>
 					);
 				})}
+				<div className="load-more">
+					<IconButton className="button" onClick={handleLoadMoreReviews}>
+						<KeyboardArrowDownIcon />
+					</IconButton>
+				</div>
 			</ComentariosBox>
 		);
 	}
 
 	function handleSuccessGet(data, headers) {
 		setReviews((previousState) => previousState.concat(data));
+		if (headers.has('X-Total-Count'))
+			setTotalReviews(headers.get('X-Total-Count'))
 		setIsLoading(false);
 	}
 
 	function handleFailGet(error) {
-		console.log(error); setIsLoading(false)
+		setIsLoading(false)
 	}
 
 	useEffect(() => {
 		setIsLoading(true)
 		getRequest(
-			`/collections/${props.id}/reviews`,
+			`/collections/${props.id}/reviews?page=${currPageReviews}`,
 			handleSuccessGet,
 			(error) => { handleFailGet(error) }
 		)
-	}, [render_state]);
+	}, [render_state, currPageReviews]);
 
 	return (
 		<CommentAreaContainer container xs={12} direction="row" justify="center" alignItems="center">
@@ -292,6 +315,7 @@ const ComentariosBox = styled.div`
     }
 
 		.load-more{
+			width: 100%;
 			display: flex; 
 			flex-direction: row;
 			justify-content: center; 
diff --git a/src/Components/HomeScreenSearchBar.js b/src/Components/HomeScreenSearchBar.js
index ef12b7cc21d761f9ac73d634d1a4e24fe180bd0d..634b625e1c487e585f97ed95965fe5b53d87a175 100644
--- a/src/Components/HomeScreenSearchBar.js
+++ b/src/Components/HomeScreenSearchBar.js
@@ -92,9 +92,9 @@ export default function HomeScreenSearchBar(props) {
     const WIDTH = window.innerWidth;
 
     return (
-
-        <StyledGrid container>
-            {goSearch && <Redirect to={`/busca?query=${state.search.query}&search_class=${state.search.class}`} />}
+        
+        <StyledGrid container> 
+            {goSearch && <Redirect to={`/busca?page=0&results_per_page=12&order=review_average&query=${state.search.query}&search_class=${state.search.class}`} />}
             <Grid item md={7} xs={12} className="first white">
                 <StyledTextField
                     id="standard-search"
diff --git a/src/Components/ResourcePageComponents/CommentsArea.js b/src/Components/ResourcePageComponents/CommentsArea.js
index f561d739e5724acf28dd1f3ea869494bbded0842..7472b087626c7291a8eb76bc3a9db71814554352 100644
--- a/src/Components/ResourcePageComponents/CommentsArea.js
+++ b/src/Components/ResourcePageComponents/CommentsArea.js
@@ -31,10 +31,10 @@ import Snackbar from '@material-ui/core/Snackbar';
 import SignUpModal from './../SignUpModal'
 import MuiAlert from '@material-ui/lab/Alert';
 import CircularProgress from '@material-ui/core/CircularProgress';
-
-//Image Import
-import { Comentarios } from "ImportImages.js";
-import { noAvatar } from "ImportImages.js";
+import noAvatar from '../../img/default_profile.png';
+import IconButton from '@material-ui/core/IconButton';
+import KeyboardArrowDownIcon from '@material-ui/icons/KeyboardArrowDown';
+import SnackBarComponent from '../../Components/SnackbarComponent';
 
 function Alert(props) {
     return <MuiAlert elevation={6} variant="filled" {...props} />;
@@ -43,12 +43,35 @@ function Alert(props) {
 export default function CommentsArea(props) {
     const { state } = useContext(Store)
     const [comentarios, setComentarios] = useState([])
+    const [totalReviews, setTotalReviews] = useState(0);
+    const [currPageReviews, setCurrPageReviews] = useState(0);
     const [gambiarra, setState] = useState(0)
     const forceUpdate = () => { setState(gambiarra + 1) }
     const [loginOpen, setLogin] = useState(false)
     const [successfulLoginOpen, handleSuccessfulLogin] = useState(false)
     const [signUpOpen, setSignUp] = useState(false)
     const [isLoading, setIsLoading] = useState(false)
+    const [snackInfo, setSnackInfo] = useState({
+        open: false,
+        text: '',
+        severity: '',
+        color: ''
+    });
+
+    function handleSnackInfo(info) {
+        setSnackInfo({
+            ...info
+        })
+    }
+
+    function handleCloseSnack() {
+        setSnackInfo({
+            open: false,
+            text: '',
+            severity: '',
+            color: '',
+        })
+    }
 
     const handleSignUp = () => {
         setSignUp(!signUpOpen)
@@ -70,19 +93,42 @@ export default function CommentsArea(props) {
         handleSuccessfulLogin(false);
     }
 
-    function handleSuccess(data) {
+    function handleLoadMoreReviews() {
+        if (comentarios.length !== parseInt(totalReviews))
+            setCurrPageReviews((previous) => previous + 1)
+        else {
+            const info = {
+                open: true,
+                text: 'Não há mais comentários para carregar.',
+                severity: 'warning',
+                color: '',
+            }
+            handleSnackInfo(info)
+        }
+    }
+
+    function handleSuccess(data, headers) {
         setIsLoading(false)
-        setComentarios(data.sort((a, b) => a.updated_at > b.updated_at ? -1 : 1))
+        setComentarios((previous) => previous.concat(data.sort((a, b) => a.updated_at > b.updated_at ? -1 : 1)))
+        if (headers.has('X-Total-Count'))
+            setTotalReviews(headers.get('X-Total-Count'))
     }
 
     useEffect(() => {
         setIsLoading(true)
-        const url = `/learning_objects/${props.recursoId}/reviews`
+        const url = `/learning_objects/${props.recursoId}/reviews?page=${currPageReviews}`
         getRequest(url, handleSuccess, (error) => { console.log(error); setIsLoading(false) })
-    }, [gambiarra])
+    }, [gambiarra, currPageReviews])
 
     return (
         <React.Fragment>
+            <SnackBarComponent
+                snackbarOpen={snackInfo.open}
+                handleClose={handleCloseSnack}
+                severity={snackInfo.severity}
+                text={snackInfo.text}
+                color={snackInfo.color}
+            />
             <Snackbar open={successfulLoginOpen} autoHideDuration={1000} onClose={toggleSnackbar}
                 anchorOrigin={{ vertical: 'top', horizontal: 'center' }}
             >
@@ -104,7 +150,7 @@ export default function CommentsArea(props) {
                                     <Grid container style={{ paddingTop: "20px" }} spacing={1}>
                                         <Grid item xs={12} sm={2} style={{ paddingLeft: "15px", paddingRight: "15px" }}>
                                             <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
-                                                <img src={ state.currentUser.avatar ? apiDomain + state.currentUser.avatar : noAvatar} className="minha-imagem" alt="user avatar" />
+                                                <img src={state.currentUser.avatar ? apiDomain + state.currentUser.avatar : noAvatar} className="minha-imagem" alt="user avatar" />
                                             </div>
                                         </Grid>
                                         <Grid item xs={12} sm={10}>
@@ -137,10 +183,10 @@ export default function CommentsArea(props) {
                             <CircularProgress className="loading" />
                         </LoadingDiv>
                         :
-                        comentarios.length !== 0 ?
+                        totalReviews !== 0 ?
                             (
                                 <ComentariosBox>
-                                    <h3>{comentarios.length} {comentarios.length !== 1 ? 'Relatos' : 'Relato'} sobre o uso do Recurso</h3>
+                                    <h3>{totalReviews} {totalReviews !== 1 ? 'Relatos' : 'Relato'} sobre o uso do Recurso</h3>
                                     {
                                         comentarios.map(comentario =>
                                             <div className="comentario-template" key={comentario.id}>
@@ -164,6 +210,11 @@ export default function CommentsArea(props) {
                                             </div>
                                         )
                                     }
+                                    <div className="load-more">
+                                        <IconButton className="button" onClick={handleLoadMoreReviews}>
+                                            <KeyboardArrowDownIcon />
+                                        </IconButton>
+                                    </div>
                                 </ComentariosBox>
                             )
                             :
@@ -218,6 +269,18 @@ const ComentariosBox = styled.div`
         padding : 20px 0;
         border-bottom : 1px solid #f4f4f4;
     }
+
+	.load-more{
+		width: 100%;
+		display: flex; 
+		flex-direction: row;
+		justify-content: center; 
+		align-items: center;
+	}
+		
+	.button{
+		box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
+	}
 `
 const AoRelatar = styled.div`
     width : 70%;
diff --git a/src/Components/SearchBar.js b/src/Components/SearchBar.js
index 1c36964e90f24460d54fd70e0386839ac9754335..8e0ea969a6655039cd1b71419fbc34367e385a77 100644
--- a/src/Components/SearchBar.js
+++ b/src/Components/SearchBar.js
@@ -139,7 +139,7 @@ export default function SearchBar(props) {
   }
 
   const linkTarget = {
-    pathname: `/busca?query=${state.search.query}&search_class=${state.search.class}`,
+    pathname: `/busca?page=0&results_per_page=12&order=review_average&query=${state.search.query}&search_class=${state.search.class}`,
     key: uuidv4(), // we could use Math.random, but that's not guaranteed unique.
     state: {
       applied: true
@@ -149,7 +149,7 @@ export default function SearchBar(props) {
   return (
     <Grid container>
       <Grid container item xs={12} sm={6} md={6} lg={6} xl={6}>
-        {goSearch && <Redirect to={`/busca?query=${state.search.query}&search_class=${state.search.class}`} />}
+        {goSearch && <Redirect to={`/busca?page=0&results_per_page=12&order=review_average&query=${state.search.query}&search_class=${state.search.class}`} />}
         <TextFieldStyled
           id="standard-search"
           label="O que você está buscando"
diff --git a/src/Components/SearchExpansionPanel/SearchEPCompCurriculum.js b/src/Components/SearchExpansionPanel/SearchEPCompCurriculum.js
index 180eaeef90d4ec92d3c6fa367cb0eb22489d3ef9..43941d039dc31f98950b9c0fe2857bea2486bf4a 100644
--- a/src/Components/SearchExpansionPanel/SearchEPCompCurriculum.js
+++ b/src/Components/SearchExpansionPanel/SearchEPCompCurriculum.js
@@ -17,88 +17,45 @@ const useStyles = makeStyles(theme => ({
   }
 }));
 
-export default function SearchEPCompCurriculum(props) {
+export default function SearchEPCompCurriculum({ onChange, curriculumComponents, setCurriculum }) {
   const classes = useStyles();
-  const [checked, setChecked] = React.useState([0]);
 
-  const handleToggle = value => () => {
-    const currentIndex = checked.indexOf(value);
-    const newChecked = [...checked];
-
-    if (currentIndex === -1) {
-      newChecked.push(value);
-    } else {
-      newChecked.splice(currentIndex, 1);
-    }
-
-    let filterString = ""; 
-
-    setChecked(newChecked);
-    for(let i = 0; i < newChecked.length; i++){
-      if(newChecked[i] !== 0){
-        filterString = filterString + `&subjects[]=${newChecked[i]}` 
-        console.log(filterString)
-      }
-    }
-    props.onChange("LearningObject", filterString)
+  const handleToggle = (index) => () => {
+    const newCurriculumComponents = [...curriculumComponents];
+    newCurriculumComponents[index].isChecked = !newCurriculumComponents[index].isChecked
+    setCurriculum(newCurriculumComponents);
   };
-  const filtrosComponente = [
-    { exemplo: "Arte", value: "3" },
-    { exemplo: "Biologia", value: "5" },
-    { exemplo: "Ciências da Natureza", value: "6" },
-    { exemplo: "Direitos Humanos", value: "20" },
-    { exemplo: "Educação Ambiental", value: "21" },
-    { exemplo: "Educação do Campo", value: "22" },
-    { exemplo: "Educação Especial", value: "23" },
-    { exemplo: "Educação Física", value: "7" },
-    { exemplo: "Educação Indígena", value: "24" },
-    { exemplo: "Educação Quilombola", value: "25" },
-    { exemplo: "Educação Sexual", value: "26" },
-    { exemplo: "Ensino Religioso", value: "16" },
-    { exemplo: "Filosofia", value: "8" },
-    { exemplo: "Física", value: "9" },
-    { exemplo: "Geografia", value: "10" },
-    { exemplo: "História", value: "11" },
-    { exemplo: "Informática", value: "18" },
-    { exemplo: "Língua Espanhola", value: "1" },
-    { exemplo: "Língua Inglesa", value: "2" },
-    { exemplo: "Língua Portuguesa", value: "4" },
-    { exemplo: "Matemática", value: "12" },
-    { exemplo: "Outras Línguas", value: "15" },
-    { exemplo: "Outros", value: "17" },
-    { exemplo: "Química", value: "13" },
-    { exemplo: "Sociologia", value: "14" }
-  ];
-
-  return (
-    <List className={classes.root}>
-      {filtrosComponente.map(item => {
-        const labelId = `checkbox-list-label-${item.value}`;
 
-        return (
-          <ListItem
-            key={item.exemplo}
-            role={undefined}
-            dense
-            button
-            onClick={handleToggle(item.value)}
-          >
-            <ListItemIcon>
-              <Checkbox
-                edge="start"
-                checked={checked.indexOf(item.value) !== -1}
-                tabIndex={-1}
-                disableRipple
-                inputProps={{ "aria-labelledby": labelId }}
-              />
-            </ListItemIcon>
-            <ListItemText id={labelId} primary={item.exemplo} />
-            <ListItemSecondaryAction>
-              <IconButton edge="end" aria-label="comments"></IconButton>
-            </ListItemSecondaryAction>
-          </ListItem>
-        );
-      })}
-    </List>
-  );
+  if (curriculumComponents)
+    return (
+      <List className={classes.root}>
+        {curriculumComponents.map((item, index) => {
+          const labelId = `checkbox-list-label-${item.value}`;
+
+          return (
+            <ListItem
+              key={item.exemplo}
+              role={undefined}
+              dense
+              button
+              onClick={handleToggle(index)}
+            >
+              <ListItemIcon>
+                <Checkbox
+                  edge="start"
+                  checked={item.isChecked}
+                  tabIndex={-1}
+                  disableRipple
+                  inputProps={{ "aria-labelledby": labelId }}
+                />
+              </ListItemIcon>
+              <ListItemText id={labelId} primary={item.exemplo} />
+              <ListItemSecondaryAction>
+                <IconButton edge="end" aria-label="comments"></IconButton>
+              </ListItemSecondaryAction>
+            </ListItem>
+          );
+        })}
+      </List>
+    );
 }
diff --git a/src/Components/SearchExpansionPanel/SearchEPIdiomas.js b/src/Components/SearchExpansionPanel/SearchEPIdiomas.js
index b32f032cbce2efcdb4c5e791582c0a3561683560..06715e4615b21f96a5ab87d6caad1cdc5f2d8eac 100644
--- a/src/Components/SearchExpansionPanel/SearchEPIdiomas.js
+++ b/src/Components/SearchExpansionPanel/SearchEPIdiomas.js
@@ -17,74 +17,45 @@ const useStyles = makeStyles(theme => ({
   }
 }));
 
-export default function SearchEPIdiomas(props) {
+export default function SearchEPIdiomas({ languages, setLanguages }) {
   const classes = useStyles();
-  const [checked, setChecked] = React.useState([0]);
 
-  const handleToggle = value => () => {
-    const currentIndex = checked.indexOf(value);
-    const newChecked = [...checked];
-
-    if (currentIndex === -1) {
-      newChecked.push(value);
-    } else {
-      newChecked.splice(currentIndex, 1);
-    }
-
-    setChecked(newChecked);
-    let filterString = "";
-    
-    for(let i = 0; i < newChecked.length; i++){
-      if(newChecked[i] !== 0){
-        filterString = filterString + `&languages[]=${newChecked[i]}` 
-        console.log(filterString)
-      }
-    }
-    props.onChange("LearningObject", filterString)
+  const handleToggle = (index) => () => {
+    const newLanguages = [...languages];
+    newLanguages[index].isChecked = !newLanguages[index].isChecked
+    setLanguages(newLanguages);
   };
-  const filtrosIdiomas = [
-    { value: "5", exemplo: "Alemão" },
-    { value: "3", exemplo: "Espanhol" },
-    { value: "4", exemplo: "Francês" },
-    { value: "2", exemplo: "Inglês" },
-    { value: "6", exemplo: "Italiano" },
-    { value: "9", exemplo: "Japonês" },
-    { value: "19", exemplo: "LIBRAS" },
-    { value: "7", exemplo: "Mandarim" },
-    { value: "10", exemplo: "Outro" },
-    { value: "1", exemplo: "Português" },
-    { value: "8", exemplo: "Russo" }
-  ];
 
-  return (
-    <List className={classes.root}>
-      {filtrosIdiomas.map(item => {
-        const labelId = `checkbox-list-label-${item.value}`;
+  if (languages)
+    return (
+      <List className={classes.root}>
+        {languages.map((item, index) => {
+          const labelId = `checkbox-list-label-${item.value}`;
 
-        return (
-          <ListItem
-            key={item.exemplo}
-            role={undefined}
-            dense
-            button
-            onClick={handleToggle(item.value)}
-          >
-            <ListItemIcon>
-              <Checkbox
-                edge="start"
-                checked={checked.indexOf(item.value) !== -1}
-                tabIndex={-1}
-                disableRipple
-                inputProps={{ "aria-labelledby": labelId }}
-              />
-            </ListItemIcon>
-            <ListItemText id={labelId} primary={item.exemplo} />
-            <ListItemSecondaryAction>
-              <IconButton edge="end" aria-label="comments"></IconButton>
-            </ListItemSecondaryAction>
-          </ListItem>
-        );
-      })}
-    </List>
-  );
+          return (
+            <ListItem
+              key={item.exemplo}
+              role={undefined}
+              dense
+              button
+              onClick={handleToggle(index)}
+            >
+              <ListItemIcon>
+                <Checkbox
+                  edge="start"
+                  checked={item.isChecked}
+                  tabIndex={-1}
+                  disableRipple
+                  inputProps={{ "aria-labelledby": labelId }}
+                />
+              </ListItemIcon>
+              <ListItemText id={labelId} primary={item.exemplo} />
+              <ListItemSecondaryAction>
+                <IconButton edge="end" aria-label="comments"></IconButton>
+              </ListItemSecondaryAction>
+            </ListItem>
+          );
+        })}
+      </List>
+    );
 }
diff --git a/src/Components/SearchExpansionPanel/SearchEPTiposRec.js b/src/Components/SearchExpansionPanel/SearchEPTiposRec.js
index 8dc4fcf6782641ca5bee2916a75c75050f6f298c..41b77adf51206db55b674ce259819f0b8bbf2236 100644
--- a/src/Components/SearchExpansionPanel/SearchEPTiposRec.js
+++ b/src/Components/SearchExpansionPanel/SearchEPTiposRec.js
@@ -17,79 +17,45 @@ const useStyles = makeStyles(theme => ({
   }
 }));
 
-export default function SearchEPTiposRec(props) {
+export default function SearchEPCompCurriculum({ onChange, typeOfResources, setTypeRes }) {
   const classes = useStyles();
-  const [checked, setChecked] = React.useState([0]);
 
-  const handleToggle = value => () => {
-    const currentIndex = checked.indexOf(value);
-    const newChecked = [...checked];
-
-    if (currentIndex === -1) {
-      newChecked.push(value);
-    } else {
-      newChecked.splice(currentIndex, 1);
-    }
-
-    let filterString = ""; 
-
-    setChecked(newChecked);
-    for(let i = 0; i < newChecked.length; i++){
-      if(newChecked[i] !== 0){
-        filterString = filterString + `&object_types[]=${newChecked[i]}` 
-        console.log(filterString)
-      }
-    }
-    props.onChange("LearningObject", filterString)
+  const handleToggle = (index) => () => {
+    const newTypeOfRes = [...typeOfResources];
+    newTypeOfRes[index].isChecked = !newTypeOfRes[index].isChecked
+    setTypeRes(newTypeOfRes);
   };
-  const filtrosTipos = [
-    { value: "5", exemplo: "Animação" },
-    { value: "20", exemplo: "Aplicativo móvel" },
-    { value: "17", exemplo: "Apresentação" },
-    { value: "7", exemplo: "Áudio" },
-    { value: "4", exemplo: "Experimento prático" },
-    { value: "1", exemplo: "Imagem" },
-    { value: "18", exemplo: "Infográfico" },
-    { value: "19", exemplo: "Jogo" },
-    { value: "21", exemplo: "Livro digital" },
-    { value: "2", exemplo: "Mapa" },
-    { value: "15", exemplo: "Outros" },
-    { value: "3", exemplo: "Software Educacional" },
-    { value: "6", exemplo: "Texto" },
-    { value: "8", exemplo: "Vídeo" },
-    { value: "13", exemplo: "Website externo" },
-    { value: "22", exemplo: "Plano de Aula" },
-  ];
-
-  return (
-    <List className={classes.root}>
-      {filtrosTipos.map(item => {
-        const labelId = `checkbox-list-label-${item.value}`;
 
-        return (
-          <ListItem
-            key={item.exemplo}
-            role={undefined}
-            dense
-            button
-            onClick={handleToggle(item.value)}
-          >
-            <ListItemIcon>
-              <Checkbox
-                edge="start"
-                checked={checked.indexOf(item.value) !== -1}
-                tabIndex={-1}
-                disableRipple
-                inputProps={{ "aria-labelledby": labelId }}
-              />
-            </ListItemIcon>
-            <ListItemText id={labelId} primary={item.exemplo} />
-            <ListItemSecondaryAction>
-              <IconButton edge="end" aria-label="comments"></IconButton>
-            </ListItemSecondaryAction>
-          </ListItem>
-        );
-      })}
-    </List>
-  );
+  if (typeOfResources)
+    return (
+      <List className={classes.root}>
+        {typeOfResources.map((item, index) => {
+          const labelId = `checkbox-list-label-${item.value}`;
+
+          return (
+            <ListItem
+              key={item.exemplo}
+              role={undefined}
+              dense
+              button
+              onClick={handleToggle(index)}
+            >
+              <ListItemIcon>
+                <Checkbox
+                  edge="start"
+                  checked={item.isChecked}
+                  tabIndex={-1}
+                  disableRipple
+                  inputProps={{ "aria-labelledby": labelId }}
+                />
+              </ListItemIcon>
+              <ListItemText id={labelId} primary={item.exemplo} />
+              <ListItemSecondaryAction>
+                <IconButton edge="end" aria-label="comments"></IconButton>
+              </ListItemSecondaryAction>
+            </ListItem>
+          );
+        })}
+      </List>
+    );
 }
diff --git a/src/Components/SearchExpansionPanel/SearchExpansionPanel.js b/src/Components/SearchExpansionPanel/SearchExpansionPanel.js
index 7ebfc2c9e26e3ddb29e7445fe46f3df6bf090ce7..8df336aaa3c5966791ed1159775afc3ff301d23a 100644
--- a/src/Components/SearchExpansionPanel/SearchExpansionPanel.js
+++ b/src/Components/SearchExpansionPanel/SearchExpansionPanel.js
@@ -12,6 +12,8 @@ import SearchEPIdiomas from "./SearchEPIdiomas";
 import { TextField } from "@material-ui/core";
 import Grid from '@material-ui/core/Grid';
 import CircularProgress from '@material-ui/core/CircularProgress';
+import Paper from '@material-ui/core/Paper';
+import styled from 'styled-components';
 
 import './ExpansionPanel.css'
 
@@ -77,7 +79,6 @@ export default function SearchExpansionPanel(props) {
 
   const onKeyPressed = (e) => {
     if (e.key === "Enter") {
-      const filterString = "&tags[]=" + keyWords
       if (keyWords.length === 0) {
         setErrorInKeyWord({
           state: true,
@@ -85,7 +86,7 @@ export default function SearchExpansionPanel(props) {
         })
       }
       else
-        props.onChange("LearningObject", filterString)
+        props.setTag(keyWords)
     }
   }
 
@@ -99,7 +100,7 @@ export default function SearchExpansionPanel(props) {
   }
 
   return (
-    <div>
+    <MainPaper square elevation={4}>
       <link
         href="https://fonts.googleapis.com/css?family=Roboto:400,500&display=swap"
         rel="stylesheet"
@@ -136,7 +137,7 @@ export default function SearchExpansionPanel(props) {
       </ExpansionPanel>
 
       <ExpansionPanel square>
-        <ExpansionPanelSummary
+        <ExpansionPanelSummary 
           expandIcon={<ExpandMoreIcon />}
 
           aria-controls="panel2d-content"
@@ -146,7 +147,11 @@ export default function SearchExpansionPanel(props) {
         </ExpansionPanelSummary>
         <ExpansionPanelDetails>
           <div>
-            <SearchEPCompCurriculum onChange={props.onChange} />
+            <SearchEPCompCurriculum 
+              onChange={props.onChange} 
+              curriculumComponents={props.curriculumComponents}
+              setCurriculum={props.setCurriculum}
+            />
           </div>
         </ExpansionPanelDetails>
       </ExpansionPanel>
@@ -160,7 +165,11 @@ export default function SearchExpansionPanel(props) {
           <Typography>Tipos de Recurso</Typography>
         </ExpansionPanelSummary>
         <ExpansionPanelDetails>
-          <SearchEPTiposRec onChange={props.onChange} />
+          <SearchEPTiposRec 
+            onChange={props.onChange} 
+            typeOfResources={props.typeOfResources}
+            setTypeRes={props.setTypeRes}
+          />
         </ExpansionPanelDetails>
       </ExpansionPanel>
 
@@ -173,7 +182,11 @@ export default function SearchExpansionPanel(props) {
           <Typography>Etapas de Ensino</Typography>
         </ExpansionPanelSummary>
         <ExpansionPanelDetails>
-          <SearchEPEtapasEns onChange={props.onChange} />
+          <SearchEPEtapasEns 
+            onChange={props.onChange} 
+            teachingStage={props.teachingStage}
+            setTeachingStage={props.setTeachingStage}
+          />
         </ExpansionPanelDetails>
       </ExpansionPanel>
 
@@ -186,7 +199,11 @@ export default function SearchExpansionPanel(props) {
           <Typography>Idiomas</Typography>
         </ExpansionPanelSummary>
         <ExpansionPanelDetails>
-          <SearchEPIdiomas onChange={props.onChange} />
+          <SearchEPIdiomas 
+            onChange={props.onChange} 
+            languages={props.languages}
+            setLanguages={props.setLanguages}
+          />
         </ExpansionPanelDetails>
       </ExpansionPanel>
 
@@ -210,6 +227,18 @@ export default function SearchExpansionPanel(props) {
           />
         </ExpansionPanelDetails>
       </ExpansionPanel>
-    </div>
+    </MainPaper>
   );
 }
+
+const MainPaper = styled(Paper)`
+  /* height: 150px; */
+  text-align: center;
+  background-color: #fff;
+  margin-top: 5px;
+  margin-bottom: 30px;
+  color: #666;
+  .textInfo{
+    text-align: start;
+  }
+`;
diff --git a/src/Components/SearchExpansionPanel/SesrchEPEtapasEns.js b/src/Components/SearchExpansionPanel/SesrchEPEtapasEns.js
index b08fdb680ae4e0e7be65c4c327adf8b34b96b39c..632009aee017ee3b0347a8e1075d30d15376c89c 100644
--- a/src/Components/SearchExpansionPanel/SesrchEPEtapasEns.js
+++ b/src/Components/SearchExpansionPanel/SesrchEPEtapasEns.js
@@ -17,71 +17,45 @@ const useStyles = makeStyles(theme => ({
   }
 }));
 
-export default function SearchEPEtapasEns(props) {
+export default function SearchEPEtapasEns({ teachingStage, setTeachingStage }) {
   const classes = useStyles();
-  const [checked, setChecked] = React.useState([0]);
 
-  const handleToggle = value => () => {
-    const currentIndex = checked.indexOf(value);
-    const newChecked = [...checked];
-
-    if (currentIndex === -1) {
-      newChecked.push(value);
-    } else {
-      newChecked.splice(currentIndex, 1);
-    }
-
-    setChecked(newChecked);
-    let filterString = "";
-
-    for(let i = 0; i < newChecked.length; i++){
-      if(newChecked[i] !== 0){
-        filterString = filterString + `&educational_stages[]=${newChecked[i]}` 
-      }
-    }
-    if(filterString)
-      props.onChange("LearningObject", filterString) 
-    else  
-      props.onChange("LearningObject", "") 
+  const handleToggle = (index) => () => {
+    const newTypeTeachingStage = [...teachingStage];
+    newTypeTeachingStage[index].isChecked = !newTypeTeachingStage[index].isChecked
+    setTeachingStage(newTypeTeachingStage);
   };
-  const filtrosEtapas = [
-    { value: "1", exemplo: "Educação Infantil" },
-    { value: "2", exemplo: "Ensino Fundamental I (1º até o 5º ano )" },
-    { value: "3", exemplo: "Ensino Fundamental II (do 6º até o 9º ano)" },
-    { value: "4", exemplo: "Ensino Médio" },
-    { value: "5", exemplo: "Ensino Superior" },
-    { value: "6", exemplo: "Outros" }
-  ];
-
-  return (
-    <List className={classes.root}>
-      {filtrosEtapas.map(item => {
-        const labelId = `checkbox-list-label-${item.value}`;
 
-        return (
-          <ListItem
-            key={item.exemplo}
-            role={undefined}
-            dense
-            button
-            onClick={handleToggle(item.value)}
-          >
-            <ListItemIcon>
-              <Checkbox
-                edge="start"
-                checked={checked.indexOf(item.value) !== -1}
-                tabIndex={-1}
-                disableRipple
-                inputProps={{ "aria-labelledby": labelId }}
-              />
-            </ListItemIcon>
-            <ListItemText id={labelId} primary={item.exemplo} />
-            <ListItemSecondaryAction>
-              <IconButton edge="end" aria-label="comments"></IconButton>
-            </ListItemSecondaryAction>
-          </ListItem>
-        );
-      })}
-    </List>
-  );
+  if (teachingStage)
+    return (
+      <List className={classes.root}>
+        {teachingStage.map((item, index) => {
+          const labelId = `checkbox-list-label-${item.value}`;
+
+          return (
+            <ListItem
+              key={item.exemplo}
+              role={undefined}
+              dense
+              button
+              onClick={handleToggle(index)}
+            >
+              <ListItemIcon>
+                <Checkbox
+                  edge="start"
+                  checked={item.isChecked}
+                  tabIndex={-1}
+                  disableRipple
+                  inputProps={{ "aria-labelledby": labelId }}
+                />
+              </ListItemIcon>
+              <ListItemText id={labelId} primary={item.exemplo} />
+              <ListItemSecondaryAction>
+                <IconButton edge="end" aria-label="comments"></IconButton>
+              </ListItemSecondaryAction>
+            </ListItem>
+          );
+        })}
+      </List>
+    );
 }
diff --git a/src/Components/SearchPageComponents/CollectionTemplate.js b/src/Components/SearchPageComponents/CollectionTemplate.js
new file mode 100644
index 0000000000000000000000000000000000000000..c3bcb3ee5b8568430afcc2eacd19a5882cd85b13
--- /dev/null
+++ b/src/Components/SearchPageComponents/CollectionTemplate.js
@@ -0,0 +1,124 @@
+import React, { useEffect } from 'react';
+import Paper from '@material-ui/core/Paper';
+import styled from 'styled-components';
+import Grid from '@material-ui/core/Grid';
+import LoadingSpinner from '../LoadingSpinner';
+import noCollections from '../../img/Pagina_vazia_colecao.png';
+import CollectionCardFunction from '../CollectionCardFunction';
+import IconButton from '@material-ui/core/IconButton';
+import ArrowBackIcon from '@material-ui/icons/ArrowBack';
+import ArrowForwardIcon from '@material-ui/icons/ArrowForward';
+
+export default function ResourceTemplate({ isLoading, resources, totalResources, currPage, handlePreviousPage, handleNextPage }) {
+  const topRef = React.useRef();
+  const totalPages = parseInt(totalResources) === 0 ? 0 : Math.ceil(totalResources / 12) - 1; //Dividing by 12 because i want to cath total pages, and results per page is 12
+
+  useEffect(() => {
+    topRef.current.scrollIntoView()
+  }, [isLoading])
+
+  return (
+    <ResourcePaper elevation={4} square>
+      <div ref={topRef} />
+      <Title>
+        Coleções encontradas ({totalResources})
+      </Title>
+      {
+        isLoading ?
+          <LoadingSpinner text='Carregando Coleções...' />
+          :
+          <Grid container justify='center' alignItems='center' spacing={3}>
+            {
+              resources.length >= 1 ?
+                resources.map((card) => {
+                  return <Grid item key={new Date().toISOString() + card.id} >
+                    <CollectionCardFunction
+                      name={card.name}
+                      tags={card.tags}
+                      rating={card.review_average}
+                      id={card.id}
+                      author={card.owner ? card.owner.name : ""}
+                      description={card.description}
+                      thumbnails={card.items_thumbnails}
+                      avatar={card.owner ? card.owner.avatar : ""}
+                      likeCount={card.likes_count}
+                      followed={card.followed}
+                      liked={card.liked}
+                      collections={card.collection_items}
+                      authorID={card.owner.id}
+                    />
+                  </Grid>
+                })
+                :
+                <NoContentDiv>
+                  <h3>
+                    Desculpe, não há dados nessa página.
+                  </h3>
+                  <img src={noCollections} alt='No cards' />
+                </NoContentDiv>
+            }
+          </Grid>
+      }
+      {
+        !isLoading &&
+        <Grid container direction='row' alignItems='center' justify='center' spacing={3}>
+          <Grid item>
+            <StyledIconButton elevation={4} disabled={currPage === 0}>
+              <IconButton onClick={handlePreviousPage} disabled={currPage === 0}>
+                <ArrowBackIcon className='icon' />
+              </IconButton>
+            </StyledIconButton>
+          </Grid>
+          <Grid item>
+            <ActualPage>
+              {currPage}
+            </ActualPage>...{totalPages}
+          </Grid>
+          <Grid item>
+            <StyledIconButton elevation={4} disabled={currPage === totalPages}>
+              <IconButton onClick={handleNextPage} disabled={currPage === totalPages}>
+                <ArrowForwardIcon className='icon' />
+              </IconButton>
+            </StyledIconButton>
+          </Grid>
+        </Grid>
+      }
+    </ResourcePaper>
+  )
+};
+
+const Title = styled.h4`
+  text-transform: uppercase;
+  font-weight: 500;
+  text-align: left; 
+  color: #673ab7;
+`
+const NoContentDiv = styled.div`
+  >h3{
+    color: #673ab7;
+    text-align: center;
+  }
+`
+const ActualPage = styled.span`
+  color: #673ab7;
+`
+const StyledIconButton = styled(Paper)` 
+  border-radius: 50% !important;
+  background-color: ${props => props.disabled ? "#666" : "#673ab7"} !important;
+  .icon{
+    color: ${props => props.disabled ? "#d4d4d4" : "white"};
+  }
+`
+
+const ResourcePaper = styled(Paper)`
+  /* height: 150px; */
+  text-align: center;
+  background-color: #fff;
+  margin-top: 5px;
+  margin-bottom: 30px;
+  padding: 0.5em 1em;
+  color: #666;
+  .textInfo{
+    text-align: start;
+  }
+`;
\ No newline at end of file
diff --git a/src/Components/SearchPageComponents/Error.js b/src/Components/SearchPageComponents/Error.js
new file mode 100644
index 0000000000000000000000000000000000000000..7cb9d98ce01c0006ef33a45422ba1357a119323d
--- /dev/null
+++ b/src/Components/SearchPageComponents/Error.js
@@ -0,0 +1,30 @@
+import React from 'react';
+import styled from 'styled-components';
+import Paper from '@material-ui/core/Paper';
+
+export default function Error() {
+  return <ResourcePaper square elevation={4}>
+    <Title>
+      Houve um erro durante a obtenção de dados :(
+    </Title>
+  </ResourcePaper>
+}
+
+const ResourcePaper = styled(Paper)`
+  /* height: 150px; */
+  text-align: center;
+  background-color: #fff;
+  margin-top: 5px;
+  margin-bottom: 30px;
+  padding: 0.5em 1em;
+  color: #666;
+  width: 100%;
+`;
+
+const Title = styled.h4`
+  text-transform: uppercase;
+  font-weight: 500;
+  text-align: left; 
+  color: #666;
+  text-align: center;
+`
\ No newline at end of file
diff --git a/src/Components/SearchPageComponents/FilterSummary.js b/src/Components/SearchPageComponents/FilterSummary.js
new file mode 100644
index 0000000000000000000000000000000000000000..9cc1a9aeea7868cf92bd7254adb7ab7dcaeb3aee
--- /dev/null
+++ b/src/Components/SearchPageComponents/FilterSummary.js
@@ -0,0 +1,130 @@
+import React from 'react';
+import styled from 'styled-components';
+import Paper from '@material-ui/core/Paper';
+import Grid from '@material-ui/core/Grid';
+import Chip from '@material-ui/core/Chip';
+import Button from "@material-ui/core/Button";
+
+export default function FilterSummary
+  ({ curriculumComponents, typeOfResources, languages, teachingStage, tag, onButtonClicked }) {
+  return (
+    <FilterSummaryPaper square elevation={4}>
+      <h3 className="title">
+        Resumo dos filtros selecionados
+      </h3>
+      <Grid container direction='column' spacing={2}>
+        <Grid item>
+          <Grid container direction='row' spacing={1} alignItems='center'>
+            <Grid item>
+              Componentes curriculares:
+            </Grid>
+            <Grid item>
+              {
+                curriculumComponents.map((item) => {
+                  return (
+                    item.isChecked &&
+                    <StyledChip key={new Date().toISOString() + item.value} size="small" label={item.exemplo} />
+                  );
+
+                })
+              }
+            </Grid>
+          </Grid>
+        </Grid>
+        <Grid item>
+          <Grid container direction='row' spacing={1} alignItems='center'>
+            <Grid item>
+              Tipos de recursos:
+            </Grid>
+            <Grid item>
+              {
+                typeOfResources.map((item) => {
+                  return (
+                    item.isChecked &&
+                    <StyledChip key={new Date().toISOString() + item.value} size="small" label={item.exemplo} />
+                  );
+                })
+              }
+            </Grid>
+          </Grid>
+        </Grid>
+        <Grid item>
+          <Grid container direction='row' spacing={1} alignItems='center'>
+            <Grid item>
+              Etapas de ensino:
+            </Grid>
+            <Grid item>
+              {
+                teachingStage.map((item) => {
+                  return (
+                    item.isChecked &&
+                    <StyledChip key={new Date().toISOString() + item.value} size="small" label={item.exemplo} />
+                  );
+                })
+              }
+            </Grid>
+          </Grid>
+        </Grid>
+        <Grid item>
+          <Grid container direction='row' spacing={1} alignItems='center'>
+            <Grid item>
+              Idiomas:
+            </Grid>
+            <Grid item>
+              {
+                languages.map((item) => {
+                  return (
+                    item.isChecked &&
+                    <StyledChip key={new Date().toISOString() + item.value} size="small" label={item.exemplo} />
+                  );
+                })
+              }
+            </Grid>
+          </Grid>
+        </Grid>
+        <Grid item>
+          <Grid container direction='row' spacing={1} alignItems='center'>
+            <Grid item>
+              Palavra chave:
+            </Grid>
+            <Grid item>
+              {
+                tag &&
+                <StyledChip size="small" label={tag} />
+              }
+            </Grid>
+          </Grid>
+        </Grid>
+        <Grid item>
+          <StyledButton variant="contained" onClick={onButtonClicked}>
+            <span className="text">
+              Aplicar filtro
+            </span>
+          </StyledButton>
+        </Grid>
+      </Grid>
+    </FilterSummaryPaper>
+  )
+}
+
+const FilterSummaryPaper = styled(Paper)`
+  background-color: #fff;
+  margin-top: 5px;
+  margin-bottom: 30px;
+  padding: 0.5em 1em;
+  .title{
+    text-transform: uppercase;
+    color: #666; 
+    font-weight: 500; 
+  }
+`
+const StyledButton = styled(Button)`
+  background-color: #ff7f00 !important;
+  .text{
+    color: white;
+  }
+`
+
+const StyledChip = styled(Chip)`
+  margin: 0.2em
+`
diff --git a/src/Components/SearchPageComponents/HeaderFilters.js b/src/Components/SearchPageComponents/HeaderFilters.js
new file mode 100644
index 0000000000000000000000000000000000000000..21bcc78c8527f9f6ee276af7ca6c1dc188352330
--- /dev/null
+++ b/src/Components/SearchPageComponents/HeaderFilters.js
@@ -0,0 +1,132 @@
+import React from 'react';
+import styled from 'styled-components';
+import Paper from '@material-ui/core/Paper';
+import Grid from '@material-ui/core/Grid';
+import TextField from '@material-ui/core/TextField';
+import MenuItem from '@material-ui/core/MenuItem';
+
+export default function HeaderFilters({ options, orders, currOption, currOrder, handleChangeOption, handleChangeOrder }) {
+
+  if (currOption !== 'User')
+    return (
+      <FiltersPaper elevation={4} square>
+        <Grid container direction='row' spacing={2} alignItems='center'>
+          <Grid item xs={12} sm={6}>
+            <Grid container alignItems='center'>
+              <Grid item xs={12} md={2}>
+                <Label>
+                  Buscar por:
+              </Label>
+              </Grid>
+              <Grid item xs={12} md={10}>
+                <TextField
+                  select
+                  fullWidth
+                  value={currOption}
+                  onChange={handleChangeOption}
+                  variant="outlined"
+                >
+                  {options.map((option) => (
+                    <MenuItem
+                      key={option.value}
+                      value={option.name}
+                      name={option.value}
+                    >
+                      <span style={{ color: option.color }}>
+                        {option.value}
+                      </span>
+                    </MenuItem>
+                  ))}
+                </TextField>
+              </Grid>
+            </Grid>
+          </Grid>
+
+          <Grid item xs={12} sm={6}>
+            <Grid container alignItems='center'>
+              <Grid item xs={12} md={2}>
+                <Label>
+                  Ordenar por:
+              </Label>
+              </Grid>
+              <Grid item xs={12} md={10}>
+                <TextField
+                  select
+                  fullWidth
+                  value={currOrder}
+                  onChange={handleChangeOrder}
+                  variant="outlined"
+                >
+                  {orders.map((option) => (
+                    <MenuItem
+                      key={option.value}
+                      value={option.name}
+                      name={option.value}
+                    >
+                      {option.value}
+                    </MenuItem>
+                  ))}
+                </TextField>
+              </Grid>
+            </Grid>
+          </Grid>
+        </Grid>
+      </FiltersPaper>
+    )
+  else
+    return (
+      <FiltersPaper elevation={4} square>
+        <Grid container direction='row' alignItems='center'>
+          <Grid item xs={12}>
+            <Grid container alignItems='center'>
+              <Grid item xs={12} md={2}>
+                <Label>
+                  Buscar por:
+              </Label>
+              </Grid>
+              <Grid item xs={12} md={10}>
+                <TextField
+                  select
+                  fullWidth
+                  value={currOption}
+                  onChange={handleChangeOption}
+                  variant="outlined"
+                >
+                  {options.map((option) => (
+                    <MenuItem
+                      key={option.value}
+                      value={option.name}
+                      name={option.value}
+                    >
+                      <span style={{ color: option.color }}>
+                        {option.value}
+                      </span>
+                    </MenuItem>
+                  ))}
+                </TextField>
+              </Grid>
+            </Grid>
+          </Grid>
+        </Grid>
+      </FiltersPaper>
+    )
+}
+
+const Label = styled.p`
+  text-align: center;
+  font-weight: 600; 
+`
+
+
+const FiltersPaper = styled(Paper)`
+  /* height: 150px; */
+  text-align: center;
+  background-color: #fff;
+  margin-top: 5px;
+  margin-bottom: 30px;
+  padding: 0.5em 1em;
+  color: #666;
+  .textInfo{
+    text-align: start;
+  }
+`;
\ No newline at end of file
diff --git a/src/Components/SearchPageComponents/ResourceTemplate.js b/src/Components/SearchPageComponents/ResourceTemplate.js
new file mode 100644
index 0000000000000000000000000000000000000000..01f747366796e9d9a556861e6201399285622bea
--- /dev/null
+++ b/src/Components/SearchPageComponents/ResourceTemplate.js
@@ -0,0 +1,124 @@
+import React, { useEffect } from 'react';
+import Paper from '@material-ui/core/Paper';
+import styled from 'styled-components';
+import Grid from '@material-ui/core/Grid';
+import LoadingSpinner from '../LoadingSpinner';
+import noResources from '../../img/Pagina_vazia_Sem_publicar.png';
+import ResourceCardFunction from '../ResourceCardFunction';
+import IconButton from '@material-ui/core/IconButton';
+import ArrowBackIcon from '@material-ui/icons/ArrowBack';
+import ArrowForwardIcon from '@material-ui/icons/ArrowForward';
+
+export default function ResourceTemplate({ isLoading, resources, totalResources, currPage, handlePreviousPage, handleNextPage }) {
+  const totalPages = parseInt(totalResources) === 0 ? 0 : Math.ceil(totalResources / 12) - 1; //Dividing by 12 because i want to cath total pages, and results per page is 12
+  const topRef = React.useRef();
+
+  useEffect(() => {
+    topRef.current.scrollIntoView();
+  }, [isLoading])
+
+  return (
+    <ResourcePaper elevation={4} square>
+      <div ref={topRef} />
+      <Title>
+        Recursos encontrados ({totalResources})
+      </Title>
+      {
+        isLoading ?
+          <LoadingSpinner text='Carregando recursos...' />
+          :
+          <Grid container justify='center' alignItems='center' spacing={3}>
+            {
+              resources.length >= 1 ?
+                resources.map((card) => {
+                  return <Grid item key={new Date().toISOString() + card.id} >
+                    <ResourceCardFunction
+                      avatar={card.publisher ? card.publisher.avatar : ""}
+                      id={card.id}
+                      thumbnail={card.thumbnail}
+                      type={card.object_type ? card.object_type : "Outros"}
+                      title={card.name}
+                      published={card.state === "published" ? true : false}
+                      likeCount={card.likes_count}
+                      liked={card.liked}
+                      rating={card.review_average}
+                      author={card.author}
+                      tags={card.educational_stages}
+                      href={"/recurso/" + card.id}
+                      downloadableLink={card.default_attachment_location}
+                    />
+                  </Grid>
+                })
+                :
+                <NoContentDiv>
+                  <h3>
+                    Desculpe, não há dados nessa página.
+                  </h3>
+                  <img src={noResources} alt='No cards' />
+                </NoContentDiv>
+            }
+          </Grid>
+      }
+      {
+        !isLoading &&
+        <Grid container direction='row' alignItems='center' justify='center' spacing={3}>
+          <Grid item>
+            <StyledIconButton elevation={4} disabled={currPage === 0}>
+              <IconButton onClick={handlePreviousPage} disabled={currPage === 0}>
+                <ArrowBackIcon className='icon' />
+              </IconButton>
+            </StyledIconButton>
+          </Grid>
+          <Grid item>
+            <ActualPage>
+              {currPage}
+            </ActualPage>...{totalPages}
+          </Grid>
+          <Grid item>
+            <StyledIconButton elevation={4} disabled={currPage === totalPages}>
+              <IconButton onClick={handleNextPage} disabled={currPage === totalPages}>
+                <ArrowForwardIcon className='icon' />
+              </IconButton>
+            </StyledIconButton>
+          </Grid>
+        </Grid>
+      }
+    </ResourcePaper>
+  )
+};
+
+const Title = styled.h4`
+  text-transform: uppercase;
+  font-weight: 500;
+  text-align: left; 
+  color: #ff7f00;
+`
+const NoContentDiv = styled.div`
+  >h3{
+    color: #ff7f00;
+    text-align: center;
+  }
+`
+const ActualPage = styled.span`
+  color: #ff7f00;
+`
+const StyledIconButton = styled(Paper)` 
+  border-radius: 50% !important;
+  background-color: ${props => props.disabled ? "#666" : "#ff7f00"} !important;
+  .icon{
+    color: ${props => props.disabled ? "#d4d4d4" : "white"};
+  }
+`
+
+const ResourcePaper = styled(Paper)`
+  /* height: 150px; */
+  text-align: center;
+  background-color: #fff;
+  margin-top: 5px;
+  margin-bottom: 30px;
+  padding: 0.5em 1em;
+  color: #666;
+  .textInfo{
+    text-align: start;
+  }
+`;
\ No newline at end of file
diff --git a/src/Components/SearchPageComponents/UserTemplate.js b/src/Components/SearchPageComponents/UserTemplate.js
new file mode 100644
index 0000000000000000000000000000000000000000..991a31d30efa8161dd15584f3455380d20c3b31e
--- /dev/null
+++ b/src/Components/SearchPageComponents/UserTemplate.js
@@ -0,0 +1,119 @@
+import React, { useEffect } from 'react';
+import Paper from '@material-ui/core/Paper';
+import styled from 'styled-components';
+import Grid from '@material-ui/core/Grid';
+import LoadingSpinner from '../LoadingSpinner';
+import ContactCard from '../ContactCard';
+import IconButton from '@material-ui/core/IconButton';
+import ArrowBackIcon from '@material-ui/icons/ArrowBack';
+import ArrowForwardIcon from '@material-ui/icons/ArrowForward';
+import { apiDomain } from '../../env';
+
+export default function ResourceTemplate({ isLoading, resources, totalResources, currPage, handlePreviousPage, handleNextPage }) {
+  const totalPages = parseInt(totalResources) === 0 ? 0 : Math.ceil(totalResources / 12) - 1; //Dividing by 12 because i want to cath total pages, and results per page is 12
+  const topRef = React.useRef();
+
+  useEffect(() => {
+    topRef.current.scrollIntoView()
+  }, [isLoading])
+
+  return (
+    <ResourcePaper elevation={4} square>
+      <div ref={topRef} />
+      <Title>
+        Usuários encontrados ({totalResources})
+      </Title>
+      {
+        isLoading ?
+          <LoadingSpinner text='Carregando recursos...' />
+          :
+          <Grid container justify='center' alignItems='center' spacing={3}>
+            {
+              resources.length >= 1 ?
+                resources.map((card) => {
+                  return <Grid item key={new Date().toISOString() + card.id} >
+                    <ContactCard
+                      name={card.name}
+                      avatar={card.avatar ? apiDomain + card.avatar : null}
+                      cover={card.cover ? apiDomain + card.cover : null}
+                      numCollections={card.collections_count}
+                      numLearningObjects={card.learning_objects_count}
+                      follow_count={card.follows_count}
+                      followed={card.followed || null}
+                      followerID={card.id}
+                      href={'/usuario-publico/' + card.id}
+                    />
+                  </Grid>
+                })
+                :
+                <NoContentDiv>
+                  <h3>
+                    Desculpe, não há dados nessa página.
+                  </h3>
+                </NoContentDiv>
+            }
+          </Grid>
+      }
+      {
+        !isLoading &&
+        <Grid container direction='row' alignItems='center' justify='center' spacing={3}>
+          <Grid item>
+            <StyledIconButton elevation={4} disabled={currPage === 0}>
+              <IconButton onClick={handlePreviousPage} disabled={currPage === 0}>
+                <ArrowBackIcon className='icon' />
+              </IconButton>
+            </StyledIconButton>
+          </Grid>
+          <Grid item>
+            <ActualPage>
+              {currPage}
+            </ActualPage>...{totalPages}
+          </Grid>
+          <Grid item>
+            <StyledIconButton elevation={4} disabled={currPage === totalPages}>
+              <IconButton onClick={handleNextPage} disabled={currPage === totalPages}>
+                <ArrowForwardIcon className='icon' />
+              </IconButton>
+            </StyledIconButton>
+          </Grid>
+        </Grid>
+      }
+    </ResourcePaper>
+  )
+};
+
+const Title = styled.h4`
+  text-transform: uppercase;
+  font-weight: 500;
+  text-align: left; 
+  color: #00bcd4;
+`
+const NoContentDiv = styled.div`
+  >h3{
+    color: #00bcd4;
+    text-align: center;
+  }
+`
+const ActualPage = styled.span`
+  color: #00bcd4;
+`
+const StyledIconButton = styled(Paper)` 
+  border-radius: 50% !important;
+  background-color: ${props => props.disabled ? "#666" : "#00bcd4"} !important;
+  .icon{
+    color: ${props => props.disabled ? "#d4d4d4" : "white"};
+  }
+`
+
+const ResourcePaper = styled(Paper)`
+  /* height: 150px; */
+  text-align: center;
+  background-color: #fff;
+  margin-top: 5px;
+  margin-bottom: 30px;
+  padding: 0.5em 1em;
+  color: #666;
+  .textInfo{
+    text-align: start;
+  }
+`;
\ No newline at end of file
diff --git a/src/Components/SearchPageComponents/filters.js b/src/Components/SearchPageComponents/filters.js
new file mode 100644
index 0000000000000000000000000000000000000000..822ea5cdde3acf5d88d2e29210d6243ee4ed56c3
--- /dev/null
+++ b/src/Components/SearchPageComponents/filters.js
@@ -0,0 +1,74 @@
+const filtersCurriculum = [
+  { exemplo: "Arte", value: "3", isChecked: false },
+  { exemplo: "Biologia", value: "5", isChecked: false },
+  { exemplo: "Ciências da Natureza", value: "6", isChecked: false },
+  { exemplo: "Direitos Humanos", value: "20", isChecked: false },
+  { exemplo: "Educação Ambiental", value: "21", isChecked: false },
+  { exemplo: "Educação do Campo", value: "22", isChecked: false },
+  { exemplo: "Educação Especial", value: "23", isChecked: false },
+  { exemplo: "Educação Física", value: "7", isChecked: false },
+  { exemplo: "Educação Indígena", value: "24", isChecked: false },
+  { exemplo: "Educação Quilombola", value: "25", isChecked: false },
+  { exemplo: "Educação Sexual", value: "26", isChecked: false },
+  { exemplo: "Ensino Religioso", value: "16", isChecked: false },
+  { exemplo: "Filosofia", value: "8", isChecked: false },
+  { exemplo: "Física", value: "9", isChecked: false },
+  { exemplo: "Geografia", value: "10", isChecked: false },
+  { exemplo: "História", value: "11", isChecked: false },
+  { exemplo: "Informática", value: "18", isChecked: false },
+  { exemplo: "Língua Espanhola", value: "1", isChecked: false },
+  { exemplo: "Língua Inglesa", value: "2", isChecked: false },
+  { exemplo: "Língua Portuguesa", value: "4", isChecked: false },
+  { exemplo: "Matemática", value: "12", isChecked: false },
+  { exemplo: "Outras Línguas", value: "15", isChecked: false },
+  { exemplo: "Outros", value: "17", isChecked: false },
+  { exemplo: "Química", value: "13", isChecked: false },
+  { exemplo: "Sociologia", value: "14", isChecked: false }
+];
+
+const filtersTypes = [
+  { value: "5", exemplo: "Animação", isChecked: false },
+  { value: "20", exemplo: "Aplicativo móvel", isChecked: false },
+  { value: "17", exemplo: "Apresentação", isChecked: false },
+  { value: "7", exemplo: "Áudio", isChecked: false },
+  { value: "4", exemplo: "Experimento prático", isChecked: false },
+  { value: "1", exemplo: "Imagem", isChecked: false },
+  { value: "18", exemplo: "Infográfico", isChecked: false },
+  { value: "19", exemplo: "Jogo", isChecked: false },
+  { value: "21", exemplo: "Livro digital", isChecked: false },
+  { value: "2", exemplo: "Mapa", isChecked: false },
+  { value: "15", exemplo: "Outros", isChecked: false },
+  { value: "3", exemplo: "Software Educacional", isChecked: false },
+  { value: "6", exemplo: "Texto", isChecked: false },
+  { value: "8", exemplo: "Vídeo", isChecked: false },
+  { value: "13", exemplo: "Website externo", isChecked: false },
+  { value: "22", exemplo: "Plano de Aula", isChecked: false },
+];
+
+const filtersStages = [
+  { value: "1", exemplo: "Educação Infantil", isChecked: false },
+  { value: "2", exemplo: "Ensino Fundamental I (1º até o 5º ano )", isChecked: false },
+  { value: "3", exemplo: "Ensino Fundamental II (do 6º até o 9º ano)", isChecked: false },
+  { value: "4", exemplo: "Ensino Médio", isChecked: false },
+  { value: "5", exemplo: "Ensino Superior", isChecked: false },
+  { value: "6", exemplo: "Outros", isChecked: false }
+];
+
+const filtersLanguages = [
+  { value: "5", exemplo: "Alemão", isChecked: false },
+  { value: "3", exemplo: "Espanhol", isChecked: false },
+  { value: "4", exemplo: "Francês", isChecked: false },
+  { value: "2", exemplo: "Inglês", isChecked: false },
+  { value: "6", exemplo: "Italiano", isChecked: false },
+  { value: "9", exemplo: "Japonês", isChecked: false },
+  { value: "19", exemplo: "LIBRAS", isChecked: false },
+  { value: "7", exemplo: "Mandarim", isChecked: false },
+  { value: "10", exemplo: "Outro", isChecked: false },
+  { value: "1", exemplo: "Português", isChecked: false },
+  { value: "8", exemplo: "Russo", isChecked: false }
+];
+
+export { filtersCurriculum };
+export { filtersTypes };
+export { filtersStages };
+export { filtersLanguages };
diff --git a/src/Components/SignUpContainerFunction.js b/src/Components/SignUpContainerFunction.js
index 89752091cd4787555592c3c307e0ea0424395073..15974aee411a66d7431d73f4ce7d6ba8b87d56a0 100644
--- a/src/Components/SignUpContainerFunction.js
+++ b/src/Components/SignUpContainerFunction.js
@@ -220,8 +220,8 @@ export default function SignUpContainer (props) {
                     <div style={{margin:"0 auto", width: "304px"}}>
                         {
                             //<ReCaptcha sitekey={process.env.REACT_APP_SITE_KEY} verifyCallback={captchaVerified} /> //when key set in env
-                            //<ReCaptcha sitekey="6LfxuKUUAAAAAIzYpCzEtJyeE8QRjBYa44dvHlTX" verifyCallback={captchaVerified} /> //use this one on production
-                            <ReCaptcha sitekey="6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI" verifyCallback={captchaVerified}/> //test key, from google, do not use this one on production
+                            <ReCaptcha sitekey="6LfxuKUUAAAAAIzYpCzEtJyeE8QRjBYa44dvHlTX" verifyCallback={captchaVerified} /> //use this one on production
+                            //<ReCaptcha sitekey="6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI" verifyCallback={captchaVerified}/> //test key, from google, do not use this one on production
                         }
                     </div>
                     <ConfirmContainerStyled>
diff --git a/src/Components/SignUpModal.js b/src/Components/SignUpModal.js
index e01678072f356a5f7aa4a76da8edfd3052e01167..61c4fb2865b34df44615e742507d94df28e43ad7 100644
--- a/src/Components/SignUpModal.js
+++ b/src/Components/SignUpModal.js
@@ -15,7 +15,7 @@ GNU Affero General Public License for more details.
 
 You should have received a copy of the GNU Affero General Public License
 along with Plataforma Integrada MEC.  If not, see <http://www.gnu.org/licenses/>.*/
-import React, {useContext} from 'react';
+import React, {useContext, useState} from 'react';
 import Modal from '@material-ui/core/Modal';
 import Backdrop from '@material-ui/core/Backdrop';
 import Fade from '@material-ui/core/Fade';
@@ -23,11 +23,27 @@ import styled from 'styled-components'
 import SignUpContainer from './SignUpContainerFunction.js'
 import {Store} from '../Store.js'
 import {authentication} from './HelperFunctions/getAxiosConfig'
+import Snackbar from '@material-ui/core/Snackbar';
+import MuiAlert from '@material-ui/lab/Alert';
 //import {postRequest} from './HelperFunctions/getAxiosConfig'
 
+export function Alert(props) {
+    return <MuiAlert elevation={6} variant="filled" {...props} />;
+}
+
 export default function SignUpModal (props) {
     const { state, dispatch } = useContext(Store)
 
+    const [snackbarOpened, handleSnackbar] = useState(false)
+
+    const handleCloseSnackbar = (event, reason) => {
+        if (reason === 'clickaway') {
+            return;
+        }
+
+        handleSnackbar(false);
+    }
+
     function handleSuccess (data) {
         dispatch ({
             type: 'USER_SIGNED_UP',
@@ -36,6 +52,11 @@ export default function SignUpModal (props) {
         })
         props.handleClose()
     }
+
+    function handleError (error) {
+        handleSnackbar(true)
+    }
+
     const handleLoginInfo = (newLogin) => {
         const url = `/auth`
         const payload = {
@@ -46,32 +67,39 @@ export default function SignUpModal (props) {
             // terms_of_service : true,
             // avatar: ""
         }
-        authentication(url, payload, handleSuccess, (error) => {console.log(error)})
+        authentication(url, payload, handleSuccess, handleError)
         //postRequest(url, payload, handleSuccess, (error) => {console.log(error)})
     }
 
     return (
-        <StyledModalSignUp
-            aria-labelledby="transition-modal-title"
-            aria-describedby="transition-modal-description"
-            open={props.open}
-
-            centered="true"
-            onClose={props.handleClose}
-            closeAfterTransition
-            BackdropComponent={Backdrop}
-            BackdropProps={{
-                timeout: 500,
-            }}
-        >
-            <Fade in={props.open}>
-                <SignUpContainer
-                 handleClose={props.handleClose}
-                 openLogin={props.openLogin}
-                 handleLoginInfo = {handleLoginInfo}
-                />
-            </Fade>
-        </StyledModalSignUp>
+        <>
+            <Snackbar open={snackbarOpened} autoHideDuration={1000} onClose={handleCloseSnackbar}
+            anchorOrigin = {{ vertical:'top', horizontal:'right' }}
+            >
+                <Alert severity="error">Ocorreu um erro ao se conectar!</Alert>
+            </Snackbar>
+            <StyledModalSignUp
+                aria-labelledby="transition-modal-title"
+                aria-describedby="transition-modal-description"
+                open={props.open}
+
+                centered="true"
+                onClose={props.handleClose}
+                closeAfterTransition
+                BackdropComponent={Backdrop}
+                BackdropProps={{
+                    timeout: 500,
+                }}
+            >
+                <Fade in={props.open}>
+                    <SignUpContainer
+                    handleClose={props.handleClose}
+                    openLogin={props.openLogin}
+                    handleLoginInfo = {handleLoginInfo}
+                    />
+                </Fade>
+            </StyledModalSignUp>
+        </>
     )
 }
 
diff --git a/src/Components/SnackbarComponent.js b/src/Components/SnackbarComponent.js
index b0bd36a67d134d598e603d3d8c749763132579d7..60692e9c43f7298f34b9eed84eda31ab36cb640b 100644
--- a/src/Components/SnackbarComponent.js
+++ b/src/Components/SnackbarComponent.js
@@ -25,7 +25,7 @@ export default function SnackbarComponent(props) {
         <Snackbar open={props.snackbarOpen} autoHideDuration={3000} onClose={props.handleClose}
             anchorOrigin={{ vertical: 'top', horizontal: 'right' }}
         >
-            <Alert severity={props.severity} style={props.color ? { backgroundColor: props.color } : { backgroundColor: "#00acc1" }}>
+            <Alert severity={props.severity}>
                 {props.text}
             </Alert>
         </Snackbar>
diff --git a/src/Components/UploadPageComponents/PartThree.js b/src/Components/UploadPageComponents/PartThree.js
index e751a1805175b71d28da3251327e097dc6bba7c6..5170659ca6f2e961a14e314a827656737def4000 100644
--- a/src/Components/UploadPageComponents/PartThree.js
+++ b/src/Components/UploadPageComponents/PartThree.js
@@ -217,8 +217,8 @@ export default function PartThree(props) {
                                                     <div style={{margin:"0 auto", width: "304px"}}>
                                                     {
                                                         //<ReCaptcha sitekey={process.env.REACT_APP_SITE_KEY} verifyCallback={captchaVerified} /> //when key set in env
-                                                        //<ReCaptcha sitekey="6LfxuKUUAAAAAIzYpCzEtJyeE8QRjBYa44dvHlTX" verifyCallback={captchaVerified} /> //use this one on production
-                                                        <ReCaptcha sitekey="6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI" verifyCallback={captchaVerified} /> //test key, from google, do not use this one on production
+                                                        <ReCaptcha sitekey="6LfxuKUUAAAAAIzYpCzEtJyeE8QRjBYa44dvHlTX" verifyCallback={captchaVerified} /> //use this one on production
+                                                        //<ReCaptcha sitekey="6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI" verifyCallback={captchaVerified} /> //test key, from google, do not use this one on production
                                                     }
                                                     </div>
                                                 </Grid>
diff --git a/src/Pages/CollectionPage.js b/src/Pages/CollectionPage.js
index b89e00c2148a8117606a1c8b1259424febb10ff8..3b06dd99ecead429793638aaff5fcb691fc2672b 100644
--- a/src/Pages/CollectionPage.js
+++ b/src/Pages/CollectionPage.js
@@ -66,17 +66,18 @@ export default function CollectionPage(props) {
 					</p>
 				</Grid>
 				<Grid item>
-					<Link className="link" to="/busca?query=*&search_class=Collection">
+
+					<Link className="link" to={`/busca?page=0&results_per_page=12&order=review_average&query=*&search_class=Collection`}>
 						<Button
-							variant='contained'
-							className="back-button"
-						>
-							Voltar para a busca de coleções.
+						variant='contained'
+						className="back-button"
+					>
+						Voltar para a busca de coleções.
 						</Button>
 					</Link>
-				</Grid>
 			</Grid>
-		</CollectionNotFound>
+			</Grid>
+		</CollectionNotFound >
 	if (loading)
 		return <LoadingSpinner text="Carregando coleção..." />
 	else
diff --git a/src/Pages/PublicUserPage.js b/src/Pages/PublicUserPage.js
index 11c0ba132bc4a5ee1315764b022e02eb1d6dc9c1..6cdb3ccb2b825f648570bc718e4215416cf9abba 100644
--- a/src/Pages/PublicUserPage.js
+++ b/src/Pages/PublicUserPage.js
@@ -176,7 +176,7 @@ export default function PublicUserPage(props) {
           </p>
         </Grid>
         <Grid item>
-          <Link className="link" to="/busca?query=*&search_class=User">
+          <Link className="link" to={`/busca?page=0&results_per_page=12&query=*&search_class=User`}>
             <Button
               variant='contained'
               className="back-button"
diff --git a/src/Pages/ResourcePage.js b/src/Pages/ResourcePage.js
index 184de1235952dc33e1bb5466f46530887e0eceb7..93c97147ab03c04c089b2dd996bbf64f2571345d 100644
--- a/src/Pages/ResourcePage.js
+++ b/src/Pages/ResourcePage.js
@@ -152,7 +152,7 @@ export default function LearningObjectPage(props) {
           </p>
         </Grid>
         <Grid item>
-          <Link className="link" to="/busca?query=*&search_class=LearningObject">
+          <Link className="link" to={`/busca?page=0&results_per_page=12&order=review_average&query=*&search_class=LearningObject`}>
             <Button
               variant='contained'
               className="back-button"
diff --git a/src/Pages/Search.js b/src/Pages/Search.js
index 4f8850e5e3ae38eaa1f9817aaed60cc89a0ac889..15628592193b74b9363dd9d4e139a6858230bd85 100644
--- a/src/Pages/Search.js
+++ b/src/Pages/Search.js
@@ -1,476 +1,547 @@
-/*Copyright (C) 2019 Centro de Computacao Cientifica e Software Livre
-Departamento de Informatica - Universidade Federal do Parana
-
-This file is part of Plataforma Integrada MEC.
-
-Plataforma Integrada MEC is free software: you can redistribute it and/or modify
-it under the terms of the GNU Affero General Public License as published by
-the Free Software Foundation, either version 3 of the License, or
-(at your option) any later version.
-
-Plataforma Integrada MEC is distributed in the hope that it will be useful,
-but WITHOUT ANY WARRANTY; without even the implied warranty of
-MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-GNU Affero General Public License for more details.
-
-You should have received a copy of the GNU Affero General Public License
-along with Plataforma Integrada MEC.  If not, see <http://www.gnu.org/licenses/>.*/
-
-import React, { useEffect, useState, useContext } from "react";
-import { apiDomain } from '../env';
-import { Link, useHistory } from "react-router-dom";
-import styled from "styled-components";
-import Paper from "@material-ui/core/Paper";
-import LoadingSpinner from '../Components/LoadingSpinner';
-import Breadcrumbs from "@material-ui/core/Breadcrumbs";
-import "./Styles/Home.css";
-import { Store } from "../Store";
-import { Grid } from "@material-ui/core";
-import Dropdown from "react-dropdown";
-import "react-dropdown/style.css";
-import SearchExpansionPanel from "../Components/SearchExpansionPanel/SearchExpansionPanel";
-import ResourceCardFunction from "../Components/ResourceCardFunction";
-import CollectionCardFunction from "../Components/CollectionCardFunction";
-import ContactCard from "../Components/ContactCard";
-import CircularProgress from '@material-ui/core/CircularProgress';
-import { getRequest } from '../Components/HelperFunctions/getAxiosConfig'
-
-//Image Import
-import { ColecaoVazia } from "ImportImages.js";
-import { RecursoVazio } from "ImportImages.js";
-
-let order = "review_average";
-let currFilter = "";
-let currOption;
-
-export default function Search(props) {
-  const history = useHistory()
-
-  const { state, dispatch } = useContext(Store);
-  const [resultsResource, setResultsResource] = useState([]);
-  const [resultsCollection, setResultsCollection] = useState([]);
-  const [resultsUser, setResultsUser] = useState([]);
-  const [currOrder, setCurrOrder] = useState(order);
-  const [page, setPage] = useState(0);
-  const [isloading, setIsLoading] = useState(false);
-  const [loadingMoreData, setLoadingMoreData] = useState(false);
-  const [isFiltering, setIsFiltering] = useState(false);
-  const [resultsPerPage] = useState(12);
-  const [showingResults, setShowingResults] = useState(0);
-  const [totalResults, setTotalResults] = useState(0);
-  const [options] = React.useState([
-    { label: "Recursos", value: "LearningObject" },
-    { label: "Coleções", value: "Collection" },
-    { label: "Usuários", value: "User" },
-  ]);
-  const [ordenar] = useState([
-    { label: "Mais Estrelas", value: "review_average" },
-    { label: "Mais Relevante", value: "score" },
-    { label: "Mais Baixados", value: "downloads" },
-    { label: "Mais Favoritados", value: "likes" },
-    { label: "Mais Recentes", value: "publicationdesc" },
-    { label: "Ordem Alfabética", value: "title" },
-  ]);
-
-  const [option, setOption] = useState(
-    new URLSearchParams(window.location.search).get("search_class")
-  );
-  const [optionResult, setOptionResult] = useState(option);
-  currOption = option;
-
-  function handleSuccessfulGet(data, headers) {
-    if (currOption === "LearningObject") {
-      setResultsResource((previousData) => previousData.concat(data));
+// /*Copyright (C) 2019 Centro de Computacao Cientifica e Software Livre
+// Departamento de Informatica - Universidade Federal do Parana
+
+// This file is part of Plataforma Integrada MEC.
+
+// Plataforma Integrada MEC is free software: you can redistribute it and/or modify
+// it under the terms of the GNU Affero General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+
+// Plataforma Integrada MEC is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU Affero General Public License for more details.
+
+// You should have received a copy of the GNU Affero General Public License
+// along with Plataforma Integrada MEC.  If not, see <http://www.gnu.org/licenses/>.*/ 
+
+
+import React, { useEffect, useState, Fragment, useContext } from 'react';
+import styled from 'styled-components';
+import { Link } from 'react-router-dom';
+import Breadcrumbs from '@material-ui/core/Breadcrumbs';
+import HeaderFilters from '../Components/SearchPageComponents/HeaderFilters';
+import ResourceTemplate from '../Components/SearchPageComponents/ResourceTemplate';
+import CollectionTemplate from '../Components/SearchPageComponents/CollectionTemplate';
+import UserTemplate from '../Components/SearchPageComponents/UserTemplate';
+import Error from '../Components/SearchPageComponents/Error';
+import { getRequest } from '../Components/HelperFunctions/getAxiosConfig';
+import { useHistory } from 'react-router-dom';
+import SearchExpansionPanel from '../Components/SearchExpansionPanel/SearchExpansionPanel';
+import FilterSummary from '../Components/SearchPageComponents/FilterSummary';
+import {
+  filtersCurriculum,
+  filtersTypes,
+  filtersStages,
+  filtersLanguages,
+} from '../Components/SearchPageComponents/filters';
+import Snackbar from '@material-ui/core/Snackbar';
+import MuiAlert from '@material-ui/lab/Alert';
+import { Store } from '../Store'
+
+function Alert(props) {
+  return <MuiAlert elevation={6} variant="filled" {...props} />;
+}
+
+export default function Search() {
+  const history = useHistory();
+  const { state } = useContext(Store)
+
+  const [currOption, setCurrOption] = useState('');
+  const [currOrder, serCurrOrder] = useState('review_average');
+  const [currQuery, setCurrQuery] = useState('');
+  const [currPage, setCurrPage] = useState(0);
+  const [currCurriculumValues, setCurrCurriculumValues] = useState('');
+  const [currTypeOfResValues, setCurrTypeOfResValues] = useState('');
+  const [currTeachingStageValues, setCurrTeachingStageValues] = useState('');
+  const [currLanguagesValues, setCurrLanguagesValues] = useState('');
+  const [currTag, setCurrTag] = useState('');
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState(false);
+  const [snackInfo, setSnackInfo] = useState({
+    open: false,
+    text: "",
+    severity: "",
+  });
+
+  const [curriculumComponents, setCurriculumComponents] = useState([]);
+  const [typeOfResources, setTypeOfResources] = useState([]);
+  const [teachingStage, setTeachingStage] = useState([]);
+  const [languages, setLanguages] = useState([]);
+  const [tag, setTag] = useState('');
+
+  const [resourcesArray, setResourcesArray] = useState([]);
+  const [totalResources, setTotalResources] = useState(0);
+
+  const [collectionsArray, setCollectionsArray] = useState([])
+  const [totalCollections, setTotalCollections] = useState(0);
+
+  const [usersArray, setUsersArray] = useState([])
+  const [totalUsers, setTotalUsers] = useState(0);
+
+  const options = [
+    { value: 'Recursos', name: 'LearningObject', color: '#ff7f00' },
+    { value: 'Coleções', name: 'Collection', color: '#673ab7' },
+    { value: 'Usuários', name: 'User', color: '#00bcd4' },
+  ];
+
+  const orders = [
+    { value: 'Mais Estrelas', name: 'review_average' },
+    { value: 'Mais Relevante', name: 'score' },
+    { value: 'Mais Baixados', name: 'downloads' },
+    { value: 'Mais Favoritados', name: 'likes' },
+    { value: 'Mais Recentes', name: 'publicationdesc' },
+    { value: 'Ordem Alfabética', name: 'title' },
+  ];
+
+  function handleSnackInfo(info) {
+    setSnackInfo({ ...info })
+  }
+
+  function handleCloseSnack() {
+    const snackInfo = {
+      open: false,
+      text: "",
+      severity: "",
     }
-    else if (currOption === "Collection") {
-      setResultsCollection((previousData) => previousData.concat(data));
+    handleSnackInfo(snackInfo)
+  }
+
+  function onButtonClicked() {
+    const curriculumValues = [];
+    const typeOfResourcesValues = [];
+    const teachingStageValues = [];
+    const languagesValues = [];
+
+    for (let index = 0; index < curriculumComponents.length; index++) {
+      const element = curriculumComponents[index];
+      if (element.isChecked)
+        curriculumValues.push(element.value);
     }
-    else if (currOption === "User") {
-      setResultsUser((previousData) => previousData.concat(data));
+
+    for (let index = 0; index < typeOfResources.length; index++) {
+      const element = typeOfResources[index];
+      if (element.isChecked)
+        typeOfResourcesValues.push(element.value);
     }
-    dispatch({
-      type: "SAVE_SEARCH",
-      newSearch: {
-        query: state.search.query,
-        class: currOption,
-      },
-    });
-    if (headers.has('X-Total-Count')) {
-      setTotalResults(headers.get('X-Total-Count'));
+
+    for (let index = 0; index < teachingStage.length; index++) {
+      const element = teachingStage[index];
+      if (element.isChecked)
+        teachingStageValues.push(element.value);
     }
-    setShowingResults((previousSize) => data.length + previousSize)
-    setIsLoading(false);
-    setIsFiltering(false);
-    setLoadingMoreData(false);
+
+    for (let index = 0; index < languages.length; index++) {
+      const element = languages[index];
+      if (element.isChecked)
+        languagesValues.push(element.value);
+    }
+
+    let url = `/busca?page=0&results_per_page=12&query=${currQuery}&search_class=${currOption}`
+
+    if (currOption !== 'User') {
+      url = url + `&order=${currOrder}`
+      if (currOption === 'LearningObject') {
+        if (curriculumValues.length >= 1) {
+          url = url + `&subjects=${curriculumValues}`
+        }
+        if (typeOfResourcesValues.length >= 1) {
+          url = url + `&object_types=${typeOfResourcesValues}`
+        }
+        if (teachingStageValues.length >= 1) {
+          url = url + `&educational_stages=${teachingStageValues}`
+        }
+        if (languagesValues.length >= 1) {
+          url = url + `&languages=${languagesValues}`
+        }
+        if (tag && tag.length >= 1)
+          url = url + `&tags=${tag}`
+      }
+    }
+
+    history.push(url);
   }
 
-  const collectStuff = (tipoBusca, filtro) => {
+  function resetFilters() {
+    for (let index = 0; index < filtersCurriculum.length; index++) {
+      if (filtersCurriculum[index].isChecked)
+        filtersCurriculum[index].isChecked = false;
+    }
+    for (let index = 0; index < filtersLanguages.length; index++) {
+      if (filtersLanguages[index].isChecked)
+        filtersLanguages[index].isChecked = false;
+    }
+    for (let index = 0; index < filtersStages.length; index++) {
+      if (filtersStages[index].isChecked)
+        filtersStages[index].isChecked = false;
+    }
+    for (let index = 0; index < filtersTypes.length; index++) {
+      if (filtersTypes[index].isChecked)
+        filtersTypes[index].isChecked = false;
+    }
+    setTag('')
+  }
 
-    const urlParams = new URLSearchParams(window.location.search);
-    const query = urlParams.get("query");
-    const searchClass = urlParams.get("search_class");
+  function handleChangeOption(e) {
+    const value = e.target.value;
+    let url;
 
-    if (!loadingMoreData) // this line prevents resetting filter when loading more data
-      currFilter = filtro;
-    if (filtro)
-      setIsFiltering(true);
-    const url = `/search?page=${page}&results_per_page=${resultsPerPage}&order=${order}&query=${query}${currFilter ? currFilter : ""}&search_class=${searchClass}`
-    getRequest(url, handleSuccessfulGet, (error) => { console.log(error) })
-  };
+    if (value !== 'User')
+      url = `/busca?page=0&results_per_page=12&order=review_average&query=*&search_class=${value}`
+    else
+      url = `/busca?page=0&results_per_page=12&query=*&search_class=${value}`
 
-  useEffect(() => {
-    setIsLoading(true)
+    resetFilters()
+    history.push(url);
+  }
 
-    const urlParams = new URLSearchParams(window.location.search);
-    const query = urlParams.get("query");
-    const searchClass = urlParams.get("search_class");
+  function handleChangeOrder(e) {
+    const value = e.target.value;
+    let url = `/busca?page=0&results_per_page=12&query=${currQuery}&search_class=${currOption}`
+
+    if (currOption !== 'User') {
+      url = url + `&order=${value}`
+      if (currOption === 'LearningObject') {
+        if (currCurriculumValues) {
+          url = url + `&subjects=${currCurriculumValues}`
+        }
+        if (currTypeOfResValues) {
+          url = url + `&object_types=${currTypeOfResValues}`
+        }
+        if (currTeachingStageValues) {
+          url = url + `&educational_stages=${currTeachingStageValues}`
+        }
+        if (currLanguagesValues) {
+          url = url + `&languages=${currLanguagesValues}`
+        }
+        if (currTag)
+          url = url + `&tags=${currTag}`
+      }
+    }
 
-    if (state.search.query !== query || state.search.class !== searchClass) {
-      dispatch({
-        type: "SAVE_SEARCH",
-        newSearch: {
-          query: query,
-          class: searchClass,
-        },
-      });
-      state.search.query = query
-      state.search.class = searchClass
+    history.push(url);
+  }
+
+  function handleNextPage() {
+    const nextPage = currPage + 1;
+    let url = `/busca?page=${nextPage}&results_per_page=12&query=${currQuery}&search_class=${currOption}`
+
+    if (currOption !== 'User') {
+      url = url + `&order=${currOrder}`
+      if (currOption === 'LearningObject') {
+        if (currCurriculumValues) {
+          url = url + `&subjects=${currCurriculumValues}`
+        }
+        if (currTypeOfResValues) {
+          url = url + `&object_types=${currTypeOfResValues}`
+        }
+        if (currTeachingStageValues) {
+          url = url + `&educational_stages=${currTeachingStageValues}`
+        }
+        if (currLanguagesValues) {
+          url = url + `&languages=${currLanguagesValues}`
+        }
+        if (currTag)
+          url = url + `&tags=${currTag}`
+      }
     }
-    currOption = searchClass
-    setOption(searchClass)
-    setOptionResult(searchClass)
-    collectStuff(searchClass)
-
-    return () =>
-      dispatch({
-        type: "HANDLE_SEARCH_BAR",
-        opened: false,
-      });
-  }, [window.history.state === null ? true : window.history.state.key, state.currentUser.id])
+    history.push(url);
+  }
 
-  useEffect(() => {
-    if (page > 0) {
-      setIsLoading(true);
-      collectStuff(option);
+  function handlePreviousPage() {
+    const previousPage = currPage - 1;
+    let url = `/busca?page=${previousPage}&results_per_page=12&query=${currQuery}&search_class=${currOption}`
+
+    if (currOption !== 'User') {
+      url = url + `&order=${currOrder}`
+      if (currOption === 'LearningObject') {
+        if (currCurriculumValues) {
+          url = url + `&subjects=${currCurriculumValues}`
+        }
+        if (currTypeOfResValues) {
+          url = url + `&object_types=${currTypeOfResValues}`
+        }
+        if (currTeachingStageValues) {
+          url = url + `&educational_stages=${currTeachingStageValues}`
+        }
+        if (currLanguagesValues) {
+          url = url + `&languages=${currLanguagesValues}`
+        }
+        if (currTag)
+          url = url + `&tags=${currTag}`
+      }
     }
-  }, [page]);
-
-  return (
-    <div style={{ backgroundColor: "#f4f4f4" }}>
-      <Principal>
-        <BreadCrumbsDiv style={{ margin: "15px 2%", }}>
-          <StyledBreadCrumbs>
-            <Link to="/">Página Inicial</Link>
-            <span>Busca</span>
-          </StyledBreadCrumbs>
-        </BreadCrumbsDiv>
-
-        <div style={{ margin: "15px 2%", }}>
-          <HeaderFilters elevation={4} square>
-            <Grid container spacing={0} style={{ height: "100%" }}>
-              <Grid item xs style={{ display: "flex", flexDirection: "column", justifyContent: "center", paddingLeft: 20 }}>
-                <div style={{ marginRight: 5, marginTop: 15 }}>
-                  <div className="textInfo">
-                    <span style={{ fontWeight: "bold" }}>
-                      MOSTRAR
-                                        </span>
-                  </div>
-                  <Dropdown options={options} value={optionResult}
-                    onChange={(e) => {
-                      setResultsCollection([]);
-                      setResultsResource([]);
-                      setResultsUser([]);
-                      setShowingResults(0);
-                      setPage(0);
-                      setIsLoading(true);
-                      currOption = e.value;
-                      history.push(`/busca?query=${state.search.query}&search_class=${currOption}`)
-                      setOption(currOption);
-                      // collectStuff(currOption, "");
-                    }}
-                    placeholder="Selecione um tipo"
-                  />
-                </div>
-              </Grid>
-
-              {
-                optionResult === "User" ? null :
-                  <Grid item xs style={{ display: "flex", flexDirection: "column", justifyContent: "center", paddingRight: 20, }}>
-                    <div style={{ marginLeft: 5, marginTop: 15 }}>
-                      <div className="textInfo">
-                        <span style={{ fontWeight: "bold" }}>
-                          ORDENAR POR
-                                                </span>
-                      </div>
-                      <Dropdown options={ordenar} value={currOrder} onChange={(e) => {
-                        order = e.value;
-                        setCurrOrder(e.label)
-                        collectStuff(optionResult, currFilter);
-                      }}
-                        placeholder="Selecione uma opção"
-                      />
-                    </div>
-                  </Grid>
-              }
-              <Grid item xs={12}>
-                <div style={{ display: "flex", flexDirection: "column", justifyContent: "center" }}>
-                  <div style={{ textAlign: "center", paddingTop: 10, fontWeight: "bolder" }}>
-                    Exibindo {showingResults === 0 ? 0 : showingResults} resultados de {totalResults} encontrados
-                                    </div>
-                </div>
-              </Grid>
-            </Grid>
-          </HeaderFilters>
-
-          {
-            isloading ? <LoadingSpinner text="Carregando..." /> :
-              optionResult === "Collection" ? (
-                resultsCollection.length >= 1 ?
-                  <GridBuscaCollection container direction="row" spacing={2}>
-                    <Grid item xs>
-                      <Grid container justify="center" alignItems="center" spacing={2}>
-                        {resultsCollection.map((card) => (
-                          <Grid container item xs justify="center" alignItems="center" key={card.id}>
-                            <CollectionCardFunction
-                              name={card.name}
-                              tags={card.tags}
-                              rating={card.review_average}
-                              id={card.id}
-                              author={card.owner ? card.owner.name : ""}
-                              description={card.description}
-                              thumbnails={card.items_thumbnails}
-                              avatar={card.owner ? card.owner.avatar : ""}
-                              likeCount={card.likes_count}
-                              followed={card.followed}
-                              liked={card.liked}
-                              collections={card.collection_items}
-                              authorID={card.owner.id}
-                            />
-
-                          </Grid>
-                        ))}
-                      </Grid>
-                      <div style={{ display: "flex", flexDirection: "row", justifyContent: "center", }}>
-                        <button
-                          style={{
-                            height: 36, backgroundColor: "#ff7f00", marginBottom: 50, marginTop: 50, fontSize: 14,
-                            color: "white", borderRadius: 4, border: "none",
-                          }}
-                          onClick={() => {
-                            setLoadingMoreData(true);
-                            setPage(page + 1)
-                          }}
-                        >
-                          {
-                            loadingMoreData ? <CircularProgress size={24} color="inherit" /> : "Carregar mais 12"
-                          }
-                        </button>
-                      </div>
-                    </Grid>
-                  </GridBuscaCollection> :
-                  <Grid container direction="row" justify="center" alignItems="center">
-                    <Grid item>
-                      <img src={ColecaoVazia} alt="coleção vazia" />
-                    </Grid>
-                  </Grid>
-
-              ) :
-
-                optionResult === "LearningObject" ? (
-                  resultsResource.length >= 1 ?
-                    <GridBuscaResource container spacing={2}>
-                      <Grid item xs={12} md={2}>
-                        <Grid container >
-                          <Grid item xs={12}>
-                            <Paper elevation={4} square>
-                              <SearchExpansionPanel onChange={collectStuff} onFiltering={isFiltering} />
-                            </Paper>
-                          </Grid>
-                        </Grid>
-                      </Grid>
-                      <Grid item xs>
-                        <Grid container justify="center" spacing={3} alignItems="center" >
-                          {resultsResource.map((card) => (
-                            <Grid container justify="center" alignItems="center" item xs={12} sm={6} md={4} lg={3} key={card.id}>
-                              <ResourceCardFunction
-                                avatar={card.publisher ? card.publisher.avatar : ""}
-                                id={card.id}
-                                thumbnail={card.thumbnail}
-                                type={card.object_type ? card.object_type : "Outros"}
-                                title={card.name}
-                                published={card.state === "published" ? true : false}
-                                likeCount={card.likes_count}
-                                liked={card.liked}
-                                rating={card.review_average}
-                                author={card.author}
-                                tags={card.educational_stages}
-                                href={"/recurso/" + card.id}
-                                downloadableLink={card.default_attachment_location}
-                              />
-                            </Grid>
-                          ))}
-                        </Grid>
-                        <div
-                          style={{
-                            display: "flex",
-                            flexDirection: "row",
-                            justifyContent: "center",
-                          }}
-                        >
-                          <button
-                            style={{
-                              height: 36,
-                              backgroundColor: "#ff7f00",
-                              marginBottom: 50,
-                              marginTop: 50,
-                              fontSize: 14,
-                              color: "white",
-                              borderRadius: 4,
-                              border: "none",
-                            }}
-                            onClick={() => {
-                              setLoadingMoreData(true);
-                              setPage(page + 1)
-                              // collectStuff("LearningObject", "");
-                            }}
-                          >
-                            {
-                              loadingMoreData ? <CircularProgress size={24} color="inherit" /> : "Carregar mais 12"
-                            }
-                          </button>
-                        </div>
-                      </Grid>
-                    </GridBuscaResource>
-
-                    :
-
-                    <GridBuscaResource container spacing={2}>
-                      <Grid item xs={12} md={2}>
-                        <Grid container >
-                          <Grid item xs={12}>
-                            <Paper elevation={4} square>
-                              <SearchExpansionPanel onChange={collectStuff} onFiltering={isFiltering} />
-                            </Paper>
-                          </Grid>
-                        </Grid>
-                      </Grid>
-                      <Grid item xs={12} md={10}>
-                        <Grid container direction="row" justify="center" alignItems="center" style={{ height: "100%", width: "100%" }}>
-                          <Grid>
-                            <img src={RecursoVazio} alt="coleção vazia" />
-                          </Grid>
-                        </Grid>
-                      </Grid>
-                    </GridBuscaResource>
-                ) :
-                  optionResult === "User" && (
-                    <GridBuscaUser container spacing={2}>
-                      <Grid item xs >
-                        <Grid container spacing={2} justify="center" alignItems="center">
-                          {resultsUser.map((card) => (
-                            <Grid container justify="center" alignItems="center" item xs key={card.id}>
-                              <ContactCard
-                                name={card.name}
-                                avatar={card.avatar ? apiDomain + card.avatar : null}
-                                cover={card.cover ? apiDomain + card.cover : null}
-                                numCollections={card.collections_count}
-                                numLearningObjects={card.learning_objects_count}
-                                follow_count={card.follows_count}
-                                followed={card.followed || null}
-                                followerID={card.id}
-                                href={'/usuario-publico/' + card.id}
-                              />
-                            </Grid>
-                          ))}
-                        </Grid>
-                        <div
-                          style={{
-                            display: "flex",
-                            flexDirection: "row",
-                            justifyContent: "center",
-                          }}
-                        >
-                          <button
-                            style={{
-                              height: 36,
-                              backgroundColor: "#ff7f00",
-                              marginBottom: 50,
-                              marginTop: 50,
-                              fontSize: 14,
-                              color: "white",
-                              borderRadius: 4,
-                              border: "none",
-                            }}
-                            onClick={() => {
-                              setLoadingMoreData(true);
-                              setPage(page + 1)
-                              // collectStuff("User", "");
-                            }}
-                          >
-                            {
-                              loadingMoreData ? <CircularProgress color="inherit" size={24} /> : "Carregar mais 12"
-                            }
-                          </button>
-                        </div>
-                      </Grid>
-                    </GridBuscaUser>
-                  )
-          }
-        </div>
-      </Principal>
-    </div>
-  );
-}
+    history.push(url);
+  }
 
-const GridBuscaCollection = styled(Grid)`
-  color: #666;
-  ${'' /* background-color: green; */}
+  function handleSuccess(data, headers, option) {
+    if (option === 'LearningObject') {
+      setResourcesArray(data)
+      if (headers.has('X-Total-Count')) {
+        setTotalResources(headers.get('X-Total-Count'));
+      }
+    }
+    else if (option === 'Collection') {
+      setCollectionsArray(data)
+      if (headers.has('X-Total-Count')) {
+        setTotalCollections(headers.get('X-Total-Count'));
+      }
+    }
+    else {
+      setUsersArray(data);
+      if (headers.has('X-Total-Count')) {
+        setTotalUsers(headers.get('X-Total-Count'));
+      }
+    }
+    setIsLoading(false);
+  }
 
-  h4 {
-    padding: 0 15px;
-    font-size: 18px;
-    margin-block: 10px;
-    text-transform: uppercase;
+  function handleFail() {
+    const snackInfo = {
+      open: true,
+      text: "Houve um erro ao carregar os dados!",
+      severity: "warning",
+    }
+    handleSnackInfo(snackInfo)
+    setError(true);
+    setIsLoading(false);
   }
-`;
-const GridBuscaResource = styled(Grid)`
-  color: #666;
-  ${'' /* background-color: red;  */}
-
-  h4 {
-    padding: 0 15px;
-    font-size: 18px;
-    margin-block: 10px;
-    text-transform: uppercase;
+
+  function handleSubjects(subjectsString) {
+    if (subjectsString) {
+      const selectedSubjects = subjectsString.split(',');
+      for (let i = 0; i < selectedSubjects.length; i++) {
+        const elementOfSelectedSubs = selectedSubjects[i];
+        for (let j = 0; j < filtersCurriculum.length; j++) {
+          if (elementOfSelectedSubs === filtersCurriculum[j].value)
+            filtersCurriculum[j].isChecked = true;
+        }
+      }
+    }
+    setCurriculumComponents(filtersCurriculum);
   }
-`;
-const GridBuscaUser = styled(Grid)`
-  color: #666;
-  ${'' /* background-color: blue; */}
-
-  h4 {
-    padding: 0 15px;
-    font-size: 18px;
-    margin-block: 10px;
-    text-transform: uppercase;
+
+  function handleObjectTypes(objectTypesString) {
+    if (objectTypesString) {
+      const selectedObjectTypes = objectTypesString.split(',');
+      for (let i = 0; i < selectedObjectTypes.length; i++) {
+        const elementOfSelectedObjectTypes = selectedObjectTypes[i];
+        for (let j = 0; j < filtersTypes.length; j++) {
+          if (elementOfSelectedObjectTypes === filtersTypes[j].value)
+            filtersTypes[j].isChecked = true;
+        }
+      }
+    }
+    setTypeOfResources(filtersTypes);
   }
-`;
 
-const HeaderFilters = styled(Paper)`
-  height: 150px;
-  text-align: center;
-  background-color: #fff;
-  margin-bottom: 30px;
-  color: #666;
-  .textInfo{
-    text-align: start;
+  function handleLanguages(languagesString) {
+    if (languagesString) {
+      const selectedLanguages = languagesString.split(',');
+
+      for (let i = 0; i < selectedLanguages.length; i++) {
+        const elementOfSelectedLanguages = selectedLanguages[i];
+        for (let j = 0; j < filtersLanguages.length; j++) {
+          if (elementOfSelectedLanguages === filtersLanguages[j].value)
+            filtersLanguages[j].isChecked = true;
+        }
+      }
+    }
+    setLanguages(filtersLanguages);
+  }
+
+  function handleStages(stagesString) {
+    if (stagesString) {
+      const selectedStages = stagesString.split(',');
+
+      for (let i = 0; i < selectedStages.length; i++) {
+        const elementOfSelectedStages = selectedStages[i];
+        for (let j = 0; j < filtersStages.length; j++) {
+          if (elementOfSelectedStages === filtersStages[j].value)
+            filtersStages[j].isChecked = true;
+        }
+      }
+    }
+    setTeachingStage(filtersStages);
   }
-`;
 
+  useEffect(() => {
+    setIsLoading(true)
+
+    const urlParams = new URLSearchParams(window.location.search);
+    const query = urlParams.get("query");
+    const searchClass = urlParams.get("search_class");
+    const page = parseInt(urlParams.get("page"));
+    const order = urlParams.get("order");
+    const subjects = urlParams.get("subjects");
+    const objectTypes = urlParams.get("object_types");
+    const educationalStages = urlParams.get("educational_stages");
+    const languages = urlParams.get("languages");
+    const tags = urlParams.get("tags");
+
+    setCurrOption(searchClass);
+    setCurrQuery(query);
+    setCurrPage(page);
+    serCurrOrder(order);
+    setCurrCurriculumValues(subjects);
+    setCurrLanguagesValues(languages);
+    setCurrTeachingStageValues(educationalStages);
+    setCurrTypeOfResValues(objectTypes);
+    setCurrTag(tags);
+    setTag(tags);
+
+    handleSubjects(subjects);
+    handleObjectTypes(objectTypes);
+    handleStages(educationalStages);
+    handleLanguages(languages);
+
+    let url = `/search?page=${page}&results_per_page=12&query=${query}&search_class=${searchClass}`
+
+    if (searchClass !== 'User') {
+      url = url + `&order=${order}`
+      if (searchClass === 'LearningObject') {
+        if (subjects) {
+          url = url + `&subjects[]=${subjects}`
+        }
+        if (objectTypes) {
+          url = url + `&object_types[]=${objectTypes}`
+        }
+        if (educationalStages) {
+          url = url + `&educational_stages[]=${educationalStages}`
+        }
+        if (languages) {
+          url = url + `&languages[]=${languages}`
+        }
+        if (tags)
+          url = url + `&tags[]=${tags}`
+      }
+    }
+
+    getRequest(
+      url,
+      (data, headers) => { handleSuccess(data, headers, searchClass) },
+      handleFail,
+    );
+
+  }, [window.history.state === null ? true : window.history.state.key, state.currentUser.id])
+
+  if (error)
+    return (
+      <MainPageError>
+        <Snackbar
+          open={snackInfo.open}
+          autoHideDuration={6000}
+          onClose={handleCloseSnack}
+          anchorOrigin={{ vertical: 'top', horizontal: 'right' }}
+        >
+          <Alert onClose={handleCloseSnack} severity={snackInfo.severity}>
+            {snackInfo.text}
+          </Alert>
+        </Snackbar>
+        <Error />
+      </MainPageError>
+    )
+  else
+    return (
+      <MainPage>
+        <Snackbar
+          open={snackInfo.open}
+          autoHideDuration={6000}
+          onClose={handleCloseSnack}
+          anchorOrigin={{ vertical: 'top', horizontal: 'right' }}
+        >
+          <Alert onClose={handleCloseSnack} severity={snackInfo.severity}>
+            {snackInfo.text}
+          </Alert>
+        </Snackbar>
+        <StyledBreadCrumbs>
+          <Link to='/'>Página Inicial</Link>
+          <span>Busca</span>
+        </StyledBreadCrumbs>
+        <HeaderFilters
+          options={options}
+          orders={orders}
+          currOption={currOption}
+          currOrder={currOrder}
+          handleChangeOption={handleChangeOption}
+          handleChangeOrder={handleChangeOrder}
+        />
+        {
+          currOption === 'LearningObject' &&
+          <Fragment>
+            <SearchExpansionPanel
+              setTag={(tag) => setTag(tag)}
+              curriculumComponents={curriculumComponents}
+              setCurriculum={(array) => { setCurriculumComponents(array) }}
+              typeOfResources={typeOfResources}
+              setTypeRes={(array) => { setTypeOfResources(array) }}
+              teachingStage={teachingStage}
+              setTeachingStage={(array) => { setTeachingStage(array) }}
+              languages={languages}
+              setLanguages={(array) => { setLanguages(array) }}
+            />
+            {
+              <FilterSummary
+                curriculumComponents={curriculumComponents}
+                typeOfResources={typeOfResources}
+                languages={languages}
+                teachingStage={teachingStage}
+                tag={tag}
+                onButtonClicked={onButtonClicked}
+              />
+            }
+            <ResourceTemplate
+              handleNextPage={handleNextPage}
+              handlePreviousPage={handlePreviousPage}
+              isLoading={isLoading}
+              currPage={currPage}
+              resources={resourcesArray}
+              totalResources={totalResources}
+            />
+          </Fragment>
+        }
+        {
+          currOption === 'Collection' &&
+          <CollectionTemplate
+            handleNextPage={handleNextPage}
+            handlePreviousPage={handlePreviousPage}
+            isLoading={isLoading}
+            currPage={currPage}
+            resources={collectionsArray}
+            totalResources={totalCollections}
+          />
+        }
+        {
+          currOption === 'User' &&
+          <UserTemplate
+            handleNextPage={handleNextPage}
+            handlePreviousPage={handlePreviousPage}
+            isLoading={isLoading}
+            currPage={currPage}
+            resources={usersArray}
+            totalResources={totalUsers}
+          />
+        }
+      </MainPage>
+    )
+}
+
+const MainPage = styled.div`  
+  width: 90%; 
+  margin: 1em auto; 
+`
+const MainPageError = styled.div`  
+  width: 90%; 
+  margin: 1em auto; 
+  display: flex; 
+  justify-content: center; 
+  align-items: center; 
+  padding: 1em; 
+`
 const StyledBreadCrumbs = styled(Breadcrumbs)`
   display: flex;
   justify-content: flex-start;
-  max-width: 1170px;
   span {
     color: #a5a5a5;
   }
@@ -479,12 +550,3 @@ const StyledBreadCrumbs = styled(Breadcrumbs)`
     text-decoration: none;
   }
 `;
-
-const BreadCrumbsDiv = styled.div`
-  padding: 10px;
-  display: flex;
-`;
-
-const Principal = styled.div`
-  margin-inline: auto;
-`;
diff --git a/src/env.js b/src/env.js
index 7284c42754e5c679138196c2bae2a2f128779c2b..95815e96e0a4b6d934c32704a85f04284e77d16e 100644
--- a/src/env.js
+++ b/src/env.js
@@ -17,7 +17,7 @@ You should have received a copy of the GNU Affero General Public License
 along with Plataforma Integrada MEC.  If not, see <http://www.gnu.org/licenses/>.*/
 
 
-var apiDomain = 'https://api.portalmectest.c3sl.ufpr.br',
+var apiDomain = 'https://api.portalmec.c3sl.ufpr.br',
   apiVersion = 'v1',
   apiUrl = apiDomain + '/' + apiVersion;