diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..6b665aa
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+ "liveServer.settings.port": 5501
+}
diff --git a/index.html b/index.html
index 72b560d..992cf7d 100644
--- a/index.html
+++ b/index.html
@@ -2,6 +2,10 @@
My Personal Web Page
+
+
+
+
@@ -34,3 +38,5 @@ Contact Information
+
+
diff --git a/stylesheet.css b/stylesheet.css
new file mode 100644
index 0000000..4d399bc
--- /dev/null
+++ b/stylesheet.css
@@ -0,0 +1,71 @@
+
+html{
+ font-size:18px;
+ font-style:bold;
+}
+
+/*mobilescreen*/
+@media screen and (max-width: 600px) {
+ body{
+ background-color: blue;
+ align-items:center;
+ font-size:0.5rem;
+ }
+ header{
+ background-color:lightblue;
+ font-size:0.8rem;
+ }
+ h1{
+ font-size:1.0rem;
+ color:red;
+ }
+ main{
+ display:flex;
+ flex-direction:row;
+ }
+ section{
+ width:30%;
+ }
+ ul{
+ list-style:none;
+ }
+
+}
+
+
+/*desktop and devices*/
+@media screen and (min-width:601px){
+ body{
+ background-color:pink;
+ font-size:1.0rem;
+ display:flex;
+ flex-direction:column;
+ align-items:center;
+
+ }
+ header{
+ background-color:lightgrey;
+
+ }
+
+ h1{
+ color:rgb(42, 42, 39);
+ width: clamp(200px, 50%, 1000px);
+ font-size: clamp(20px, 50vw, 50px);
+ }
+
+ main{
+ display:flex;
+ flex-direction:column;
+ align-items:center;
+ }
+
+ section{
+ width:30%;
+ }
+
+ ul{
+ list-style:square;
+ }
+
+}
\ No newline at end of file