@import 'tailwindcss/utilities';
@import 'tailwindcss/base';
@import 'tailwindcss/components';

.card {
    @apply rounded-xl
}


.card .icon {
    background-color: transparent !important;
    border-color: var(--sl-color-text) !important
}

@media (min-width: 50rem) {
    .hero {
        grid-template-columns: 7fr 7fr;
    }

    .hero>.hero-html {
        width: 100%;
    }
}