Simplify base CSS for .card

diff --git a/index.html b/index.html
index 6d7505ff0dad9c2b6960e516b5ca350286fd9d5a..aaece973d0e8c8203143e6df210a8532e06e7036 100644 (file)
--- a/index.html
+++ b/index.html
@@ -145,6 +145,8 @@
     .card {
       inline-size: min(100% - 2rem, 400px);
       padding: 16px;
+      border-radius: 12px;
+      border: 1px solid hsl(0deg 0% 70%);
     }
 
     .card-content.rainbow-border {
@@ -154,8 +156,6 @@
     }
 
     .card.rainbow-border {
-      border-radius: 12px;
-      border: 1px solid hsl(0deg 0% 70%);
       position: relative;
       transition: border-color 1400ms;
     }
@@ -207,8 +207,6 @@
     }
 
     .card.rainbow-gradient {
-      border-radius: 12px;
-      border: 1px solid hsl(0deg 0% 70%);
       background: hsl(216deg 40% 95% / 0.5);
       transition: border-color 700ms, background-color 2000ms;
       position: relative;
@@ -251,8 +249,6 @@
     .card.hover-detail {
       block-size: 148px;
       background: hsl(0deg 0% 98%);
-      border: 1px solid hsl(0deg 0% 70%);
-      border-radius: 12px;
       position: relative;
       transition: filter 800ms;
     }
@@ -286,8 +282,6 @@
 
     .card.hover-grow {
       margin-block: 8px;
-      border: 1px solid hsl(0deg 0% 70%);
-      border-radius: 12px;
       will-change: transform;
       transition: scale 400ms;
     }
@@ -300,8 +294,6 @@
 
     .card.text-focus {
       margin-block: 8px;
-      border: 1px solid hsl(0deg 0% 70%);
-      border-radius: 12px;
     }
 
     .text-focus p {
@@ -317,8 +309,6 @@
 
     .card.big-box-shadow {
       margin-block: 8px;
-      border: 1px solid hsl(0deg 0% 70%);
-      border-radius: 12px;
       transition: padding 400ms, border 400ms, box-shadow 400ms;
     }