.come-top{
    animation: top .8s ease-in-out;
    }
    .come-right{
    animation: right .8s ease-in-out;
        
    }
    .come-left{
    animation: left .8s ease-in-out;
        
    }
    .come-bottom{
    animation: bottom .8s ease-in-out;
        
    }
    
    @keyframes top {
        0%{transform: translateY(-100pc); opacity: 0;}
       100%{transform: translateY(0pc);opacity: 1;}
    
    }
    @keyframes left {
        0%{transform: translateX(-100pc); opacity: 0}
       100%{transform: translateX(0pc);opacity: 1;}
    
    }
    @keyframes right {
        0%{transform: translateX(100pc); opacity: 0;}
       100%{transform: translateX(0pc);opacity: 1;}
    
    }
    @keyframes bottom {
        0%{transform: translateY(100pc);opacity: 0;}
       100%{transform: translateY(0pc);opacity: 1;}
    
    }