diff --git a/games/index.html b/games/index.html index 496e0ca..4d39a3d 100644 --- a/games/index.html +++ b/games/index.html @@ -37,22 +37,29 @@

-
+

WORIDII Chapter 1: Lurker

-

- We are proud to announce our FIRST VIDEO GAME! -

-

- We're currently in the production phase of this passion project of ours, - and we can't wait to bring you more details! -

-

- You can look forward to exploring a dark location in a mysterious land of WORIDII! - You'll be there to examine your surroundings, the history of the place and a strange mystery. -

-

- Stay tuned for more info about the development and the game itself! -

+
+
+
+

+ We are proud to announce our FIRST VIDEO GAME! +

+

+ We're currently in the production phase of this passion project of ours, + and we can't wait to bring you more details! +

+

+ You can look forward to exploring a dark location in a mysterious land of WORIDII! + You'll be there to examine your surroundings, the history of the place and a strange mystery. +

+

+ Stay tuned for more info about the development and the game itself! +

+
+
diff --git a/style.css b/style.css index c89d58b..cfc7905 100644 --- a/style.css +++ b/style.css @@ -196,6 +196,12 @@ nav { section { &.blocks { + align-items: center; + flex-direction: column; + } + + &.columns { + align-items: center; flex-direction: column; } @@ -403,6 +409,7 @@ section.blocks { display: flex; flex: 1; flex-direction: column; + min-width: 20em; padding: 1em; & > h3 { @@ -471,6 +478,42 @@ section.blocks { } } +section.columns { + display: flex; + justify-content: space-around; + margin: 1em 0.4em; + + & > div { + flex-basis: 100%; + max-width: 27em; + + &.link { + align-items: center; + display: flex; + justify-content: center; + + a { + border: 0.1em solid var(--grey-background-color); + border-radius: 0.5em; + display: block; + font-size: 2em; + padding: 1em; + text-align: center; + text-decoration: none; + width: fit-content; + + &:hover { + background-color: var(--grey-background-color) 50%; + } + } + } + + & > p:first-child { + margin-top: 0; + } + } +} + section.conversion { display: flex; gap: 0.2em;