reorganisation style

assets/css/components/_taxon-card.scss

@@ -0,0 +1,70 @@
+@use "../abstracts/mixins.scss" as *;
+
+.species-list .taxon{
+
+    .btn-edit {
+        @include icon(20px);
+    }
+
+    .chart-edit{
+        @include chart-edit(40px);
+    }
+
+      .chart-edit, .btn-edit{
+        display: none;
+    }
+
+
+
+    display: flex;
+    flex-direction: column;
+    position: relative;
+
+    background-color: var(--color-green-light);
+    padding: 20px;
+
+    .vernacular{ order: 1; }
+    .latin{ order: 2; }
+    figure{ order: 3; }
+
+    figure{
+        @include fig-ratio(1/1);
+
+        border-radius: var(--radius-img);
+        overflow: hidden;
+        
+    }
+
+    .vernacular{
+        background-color: var(--color-green);
+        color: white;
+        border-radius: var(--radius-small);
+        padding: 4px 1ch;
+        margin-bottom: calc(var(--spacing)*0.25);
+        a{
+            color: white;
+            text-decoration: none;
+        }
+    }
+
+    .latin{
+        font-weight: normal;
+        font-weight: 500;
+        font-style: italic;
+        margin-bottom: calc(var(--spacing)*0.75);
+        color: var(--color-txt);
+    }
+
+    .vernacular, .latin{
+        text-align: center;
+    }
+
+    &:hover{
+        outline: 2px solid var(--color-green);
+        background-color: var(--color-green-medium);
+
+    }
+
+  
+
+}