/* ========== homepage specific ========== */

.textFade {
    background-image: linear-gradient(white,
            white,
            magenta,
            magenta,
            cyan,
            cyan);
    color: transparent;
    background-clip: text;
}

/* ========== Special effects ========== */

div {
    transition-property: box-shadow;
    transition-duration: 2s;
}

span {
    transition-property: box-shadow;
    transition-duration: 2s;
}

#crtBurstText {
    transition-property: text-shadow;
    transition-duration: 2s;
}

.crtBurstOff {
    box-shadow: none;
    text-shadow: none;
}

.crtBurstBox {
    box-shadow:
        0px 0px 35px 0px white,
        0px 0px 20px 0px magenta;
}

.crtBurstText {
    text-shadow:
        0px -5px 8px white,
        -5px -5px 10px magenta,
        5px -5px 10px magenta,
        -5px 5px 10px magenta,
        5px 5px 10px magenta;
}

.crtBurstTop {
    box-shadow:
        0px -5px 35px 0px cyan,
        0px -5px 20px 0px white;
}

.crtBurstBottom {
    box-shadow:
        0px 5px 35px 0px cyan,
        0px 5px 20px 0px white;
}

.crtBurstLeft {
    box-shadow:
        -5px 0px 35px 0px cyan,
        -5px 0px 20px 0px white;
}

.crtBurstRight {
    box-shadow:
        5px 0px 35px 0px cyan,
        5px 0px 20px 0px white;
}

.crtBurstTopLeft {
    box-shadow:
        -5px -5px 35px 0px cyan,
        -5px -5px 20px 0px white;
}

.crtBurstBottomRight {
    box-shadow:
        5px 5px 35px 0px cyan,
        5px 5px 20px 0px white;
}

.crtBurstTopRight {
    box-shadow:
        5px -5px 35px 0px cyan,
        5px -5px 20px 0px white;
}

.crtBurstBottomLeft {
    box-shadow:
        -5px 5px 35px 0px cyan,
        -5px 5px 20px 0px white;
}