#message{
    position: absolute;
    left: 0;
    right: 0;
	top: 100%;
	margin-top: -2px;
    text-align: center;
}
.message{
    min-height: 60px;
    border-radius: 0 0 6px 6px;
    background-color: rgba(255,255,255,0.96);
    width:500px;
    padding: 20px;
    margin: 0 auto;
    box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.3), inset 0px 0px 2px rgba(255,255,255,0.3);
}
.message-inside > span{
    display: block;
    text-align: center;
    font-size: 15px;
    line-height: 15px;
    color: rgb(30,30,30);
    font-weight: bold;
}
#message.show{
    -webkit-animation: slidedown 0.2s forwards;
    -webkit-animation-delay: 0.2s;
    -moz-animation: slidedown 0.2s forwards;
    -moz-animation-delay: 0.2s;
    animation: slidedown 0.2s forwards;
    animation-delay: 0.2s;
}
#message.hide{
    -webkit-animation: slideup 0.2s forwards;
    -webkit-animation-delay: 0.2s;
    -moz-animation: slideup 0.2s forwards;
    -moz-animation-delay: 0.2s;
    animation: slideup 0.2s forwards;
    animation-delay: 0.2s;
}

@keyframes slidedown {
    from {
        top:-100%;
    }
    to {
        top:100%;
    }
}
@keyframes slideup {
    from {
        top:100%;
    }
    to {
        top:-100%;
    }
}
@-webkit-keyframes slidedown {
    from {
        top:-100%;
    }
    to {
        top:100%;
    }
}
@-webkit-keyframes slideup {
    from {
        top:100%;
    }
    to {
        top:-100%;
    }
}
@-moz-keyframes slidedown {
    from {
        top:-100%;
    }
    to {
        top:100%;
    }
}
@-moz-keyframes slideup {
    from {
        top:100%;
    }
    to {
        top:-100%;
    }
}