diff --git a/index.html b/index.html
index 72b560d..bc1e9b7 100644
--- a/index.html
+++ b/index.html
@@ -2,6 +2,7 @@
My Personal Web Page
+
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..985a467
--- /dev/null
+++ b/style.css
@@ -0,0 +1,95 @@
+* {
+ box-sizing: border-box;
+ margin: 0;
+}
+
+body {
+ font-family: sans-serif;
+ background-color: grey;
+ margin: 0;
+ padding: 0;
+}
+
+p {
+ margin: 0;
+ padding: 0;
+}
+
+h1 {
+ text-align: center;
+}
+
+h2 {
+ padding: 0;
+ margin: 0;
+}
+
+ul {
+ display: flex;
+ flex-direction: column;
+ padding-left: 0;
+}
+
+li {
+ list-style: none;
+ margin-right: 10px;
+ text-align: center;
+}
+
+a {
+ text-decoration: none;
+ color: black;
+}
+
+main {
+ width: 100%;
+ font-size: 0;
+}
+
+header,
+section {
+ padding: 20px;
+}
+
+section {
+ font-size: 16px;
+ display: inline-block;
+ margin-bottom: 0;
+ background-color: white;
+
+ width: 100%;
+}
+
+footer {
+ text-align: center;
+ margin: 20px 0;
+}
+
+@media (min-width: 600px) {
+ ul {
+ /* width: 50%; */
+ width: 200px;
+ /* margin: 0 auto; */
+ flex-direction: row;
+ }
+
+ li {
+ margin: 0 auto;
+ }
+
+ h1 {
+ text-align: left;
+ }
+
+ section {
+ box-sizing: border-box;
+ display: inline-block;
+ vertical-align: top;
+ /* max-width: 49%; */
+ width: 50%;
+ }
+
+ footer {
+ text-align: left;
+ }
+}