diff --git a/index.html b/index.html
index 72b560d..e5da3ab 100644
--- a/index.html
+++ b/index.html
@@ -2,6 +2,8 @@
My Personal Web Page
+
+
diff --git a/styles.css b/styles.css
new file mode 100644
index 0000000..e5c5165
--- /dev/null
+++ b/styles.css
@@ -0,0 +1,41 @@
+html {
+ font-size: 16px;
+}
+
+@media screen and (max-width: 600px) {
+ body {
+ font-size: calc(1vh + 1rem);
+ overflow: hidden;
+ text-overflow: ellipsis;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ width: 100%;
+ }
+}
+
+@media screen and (min-width: 601px) {
+ body {
+ display: flex;
+ font-size: clamp(1em, 1rem, 2em);
+ height: min(80vh, 100vh);
+ }
+
+ header {
+ width: min(30vw, 30%);
+ display: flex;
+ flex-direction: column;
+ }
+
+ main {
+ display: flex;
+ width: min(70vw, 70%);
+ flex-wrap: wrap;
+ flex-direction: column;
+ }
+
+ footer {
+ position: fixed;
+ bottom: 0;
+ }
+}