diff --git a/index.html b/index.html index be051a4..4136a66 100644 --- a/index.html +++ b/index.html @@ -16,6 +16,40 @@

Quote from a Bot

Select a character and see
what's on their mind!

- + +
+
+
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+
+
+ diff --git a/style.css b/style.css index e2aefd1..c479f89 100644 --- a/style.css +++ b/style.css @@ -21,4 +21,36 @@ header { background-color: #E9F45B; padding: 32px; text-align: center; +} + +main { + text-align: center; +} + +.characters { + display: grid; + grid-template-columns: repeat(4, 112px); + justify-content: center; + gap: 10px; + padding: 40px 4px; +} + +.character { + width: 112px; + height: 112px; + overflow: hidden; + background-color: #a1d2ff; + font-size: 5rem; + border: 2px solid #1212b2; + border-radius: 50%; + cursor: pointer; +} + +.character img { + max-width: 100%; +} + +.container { + max-width: 540px; + margin: 0 auto; } \ No newline at end of file