﻿@keyframes ToTopButton 
{
    0% 
    {
        background-position: 7px 6px;
    }

    30% 
    {
        background-position: 7px 36px;
    }

    70% 
    {
        background-position: 7px 36px;
    }

    100% 
    {
        background-position: 7px 65px;
    }
}

@-webkit-keyframes ToTopButton
{
    0% 
    {
        background-position: 7px 6px;
    }

    30% 
    {
        background-position: 7px 36px;
    }

    70% 
    {
        background-position: 7px 36px;
    }

    100% 
    {
        background-position: 7px 65px;
    }
}

@-moz-keyframes ToTopButton
{
    0% 
    {
        background-position: 7px 6px;
    }

    30% 
    {
        background-position: 7px 36px;
    }

    70% 
    {
        background-position: 7px 36px;
    }

    100% 
    {
        background-position: 7px 65px;
    }
}

@-o-keyframes ToTopButton
{
    0% 
    {
        background-position: 7px 6px;
    }

    30% 
    {
        background-position: 7px 36px;
    }

    70% 
    {
        background-position: 7px 36px;
    }

    100% 
    {
        background-position: 7px 65px;
    }
}

.ToTop:hover
{
    background-image: url('../file/app/1/editor/icon/selector.svg') !important;
    background-position: 7px 6px;
    animation: ToTopButton 0.7s linear 1;
    -webkit-animation: ToTopButton 0.7s linear 1;
    -moz-animation: ToTopButton 0.7s linear 1;
    -o-animation: ToTopButton 0.7s linear 1;
}

/* Tooltip */
.ToTop:hover:after
{
    font-style: inherit;
    content: attr(alt);
    position: fixed;
    bottom: -30px;
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    background-color: rgba(255,255,255,0.8);
    border-radius: 3px;
    font-size: 12px;
    padding: 5px;
    width: 85px;
    box-shadow: 0 0 1px 1px rgba(0,0,0,0.4);
}