#account-box.home-init > form button {
            width: 100px;
            height: 34px;
            font-size: 14px;
            text-transform: uppercase;
            -webkit-border-radius: 3px;
            -moz-border-radius: 3px;
            border-radius: 3px;
            border: none;
        }          

        #account-box.home-init > form *.login-btn {
            color: #352823;
            background: #fda900;
            border: none;
        }

        #account-box.home-init > form *.register-btn {
            color: #fff;
            background: #f11500;
            border: none;
        }

        #account-box.home-init > form .btn-hover {
            position: relative;
            overflow: hidden;
	    margin:5px
        }

            #account-box.home-init > form .btn-hover span {
                display: inline-block;
                position: absolute;
                left: 0;
                width: 100%;
                height: 100%;
                line-height: 34px;
                -webkit-transition: top 300ms ease-in-out;
                -moz-transition: top 300ms ease-in-out;
                -ms-transition: top 300ms ease-in-out;
                -o-transition: top 300ms ease-in-out;
                transition: top 300ms ease-in-out;
            }

                #account-box.home-init > form .btn-hover span.non-hover {
                    top: 0;
                }

                #account-box.home-init > form .btn-hover span.hover {
                    top: 100%;
                }

            #account-box.home-init > form .btn-hover:hover span.non-hover {
                top: -100%;
            }

            #account-box.home-init > form .btn-hover:hover span.hover {
                top: 0;
            }
       
        #account-box.home-init > form ul.home-nav {
            display: inline-block;
            font-size: 12px;
            text-align: center;
	    width:220px
        }

            #account-box.home-init > form ul.home-nav > li {
                display: inline-block;
                line-height: 30px;
            }

                #account-box.home-init > form ul.home-nav > li + li:before {
                    content: '|';
                    padding: 0 7px;
                    color: #f8d169;
                }

                #account-box.home-init > form ul.home-nav > li > a {
                    display: inline-block;
                    color: #f8d169;
                    font-size: 12px;
                    text-decoration: none;
                    text-align: center;
                    cursor: pointer;
                }

                #account-box.home-init > form ul.home-nav > li:hover > a {
                    color: red;
                }            

@keyframes flipInX {
    from {
        transform: perspective(400px) rotate3d(1,0,0,90deg);
        animation-timing-function: ease-in;
        opacity: 0;
    }

    40% {
        transform: perspective(400px) rotate3d(1,0,0,-20deg);
        animation-timing-function: ease-in;
    }

    60% {
        transform: perspective(400px) rotate3d(1,0,0,10deg);
        opacity: 1;
    }

    80% {
        transform: perspective(400px) rotate3d(1,0,0,-5deg);
    }

    to {
        transform: perspective(400px);
    }
}

#account-box.home-init.flipInX {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    animation-name: flipInX;
}

#account-box.home-init.animated {
    animation-duration: 1s;
    animation-fill-mode: both;
}