diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..f673a71
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+ "liveServer.settings.port": 5502
+}
\ No newline at end of file
diff --git a/index.css b/index.css
index e816081..ee12593 100644
--- a/index.css
+++ b/index.css
@@ -1,17 +1,35 @@
+body {
+ display: flex;
+ flex-flow: row wrap;
+ justify-content: space-evenly;
+}
+
.red {
width: 150px;
height: 150px;
background-color: red;
+ order: -1;
}
.blue {
width: 150px;
height: 150px;
background-color: blue;
+ order: 1;
+
}
.yellow {
width: 150px;
height: 150px;
background-color: yellow;
+ order: 2;
+}
+
+@media screen and (max-width: 800px) {
+ .body {
+ width: 100%;
+ min-width: 250px;
+
+ }
}
diff --git a/index.html b/index.html
index 2b2396f..fee9419 100644
--- a/index.html
+++ b/index.html
@@ -1,6 +1,7 @@
+
CSS Flexbox
diff --git a/package-lock.json b/package-lock.json
new file mode 100644
index 0000000..48e341a
--- /dev/null
+++ b/package-lock.json
@@ -0,0 +1,3 @@
+{
+ "lockfileVersion": 1
+}