70 lines
1.4 KiB
CSS
70 lines
1.4 KiB
CSS
@import "tailwindcss";
|
|
|
|
:root {
|
|
--background: #030712;
|
|
--foreground: #f9fafb;
|
|
}
|
|
|
|
@theme inline {
|
|
--color-background: var(--background);
|
|
--color-foreground: var(--foreground);
|
|
--font-sans: var(--font-geist-sans);
|
|
--font-mono: var(--font-geist-mono);
|
|
}
|
|
|
|
body {
|
|
background: var(--background);
|
|
color: var(--foreground);
|
|
font-family: Arial, Helvetica, sans-serif;
|
|
}
|
|
|
|
/* Glow utilities */
|
|
.glow-cyan {
|
|
box-shadow: 0 0 20px rgba(6, 182, 212, 0.3);
|
|
}
|
|
|
|
.glow-cyan-hover:hover {
|
|
box-shadow: 0 0 28px rgba(6, 182, 212, 0.5);
|
|
}
|
|
|
|
.border-glow-left {
|
|
border-left: 3px solid rgba(6, 182, 212, 0.8);
|
|
box-shadow: -4px 0 15px rgba(6, 182, 212, 0.2);
|
|
}
|
|
|
|
.text-glow {
|
|
text-shadow: 0 0 24px rgba(6, 182, 212, 0.6);
|
|
}
|
|
|
|
/* Carousel scroll animations */
|
|
@keyframes carousel-left {
|
|
0% { transform: translateX(0); }
|
|
100% { transform: translateX(-50%); }
|
|
}
|
|
|
|
@keyframes carousel-right {
|
|
0% { transform: translateX(-50%); }
|
|
100% { transform: translateX(0); }
|
|
}
|
|
|
|
/* Animated gradient background */
|
|
@keyframes gradient-shift {
|
|
0%, 100% { background-position: 0% 50%; }
|
|
50% { background-position: 100% 50%; }
|
|
}
|
|
|
|
.animate-gradient-bg {
|
|
background-size: 200% 200%;
|
|
animation: gradient-shift 8s ease infinite;
|
|
}
|
|
|
|
/* Icon glow pulse */
|
|
@keyframes icon-glow-pulse {
|
|
0%, 100% { filter: drop-shadow(0 0 3px rgba(6, 182, 212, 0.3)); }
|
|
50% { filter: drop-shadow(0 0 12px rgba(6, 182, 212, 0.7)); }
|
|
}
|
|
|
|
.icon-pulse {
|
|
animation: icon-glow-pulse 3s ease-in-out infinite;
|
|
}
|