Responsive layout

1 files changed, 15 insertions, 5 deletions

diff --git a/hcard.css b/hcard.css
index 540b394..055f0ae 100644
--- a/hcard.css
+++ b/hcard.css
@@ -1,11 +1,21 @@
-.h-card {
-  display: flex;
-  gap: 1rem;
-  align-items: center;
+.u-photo {
+  margin-inline: auto;
+  margin-block-end: 3rem;
+}
+
+@media (min-width: 48rem) {
+  .h-card {
+    display: flex;
+    gap: 1rem;
+    align-items: center;
+  }
+
+  .u-photo {
+    margin: 0;
+  }
 }
 
 .u-photo {
   width: 256px;
-  height: 256px;
 }