@keyframes headerani {
    from {
        top:200px;
        opacity: 0.0;
    }
    to {
        top:0px;
        opacity: 1;
    }
}

@keyframes in {
    from {
        opacity: 0.0;
    }
    to {
        opacity: 1;
    }
}

.headerimg {
    animation-name: headerani;
    animation-duration:575ms;
    animation-delay: 500ms;
    animation-direction: cubic-bezier(0.0, 0.0, 0.2, 1);
    position: relative;
    animation-fill-mode:forwards;
}

.ptn {
    animation-name: headerani;
    animation-duration:575ms;
    animation-delay: 500ms;
    animation-direction: cubic-bezier(0.0, 0.0, 0.2, 1);
    position: relative;
    animation-fill-mode:forwards;
}

body {
    animation-name: in;
    animation-duration:575ms;
    animation-delay: 0s;
}