website-new/frontend/src/styles/cards.css

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer components {
    .card {
      @apply px-12 py-12 bg-white dark:bg-dg-primary-1700 text-dark-gray dark:text-white shadow-md dark:border-dg-primary-1500 dark:border-solid dark:border text-center rounded-xl cursor-pointer z-10 transition-all hover:scale-105 hover:transition-all;
    }

    .card_post {
        @apply px-8 py-8 bg-white dark:bg-dg-primary-1700 text-dark-gray dark:text-white shadow-md dark:border-dg-primary-1500 dark:border-solid dark:border text-left rounded-xl cursor-pointer transition-all hover:scale-105 hover:transition-all;
    }

    .card-no-hover {
      @apply px-12 py-12 bg-white dark:bg-dg-primary-1700 text-dark-gray dark:text-white shadow-md dark:border-dg-primary-1500 dark:border-solid dark:border text-center rounded-xl z-10 transition-all;
    }

    .action-card-component {
      @apply 
    }

    .card-plain {
      @apply p-12
    }

  }

  .leaf {
    border-bottom-right-radius: 32px;
  }

  .action-card {
    background: #FFFFFF;
    border: 1px solid #D4D4D4;
    border-radius: 18px;
  }

  .active-image {
    opacity: 1 !important;
  }