@keyframes showload {
    from {opacity: 0;}
    to {opacity: 1;}
}
@keyframes hideload {
    from {opacity: 1;}
    to {opacity: 0;}
}
@keyframes showbtnst {
    from {
        transform: translate(-50%) scale(0.5);
        opacity: 0;
    }
    to {
        transform: translate(-50%) scale(1);
        opacity: 1;
    }
}
@keyframes starthide {
    from {
        transform: translate(-50%) scale(1);
        opacity: 1;
    }
    to {
        transform: translate(-50%) scale(0.5);
        opacity: 0;
    }
} 
@keyframes gotonav {
    0% {transform: translate(-50%, -50%); left: 50%; top: 50%}
    45% {transform: translate(-50%, -50%)  scale(0.5); opacity: 1; left: 4%; top: 5%}

    85% {transform: translate(-50%, -50%)  scale(0.5); opacity: 1; left: 4%; top: 5%}
    100% {transform: translate(-50%, -50%)  scale(0.1); opacity: 0; left: 4%; top: 5%}

}
@keyframes mainmenuin {
    from {
        opacity: 0;
        transform: translateY(-50%) scale(0.5);
    }
    to {
        opacity: 1;
        transform: translateY(-50%) scale(1);
    }
}
@keyframes mainmenubgin {
    from {
        opacity: 0;
        transform:  scale(1.5);
    }
    to {
        opacity: 1;
        transform:  scale(1);
    }
}

@keyframes mainmenuout {
    from {
        opacity: 1;
        transform: translateY(-50%) scale(1);
    }
    to {
        opacity: 0;
        transform: translateY(-50%) scale(0.5);
    }
    
}
@keyframes mainmenubgout {
    from {
        opacity: 1;
        transform:  scale(1);
    }
    to {
        opacity: 0;
        transform:  scale(1.5);
    }
   
}