/* -------------
    SOMMAIRE
------------- */

/*
    @AUTHOR : Nicolas BOUDOT

    PROPRIÉTÉ : TRANSITION
    Styles liés aux transitions
*/

/*
    01 - XS
        Transition
            Property
            Duration
            Timing Function
            Delay
    02 - SM
    03 - MD
    04 - LG
    05 - XL
    06 - XXL
*/



/* -----------------
    01 - XS
        Transition
            Property
----------------- */

.tp-top {
    transition-property: top;
}

.tp-color {
    transition-property: color;
}

.tp-text-decoration {
    transition-property: text-decoration;
}




/* -----------------
    01 - XS
        Transition
            Duration
----------------- */

.td-100ms {
    transition-duration: 100ms;
}

.td-200ms {
    transition-duration: 200ms;
}

.td-300ms {
    transition-duration: 300ms;
}

.td-400ms {
    transition-duration: 400ms;
}

.td-500ms {
    transition-duration: 500ms;
}

.td-600ms {
    transition-duration: 600ms;
}

.td-700ms {
    transition-duration: 700ms;
}

.td-800ms {
    transition-duration: 800ms;
}

.td-900ms {
    transition-duration: 900ms;
}

.td-1000ms {
    transition-duration: 1000ms;
}



/* -----------------------------
    01 - XS
        Transition
            Timing Function
----------------------------- */

.ttf-ease {
    transition-timing-function: ease;
}

.ttf-ease-in {
    transition-timing-function: ease-in;
}

.ttf-ease-out {
    transition-timing-function: ease-out;
}

.ttf-ease-in-out {
    transition-timing-function: ease-in-out;
}

.ttf-linear {
    transition-timing-function: linear;
}

.ttf-step-start {
    transition-timing-function: step-start;
}

.ttf-step-end {
    transition-timing-function: step-end;
}



/* -----------------
    01 - XS
        Transition
            Delay
----------------- */

/* Différencier transition-duration et transition-delay */


.t-delay-100ms {
    transition-delay: 100ms;
}