Move styles into separate files

Minor version bump

src/styles/preview.scss

@@ -0,0 +1,41 @@
+.profile-container {
+    width: 915px;
+    max-width: 100%;
+    margin: 0 auto;
+    resize: horizontal;
+    align-content: center;
+    justify-content: center;
+    box-sizing: border-box;
+    display: inline-block;
+  
+    .profile {
+      position: relative;
+      width: 100%;
+      border-radius: 10px;
+      padding-bottom: 62.5%;
+      background-color: red;
+    }
+    .overlay-panels {
+      position:absolute;
+      width:  100%;
+      height: 100%;
+      left: 0;
+    }
+  
+    .overlay-icons {
+      position: absolute;
+      width:  100%;
+      height: 100%;
+      left: 0;
+      background-size:cover;
+      background-image: url('../assets/midari_overlay.png');
+    }
+  
+    .user-image {
+      position: absolute;
+      left: 1.6%;
+      top:  2.3%;
+      width: 14.5%;
+      border-radius: 100%;
+    }
+}

src/styles/specifics.scss

@@ -0,0 +1,48 @@
+#intro {
+    h2 {
+      text-align: center;
+    }
+  
+    p {
+      padding: 25px;
+      padding-bottom: 0;
+    }
+
+    width: 80%;
+    max-width: 800px;
+    margin: 0 auto;
+    padding: 25px;
+  
+    @media (max-width: 680px) {
+      width: 100%;
+      padding: 25px 0;
+    }  
+}
+
+#commands {
+    min-width: 300px;
+    flex-grow: 1;
+    align-self: flex-start;
+
+    .command {
+        position: relative;
+        margin: 20px;
+    }
+
+    button {
+        position: absolute;
+        right: 0px;
+        bottom: 6px;
+        height: 45px;
+    }
+
+    .code {
+        background-color: #0a0a0a;
+        border-radius: 5px;
+        padding: 11px;
+        width: 100%;
+        display: inline-block;
+        margin: 5px 0;
+        font-family: monospace;
+    }
+}