+ HEADER
+ Lorem ipsum dolor sit amet consectetur adipisicing elit. Maxime nihil, quos sint tempore quae error repellendus eum nam inventore expedita reprehenderit perferendis! Libero magnam natus quos sequi laboriosam cum modi!
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/10_flex/style.css b/10_flex/style.css
new file mode 100644
index 0000000..9a382a7
--- /dev/null
+++ b/10_flex/style.css
@@ -0,0 +1,56 @@
+.navigace {
+ display: flex;
+ flex-flow: row wrap;
+ justify-content: flex-end;
+
+ list-style: none;
+ margin: 0;
+}
+.navigace a {
+ text-decoration: none;
+ display: block;
+ padding: 10px;
+}
+.navigace a:hover {
+ background-color: lightgreen;
+ transition: 0.5s;
+}
+@media all and (max-width: 800px) {
+ .navigace {
+ justify-content: space-around;
+ }
+}
+@media all and (max-width: 600px) {
+ .navigace {
+ flex-flow: column wrap;
+ padding: 0;
+ }
+ .navigace a {
+ text-align: center;
+ padding: 10px;
+ }
+}
+
+.wrapper {
+ display: flex;
+ flex-flow: row wrap;
+ text-align: center;
+}
+.wrapper > * {
+ padding: 10px;
+ flex: 1 100%
+}
+
+@media all and (min-width:600px) {
+ .aside {
+ flex: 1 0 0;
+ }
+}
+
+@media all and (min-width: 800px) {
+ .main { flex: 3 0px;}
+ .aside-1 {order: 1;}
+ .main {order: 2;}
+ .aside-2 {order: 3;}
+ .footer {order: 4;}
+}
\ No newline at end of file