Breaking up main stylesheet into per-component styles

src/pages/404/Component.js

@@ -9,7 +9,7 @@ import Footer from '../../components/Footer';
 const Component = ({ t }) => ( // eslint-disable-line react/prop-types
   <React.Fragment>
     <Header/>
-    <Message className="error" icon={ AlertIcon } heading={ t('404 Page Not Found') }>
+    <Message type="error" icon={ AlertIcon } heading={ t('404 Page Not Found') }>
       <p><Trans>The page you have requested could not be found</Trans></p>
     </Message>
     <Footer/>

src/pages/index/Component.js

@@ -10,7 +10,7 @@ const Component = () => (
   <React.Fragment>
     <Header/>
     <noscript>
-      <Message className="error" icon={ AlertIcon } heading="JavaScript Required">
+      <Message type="error" icon={ AlertIcon } heading="JavaScript Required">
         <p>You need to enable JavaScript to use Regexper.</p>
         <p>Regexper and the tools used to create it are all open source. If you are concerned that the JavaScript being delivered is in any way malicious, please inspect the source by following the GitHub link in the header. There are two data collection tools integrated in the app:</p>
         <ul>