/* ==========================================================
   PROFILE TRANSITIONS
========================================================== */

.profile-card{

    transition:

        opacity var(--duration-normal) var(--ease),

        transform var(--duration-normal) var(--ease);

}

.profile-card.fade-out{

    opacity:0;

    transform:

        scale(.96)

        translateY(12px);

}

.profile-card.fade-in{

    opacity:1;

    transform:

        scale(1)

        translateY(0);

}

.accept-btn{

    transition:

        transform .35s var(--ease);

}

.accept-btn.pulse{

    transform:scale(1.15);

}

/* ==========================================================
   BACKGROUND FLOAT
========================================================== */

@keyframes float{

    0%{

        transform:

            translateY(0px);

    }

    50%{

        transform:

            translateY(-30px);

    }

    100%{

        transform:

            translateY(0);

    }

}

.blob-left{

    animation:

        float 10s ease-in-out infinite;

}

.blob-right{

    animation:

        float 14s ease-in-out infinite reverse;

}

@keyframes scroll-wheel{

    0%{

        opacity:1;

        transform:

            translate(-50%,0);

    }

    100%{

        opacity:0;

        transform:

            translate(-50%,18px);

    }

}

/* .device{

    transform:

        rotate(-6deg);

} */