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

#myNavbar {
    transition: all 0.3s ease;
}

#myNavbar.navbar-scrolled {
    position: fixed;
    top: 0;
    z-index: 50;
    background: #fff;
}

.about-bg {
    background:

        /* Main center glow (70%) */
        radial-gradient(
            ellipse 75% 90% at center,
            #8EDFFF 0%,
            #BDEFFF 35%,
            #DDF7FF 60%,
            rgba(255,255,255,0) 100%
        ),

        /* Left soft fade */
        radial-gradient(
            ellipse 35% 100% at left center,
            rgba(255,255,255,.9) 0%,
            rgba(255,255,255,.6) 45%,
            rgba(255,255,255,0) 100%
        ),

        /* Right soft fade */
        radial-gradient(
            ellipse 35% 100% at right center,
            rgba(255,255,255,.9) 0%,
            rgba(255,255,255,.6) 45%,
            rgba(255,255,255,0) 100%
        ),

        /* Base */
        linear-gradient(
            180deg,
            #ffffff 0%,
            #eefaff 45%,
            #d9f3ff 100%
        );
}