[data-sal] {
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transition-delay: var(--sal-delay, 0s);
    transition-delay: var(--sal-delay, 0s);
    -webkit-transition-duration: .2s;
    transition-duration: .2s;
    -webkit-transition-duration: var(--sal-duration, .2s);
    transition-duration: var(--sal-duration, .2s);
    -webkit-transition-timing-function: ease;
    transition-timing-function: ease;
    -webkit-transition-timing-function: var(--sal-easing, ease);
    transition-timing-function: var(--sal-easing, ease)
}

    [data-sal][data-sal-duration="800"] {
        -webkit-transition-duration: .8s;
        transition-duration: .8s
    }

    [data-sal][data-sal-delay="100"] {
        -webkit-transition-delay: .1s;
        transition-delay: .1s
    }

    [data-sal][data-sal-delay="150"] {
        -webkit-transition-delay: .15s;
        transition-delay: .15s
    }

    [data-sal][data-sal-delay="800"] {
        -webkit-transition-delay: .8s;
        transition-delay: .8s
    }

[data-sal|=fade] {
    opacity: 0;
    -webkit-transition-property: opacity;
    transition-property: opacity
}

    [data-sal|=fade].sal-animate {
        opacity: 1
    }

[data-sal|=slide] {
    opacity: 0;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform
}

[data-sal=slide-up] {
    -webkit-transform: translateY(20%);
    -ms-transform: translateY(20%);
    transform: translateY(20%)
}

[data-sal|=slide].sal-animate {
    opacity: 1;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none
}
