diff --git a/css/main.css b/css/main.css index 50e034c..116b93f 100644 --- a/css/main.css +++ b/css/main.css @@ -56,7 +56,7 @@ main { margin: 1rem 0 1rem; text-align: center; padding: 1rem .5rem; - border: solid .25rem light-dark(var(--color-orange-light), var(--color-orange-dark)); + border: solid .25rem light-dark(var(--color-orange-dark), var(--color-orange-light)); border-radius: 1rem; } @@ -89,7 +89,7 @@ h1 { h2 { margin: 2rem 0 0; - border-bottom: solid light-dark(var(--color-orange-dark), var(--color-orange-light)); + border-bottom: .25rem solid light-dark(var(--color-orange-dark), var(--color-orange-light)); } a { @@ -138,6 +138,12 @@ main > p { margin: 2rem 0; } +.artist-name-bg { + background-color: light-dark(var(--color-dark), var(--color-light)); + color: light-dark(var(--color-light), var(--color-dark)); + border-radius: 1rem; +} + .artist img { max-height: 35vh; max-width: 100%; @@ -145,24 +151,18 @@ main > p { margin: 0 auto; } -@media (max-width: 650px) { - .artist { - margin-left: .625rem; - } - - .artist img { - max-width: 100%; - } -} - .artist h3, .artist p { text-align: center; - margin-top: .25rem; } .artist h3 { text-transform: uppercase; + padding: .25rem 0; +} + +.artist p { + margin-top: .25rem; } footer { diff --git a/index.html b/index.html index 347e420..7ee729f 100644 --- a/index.html +++ b/index.html @@ -38,25 +38,33 @@
-
+
-
+
-
+ found art jackets, fashion items, visible mending