:root {
          --bg-green-dark-100: rgba(0, 106, 78, 1);
          --text-green-dark-100: rgba(0, 106, 78, 1);
          --border-green-dark-100: rgba(0, 106, 78, 1);
         .button.bg-green-dark-100:hover { background-color: var(--bg-green-dark-70); }
         .button.text-green-dark-100:hover { color: var(--text-green-dark-100); }
          --bg-green-dark-90: rgba(0, 106, 78, 0.9);
          --text-green-dark-90: rgba(0, 106, 78, 0.9);
          --border-green-dark-90: rgba(0, 106, 78, 0.9);
          --bg-green-dark-80: rgba(0, 106, 78, 0.8);
          --text-green-dark-80: rgba(0, 106, 78, 0.8);
          --border-green-dark-80: rgba(0, 106, 78, 0.8);
          --bg-green-dark-70: rgba(0, 106, 78, 0.7);
          --text-green-dark-70: rgba(0, 106, 78, 0.7);
          --border-green-dark-70: rgba(0, 106, 78, 0.7);
          --bg-green-dark-60: rgba(0, 106, 78, 0.6);
          --text-green-dark-60: rgba(0, 106, 78, 0.6);
          --border-green-dark-60: rgba(0, 106, 78, 0.6);
          --bg-green-dark-50: rgba(0, 106, 78, 0.5);
          --text-green-dark-50: rgba(0, 106, 78, 0.5);
          --border-green-dark-50: rgba(0, 106, 78, 0.5);
          --bg-green-dark-40: rgba(0, 106, 78, 0.4);
          --text-green-dark-40: rgba(0, 106, 78, 0.4);
          --border-green-dark-40: rgba(0, 106, 78, 0.4);
          --bg-green-dark-30: rgba(0, 106, 78, 0.3);
          --text-green-dark-30: rgba(0, 106, 78, 0.3);
          --border-green-dark-30: rgba(0, 106, 78, 0.3);
          --bg-green-dark-20: rgba(0, 106, 78, 0.2);
          --text-green-dark-20: rgba(0, 106, 78, 0.2);
          --border-green-dark-20: rgba(0, 106, 78, 0.2);
          --bg-green-dark-10: rgba(0, 106, 78, 0.1);
          --text-green-dark-10: rgba(0, 106, 78, 0.1);
          --border-green-dark-10: rgba(0, 106, 78, 0.1);
          --bg-green-light-100: rgba(64, 188, 137, 1);
          --text-green-light-100: rgba(64, 188, 137, 1);
          --border-green-light-100: rgba(64, 188, 137, 1);
         .button.bg-green-light-100:hover { background-color: var(--bg-green-light-70); }
         .button.text-green-light-100:hover { color: var(--text-green-light-100); }
          --bg-green-light-90: rgba(64, 188, 137, 0.9);
          --text-green-light-90: rgba(64, 188, 137, 0.9);
          --border-green-light-90: rgba(64, 188, 137, 0.9);
          --bg-green-light-80: rgba(64, 188, 137, 0.8);
          --text-green-light-80: rgba(64, 188, 137, 0.8);
          --border-green-light-80: rgba(64, 188, 137, 0.8);
          --bg-green-light-70: rgba(64, 188, 137, 0.7);
          --text-green-light-70: rgba(64, 188, 137, 0.7);
          --border-green-light-70: rgba(64, 188, 137, 0.7);
          --bg-green-light-60: rgba(64, 188, 137, 0.6);
          --text-green-light-60: rgba(64, 188, 137, 0.6);
          --border-green-light-60: rgba(64, 188, 137, 0.6);
          --bg-green-light-50: rgba(64, 188, 137, 0.5);
          --text-green-light-50: rgba(64, 188, 137, 0.5);
          --border-green-light-50: rgba(64, 188, 137, 0.5);
          --bg-green-light-40: rgba(64, 188, 137, 0.4);
          --text-green-light-40: rgba(64, 188, 137, 0.4);
          --border-green-light-40: rgba(64, 188, 137, 0.4);
          --bg-green-light-30: rgba(64, 188, 137, 0.3);
          --text-green-light-30: rgba(64, 188, 137, 0.3);
          --border-green-light-30: rgba(64, 188, 137, 0.3);
          --bg-green-light-20: rgba(64, 188, 137, 0.2);
          --text-green-light-20: rgba(64, 188, 137, 0.2);
          --border-green-light-20: rgba(64, 188, 137, 0.2);
          --bg-green-light-10: rgba(64, 188, 137, 0.1);
          --text-green-light-10: rgba(64, 188, 137, 0.1);
          --border-green-light-10: rgba(64, 188, 137, 0.1);
          --bg-grey-light-100: rgba(248, 248, 248, 1);
          --text-grey-light-100: rgba(248, 248, 248, 1);
          --border-grey-light-100: rgba(248, 248, 248, 1);
         .button.bg-grey-light-100:hover { background-color: var(--bg-grey-light-70); }
         .button.text-grey-light-100:hover { color: var(--text-grey-light-100); }
          --bg-grey-light-90: rgba(248, 248, 248, 0.9);
          --text-grey-light-90: rgba(248, 248, 248, 0.9);
          --border-grey-light-90: rgba(248, 248, 248, 0.9);
          --bg-grey-light-80: rgba(248, 248, 248, 0.8);
          --text-grey-light-80: rgba(248, 248, 248, 0.8);
          --border-grey-light-80: rgba(248, 248, 248, 0.8);
          --bg-grey-light-70: rgba(248, 248, 248, 0.7);
          --text-grey-light-70: rgba(248, 248, 248, 0.7);
          --border-grey-light-70: rgba(248, 248, 248, 0.7);
          --bg-grey-light-60: rgba(248, 248, 248, 0.6);
          --text-grey-light-60: rgba(248, 248, 248, 0.6);
          --border-grey-light-60: rgba(248, 248, 248, 0.6);
          --bg-grey-light-50: rgba(248, 248, 248, 0.5);
          --text-grey-light-50: rgba(248, 248, 248, 0.5);
          --border-grey-light-50: rgba(248, 248, 248, 0.5);
          --bg-grey-light-40: rgba(248, 248, 248, 0.4);
          --text-grey-light-40: rgba(248, 248, 248, 0.4);
          --border-grey-light-40: rgba(248, 248, 248, 0.4);
          --bg-grey-light-30: rgba(248, 248, 248, 0.3);
          --text-grey-light-30: rgba(248, 248, 248, 0.3);
          --border-grey-light-30: rgba(248, 248, 248, 0.3);
          --bg-grey-light-20: rgba(248, 248, 248, 0.2);
          --text-grey-light-20: rgba(248, 248, 248, 0.2);
          --border-grey-light-20: rgba(248, 248, 248, 0.2);
          --bg-grey-light-10: rgba(248, 248, 248, 0.1);
          --text-grey-light-10: rgba(248, 248, 248, 0.1);
          --border-grey-light-10: rgba(248, 248, 248, 0.1);
          --bg-grey-dark-100: rgba(54, 54, 54, 1);
          --text-grey-dark-100: rgba(54, 54, 54, 1);
          --border-grey-dark-100: rgba(54, 54, 54, 1);
         .button.bg-grey-dark-100:hover { background-color: var(--bg-grey-dark-70); }
         .button.text-grey-dark-100:hover { color: var(--text-grey-dark-100); }
          --bg-grey-dark-90: rgba(54, 54, 54, 0.9);
          --text-grey-dark-90: rgba(54, 54, 54, 0.9);
          --border-grey-dark-90: rgba(54, 54, 54, 0.9);
          --bg-grey-dark-80: rgba(54, 54, 54, 0.8);
          --text-grey-dark-80: rgba(54, 54, 54, 0.8);
          --border-grey-dark-80: rgba(54, 54, 54, 0.8);
          --bg-grey-dark-70: rgba(54, 54, 54, 0.7);
          --text-grey-dark-70: rgba(54, 54, 54, 0.7);
          --border-grey-dark-70: rgba(54, 54, 54, 0.7);
          --bg-grey-dark-60: rgba(54, 54, 54, 0.6);
          --text-grey-dark-60: rgba(54, 54, 54, 0.6);
          --border-grey-dark-60: rgba(54, 54, 54, 0.6);
          --bg-grey-dark-50: rgba(54, 54, 54, 0.5);
          --text-grey-dark-50: rgba(54, 54, 54, 0.5);
          --border-grey-dark-50: rgba(54, 54, 54, 0.5);
          --bg-grey-dark-40: rgba(54, 54, 54, 0.4);
          --text-grey-dark-40: rgba(54, 54, 54, 0.4);
          --border-grey-dark-40: rgba(54, 54, 54, 0.4);
          --bg-grey-dark-30: rgba(54, 54, 54, 0.3);
          --text-grey-dark-30: rgba(54, 54, 54, 0.3);
          --border-grey-dark-30: rgba(54, 54, 54, 0.3);
          --bg-grey-dark-20: rgba(54, 54, 54, 0.2);
          --text-grey-dark-20: rgba(54, 54, 54, 0.2);
          --border-grey-dark-20: rgba(54, 54, 54, 0.2);
          --bg-grey-dark-10: rgba(54, 54, 54, 0.1);
          --text-grey-dark-10: rgba(54, 54, 54, 0.1);
          --border-grey-dark-10: rgba(54, 54, 54, 0.1);
          --bg-white-100: rgba(255, 255, 255, 1);
          --text-white-100: rgba(255, 255, 255, 1);
          --border-white-100: rgba(255, 255, 255, 1);
         .button.bg-white-100:hover { background-color: var(--bg-white-70); }
         .button.text-white-100:hover { color: var(--text-white-100); }
          --bg-white-90: rgba(255, 255, 255, 0.9);
          --text-white-90: rgba(255, 255, 255, 0.9);
          --border-white-90: rgba(255, 255, 255, 0.9);
          --bg-white-80: rgba(255, 255, 255, 0.8);
          --text-white-80: rgba(255, 255, 255, 0.8);
          --border-white-80: rgba(255, 255, 255, 0.8);
          --bg-white-70: rgba(255, 255, 255, 0.7);
          --text-white-70: rgba(255, 255, 255, 0.7);
          --border-white-70: rgba(255, 255, 255, 0.7);
          --bg-white-60: rgba(255, 255, 255, 0.6);
          --text-white-60: rgba(255, 255, 255, 0.6);
          --border-white-60: rgba(255, 255, 255, 0.6);
          --bg-white-50: rgba(255, 255, 255, 0.5);
          --text-white-50: rgba(255, 255, 255, 0.5);
          --border-white-50: rgba(255, 255, 255, 0.5);
          --bg-white-40: rgba(255, 255, 255, 0.4);
          --text-white-40: rgba(255, 255, 255, 0.4);
          --border-white-40: rgba(255, 255, 255, 0.4);
          --bg-white-30: rgba(255, 255, 255, 0.3);
          --text-white-30: rgba(255, 255, 255, 0.3);
          --border-white-30: rgba(255, 255, 255, 0.3);
          --bg-white-20: rgba(255, 255, 255, 0.2);
          --text-white-20: rgba(255, 255, 255, 0.2);
          --border-white-20: rgba(255, 255, 255, 0.2);
          --bg-white-10: rgba(255, 255, 255, 0.1);
          --text-white-10: rgba(255, 255, 255, 0.1);
          --border-white-10: rgba(255, 255, 255, 0.1);
          --bg-black-100: rgba(0, 0, 0, 1);
          --text-black-100: rgba(0, 0, 0, 1);
          --border-black-100: rgba(0, 0, 0, 1);
         .button.bg-black-100:hover { background-color: var(--bg-black-70); }
         .button.text-black-100:hover { color: var(--text-black-100); }
          --bg-black-90: rgba(0, 0, 0, 0.9);
          --text-black-90: rgba(0, 0, 0, 0.9);
          --border-black-90: rgba(0, 0, 0, 0.9);
          --bg-black-80: rgba(0, 0, 0, 0.8);
          --text-black-80: rgba(0, 0, 0, 0.8);
          --border-black-80: rgba(0, 0, 0, 0.8);
          --bg-black-70: rgba(0, 0, 0, 0.7);
          --text-black-70: rgba(0, 0, 0, 0.7);
          --border-black-70: rgba(0, 0, 0, 0.7);
          --bg-black-60: rgba(0, 0, 0, 0.6);
          --text-black-60: rgba(0, 0, 0, 0.6);
          --border-black-60: rgba(0, 0, 0, 0.6);
          --bg-black-50: rgba(0, 0, 0, 0.5);
          --text-black-50: rgba(0, 0, 0, 0.5);
          --border-black-50: rgba(0, 0, 0, 0.5);
          --bg-black-40: rgba(0, 0, 0, 0.4);
          --text-black-40: rgba(0, 0, 0, 0.4);
          --border-black-40: rgba(0, 0, 0, 0.4);
          --bg-black-30: rgba(0, 0, 0, 0.3);
          --text-black-30: rgba(0, 0, 0, 0.3);
          --border-black-30: rgba(0, 0, 0, 0.3);
          --bg-black-20: rgba(0, 0, 0, 0.2);
          --text-black-20: rgba(0, 0, 0, 0.2);
          --border-black-20: rgba(0, 0, 0, 0.2);
          --bg-black-10: rgba(0, 0, 0, 0.1);
          --text-black-10: rgba(0, 0, 0, 0.1);
          --border-black-10: rgba(0, 0, 0, 0.1);
}

        /* green-dark Colour selection */
         .bg-green-dark-100 { background-color: var(--bg-green-dark-100); }
         .text-green-dark-100 { color: var(--text-green-dark-100); }
         .border-green-dark-100 { border-color: var(--border-green-dark-100); }
         .bg-green-dark-90 { background-color: var(--bg-green-dark-90); }
         .text-green-dark-90 { color: var(--text-green-dark-90); }
         .border-green-dark-90 { border-color: var(--border-green-dark-90); }
         .bg-green-dark-80 { background-color: var(--bg-green-dark-80); }
         .text-green-dark-80 { color: var(--text-green-dark-80); }
         .border-green-dark-80 { border-color: var(--border-green-dark-80); }
         .bg-green-dark-70 { background-color: var(--bg-green-dark-70); }
         .text-green-dark-70 { color: var(--text-green-dark-70); }
         .border-green-dark-70 { border-color: var(--border-green-dark-70); }
         .bg-green-dark-60 { background-color: var(--bg-green-dark-60); }
         .text-green-dark-60 { color: var(--text-green-dark-60); }
         .border-green-dark-60 { border-color: var(--border-green-dark-60); }
         .bg-green-dark-50 { background-color: var(--bg-green-dark-50); }
         .text-green-dark-50 { color: var(--text-green-dark-50); }
         .border-green-dark-50 { border-color: var(--border-green-dark-50); }
         .bg-green-dark-40 { background-color: var(--bg-green-dark-40); }
         .text-green-dark-40 { color: var(--text-green-dark-40); }
         .border-green-dark-40 { border-color: var(--border-green-dark-40); }
         .bg-green-dark-30 { background-color: var(--bg-green-dark-30); }
         .text-green-dark-30 { color: var(--text-green-dark-30); }
         .border-green-dark-30 { border-color: var(--border-green-dark-30); }
         .bg-green-dark-20 { background-color: var(--bg-green-dark-20); }
         .text-green-dark-20 { color: var(--text-green-dark-20); }
         .border-green-dark-20 { border-color: var(--border-green-dark-20); }
         .bg-green-dark-10 { background-color: var(--bg-green-dark-10); }
         .text-green-dark-10 { color: var(--text-green-dark-10); }
         .border-green-dark-10 { border-color: var(--border-green-dark-10); }
        /* green-light Colour selection */
         .bg-green-light-100 { background-color: var(--bg-green-light-100); }
         .text-green-light-100 { color: var(--text-green-light-100); }
         .border-green-light-100 { border-color: var(--border-green-light-100); }
         .bg-green-light-90 { background-color: var(--bg-green-light-90); }
         .text-green-light-90 { color: var(--text-green-light-90); }
         .border-green-light-90 { border-color: var(--border-green-light-90); }
         .bg-green-light-80 { background-color: var(--bg-green-light-80); }
         .text-green-light-80 { color: var(--text-green-light-80); }
         .border-green-light-80 { border-color: var(--border-green-light-80); }
         .bg-green-light-70 { background-color: var(--bg-green-light-70); }
         .text-green-light-70 { color: var(--text-green-light-70); }
         .border-green-light-70 { border-color: var(--border-green-light-70); }
         .bg-green-light-60 { background-color: var(--bg-green-light-60); }
         .text-green-light-60 { color: var(--text-green-light-60); }
         .border-green-light-60 { border-color: var(--border-green-light-60); }
         .bg-green-light-50 { background-color: var(--bg-green-light-50); }
         .text-green-light-50 { color: var(--text-green-light-50); }
         .border-green-light-50 { border-color: var(--border-green-light-50); }
         .bg-green-light-40 { background-color: var(--bg-green-light-40); }
         .text-green-light-40 { color: var(--text-green-light-40); }
         .border-green-light-40 { border-color: var(--border-green-light-40); }
         .bg-green-light-30 { background-color: var(--bg-green-light-30); }
         .text-green-light-30 { color: var(--text-green-light-30); }
         .border-green-light-30 { border-color: var(--border-green-light-30); }
         .bg-green-light-20 { background-color: var(--bg-green-light-20); }
         .text-green-light-20 { color: var(--text-green-light-20); }
         .border-green-light-20 { border-color: var(--border-green-light-20); }
         .bg-green-light-10 { background-color: var(--bg-green-light-10); }
         .text-green-light-10 { color: var(--text-green-light-10); }
         .border-green-light-10 { border-color: var(--border-green-light-10); }
        /* grey-light Colour selection */
         .bg-grey-light-100 { background-color: var(--bg-grey-light-100); }
         .text-grey-light-100 { color: var(--text-grey-light-100); }
         .border-grey-light-100 { border-color: var(--border-grey-light-100); }
         .bg-grey-light-90 { background-color: var(--bg-grey-light-90); }
         .text-grey-light-90 { color: var(--text-grey-light-90); }
         .border-grey-light-90 { border-color: var(--border-grey-light-90); }
         .bg-grey-light-80 { background-color: var(--bg-grey-light-80); }
         .text-grey-light-80 { color: var(--text-grey-light-80); }
         .border-grey-light-80 { border-color: var(--border-grey-light-80); }
         .bg-grey-light-70 { background-color: var(--bg-grey-light-70); }
         .text-grey-light-70 { color: var(--text-grey-light-70); }
         .border-grey-light-70 { border-color: var(--border-grey-light-70); }
         .bg-grey-light-60 { background-color: var(--bg-grey-light-60); }
         .text-grey-light-60 { color: var(--text-grey-light-60); }
         .border-grey-light-60 { border-color: var(--border-grey-light-60); }
         .bg-grey-light-50 { background-color: var(--bg-grey-light-50); }
         .text-grey-light-50 { color: var(--text-grey-light-50); }
         .border-grey-light-50 { border-color: var(--border-grey-light-50); }
         .bg-grey-light-40 { background-color: var(--bg-grey-light-40); }
         .text-grey-light-40 { color: var(--text-grey-light-40); }
         .border-grey-light-40 { border-color: var(--border-grey-light-40); }
         .bg-grey-light-30 { background-color: var(--bg-grey-light-30); }
         .text-grey-light-30 { color: var(--text-grey-light-30); }
         .border-grey-light-30 { border-color: var(--border-grey-light-30); }
         .bg-grey-light-20 { background-color: var(--bg-grey-light-20); }
         .text-grey-light-20 { color: var(--text-grey-light-20); }
         .border-grey-light-20 { border-color: var(--border-grey-light-20); }
         .bg-grey-light-10 { background-color: var(--bg-grey-light-10); }
         .text-grey-light-10 { color: var(--text-grey-light-10); }
         .border-grey-light-10 { border-color: var(--border-grey-light-10); }
        /* grey-dark Colour selection */
         .bg-grey-dark-100 { background-color: var(--bg-grey-dark-100); }
         .text-grey-dark-100 { color: var(--text-grey-dark-100); }
         .border-grey-dark-100 { border-color: var(--border-grey-dark-100); }
         .bg-grey-dark-90 { background-color: var(--bg-grey-dark-90); }
         .text-grey-dark-90 { color: var(--text-grey-dark-90); }
         .border-grey-dark-90 { border-color: var(--border-grey-dark-90); }
         .bg-grey-dark-80 { background-color: var(--bg-grey-dark-80); }
         .text-grey-dark-80 { color: var(--text-grey-dark-80); }
         .border-grey-dark-80 { border-color: var(--border-grey-dark-80); }
         .bg-grey-dark-70 { background-color: var(--bg-grey-dark-70); }
         .text-grey-dark-70 { color: var(--text-grey-dark-70); }
         .border-grey-dark-70 { border-color: var(--border-grey-dark-70); }
         .bg-grey-dark-60 { background-color: var(--bg-grey-dark-60); }
         .text-grey-dark-60 { color: var(--text-grey-dark-60); }
         .border-grey-dark-60 { border-color: var(--border-grey-dark-60); }
         .bg-grey-dark-50 { background-color: var(--bg-grey-dark-50); }
         .text-grey-dark-50 { color: var(--text-grey-dark-50); }
         .border-grey-dark-50 { border-color: var(--border-grey-dark-50); }
         .bg-grey-dark-40 { background-color: var(--bg-grey-dark-40); }
         .text-grey-dark-40 { color: var(--text-grey-dark-40); }
         .border-grey-dark-40 { border-color: var(--border-grey-dark-40); }
         .bg-grey-dark-30 { background-color: var(--bg-grey-dark-30); }
         .text-grey-dark-30 { color: var(--text-grey-dark-30); }
         .border-grey-dark-30 { border-color: var(--border-grey-dark-30); }
         .bg-grey-dark-20 { background-color: var(--bg-grey-dark-20); }
         .text-grey-dark-20 { color: var(--text-grey-dark-20); }
         .border-grey-dark-20 { border-color: var(--border-grey-dark-20); }
         .bg-grey-dark-10 { background-color: var(--bg-grey-dark-10); }
         .text-grey-dark-10 { color: var(--text-grey-dark-10); }
         .border-grey-dark-10 { border-color: var(--border-grey-dark-10); }
        /* white Colour selection */
         .bg-white-100 { background-color: var(--bg-white-100); }
         .text-white-100 { color: var(--text-white-100); }
         .border-white-100 { border-color: var(--border-white-100); }
         .bg-white-90 { background-color: var(--bg-white-90); }
         .text-white-90 { color: var(--text-white-90); }
         .border-white-90 { border-color: var(--border-white-90); }
         .bg-white-80 { background-color: var(--bg-white-80); }
         .text-white-80 { color: var(--text-white-80); }
         .border-white-80 { border-color: var(--border-white-80); }
         .bg-white-70 { background-color: var(--bg-white-70); }
         .text-white-70 { color: var(--text-white-70); }
         .border-white-70 { border-color: var(--border-white-70); }
         .bg-white-60 { background-color: var(--bg-white-60); }
         .text-white-60 { color: var(--text-white-60); }
         .border-white-60 { border-color: var(--border-white-60); }
         .bg-white-50 { background-color: var(--bg-white-50); }
         .text-white-50 { color: var(--text-white-50); }
         .border-white-50 { border-color: var(--border-white-50); }
         .bg-white-40 { background-color: var(--bg-white-40); }
         .text-white-40 { color: var(--text-white-40); }
         .border-white-40 { border-color: var(--border-white-40); }
         .bg-white-30 { background-color: var(--bg-white-30); }
         .text-white-30 { color: var(--text-white-30); }
         .border-white-30 { border-color: var(--border-white-30); }
         .bg-white-20 { background-color: var(--bg-white-20); }
         .text-white-20 { color: var(--text-white-20); }
         .border-white-20 { border-color: var(--border-white-20); }
         .bg-white-10 { background-color: var(--bg-white-10); }
         .text-white-10 { color: var(--text-white-10); }
         .border-white-10 { border-color: var(--border-white-10); }
        /* black Colour selection */
         .bg-black-100 { background-color: var(--bg-black-100); }
         .text-black-100 { color: var(--text-black-100); }
         .border-black-100 { border-color: var(--border-black-100); }
         .bg-black-90 { background-color: var(--bg-black-90); }
         .text-black-90 { color: var(--text-black-90); }
         .border-black-90 { border-color: var(--border-black-90); }
         .bg-black-80 { background-color: var(--bg-black-80); }
         .text-black-80 { color: var(--text-black-80); }
         .border-black-80 { border-color: var(--border-black-80); }
         .bg-black-70 { background-color: var(--bg-black-70); }
         .text-black-70 { color: var(--text-black-70); }
         .border-black-70 { border-color: var(--border-black-70); }
         .bg-black-60 { background-color: var(--bg-black-60); }
         .text-black-60 { color: var(--text-black-60); }
         .border-black-60 { border-color: var(--border-black-60); }
         .bg-black-50 { background-color: var(--bg-black-50); }
         .text-black-50 { color: var(--text-black-50); }
         .border-black-50 { border-color: var(--border-black-50); }
         .bg-black-40 { background-color: var(--bg-black-40); }
         .text-black-40 { color: var(--text-black-40); }
         .border-black-40 { border-color: var(--border-black-40); }
         .bg-black-30 { background-color: var(--bg-black-30); }
         .text-black-30 { color: var(--text-black-30); }
         .border-black-30 { border-color: var(--border-black-30); }
         .bg-black-20 { background-color: var(--bg-black-20); }
         .text-black-20 { color: var(--text-black-20); }
         .border-black-20 { border-color: var(--border-black-20); }
         .bg-black-10 { background-color: var(--bg-black-10); }
         .text-black-10 { color: var(--text-black-10); }
         .border-black-10 { border-color: var(--border-black-10); }