*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family:Arial, sans-serif;
}

.announcement-wrapper{
    width:100%;
    height:40px;
    font-size:16px;
    overflow:hidden;
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0 20px;
}
.announcement-link {
	color: #fff;
    text-decoration: none;
    background-color: #0b3d91;
    padding: 4px 8px;
    margin: 0 5px;
    border-radius: 25px;
    font-size: 14px !important;
	white-space: nowrap !important;
}
.announcement-link:hover {
	background-color: #0b3d91;
	text-decoration: underline;
	color:#fff !important;
}

.announcement a:hover {
	color:#fff !important;
}
.announcement{
    position:absolute;
    width:100%;
    text-align:center;
    font-weight:bold;
    color:#0b3d91;
    opacity:0;
    visibility:hidden;
    transition: opacity 0.8s ease, transform 0.8s ease;
    transform:translateX(10px);
}

.announcement.show{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}

.announcement a{   
}

.announcement a:hover{
}

/* Mobile Responsive */

@media(max-width:768px){

    .announcement{
        line-height:24px;
        padding:0 10px;
    }

    .announcement-wrapper{
        height:90px;
    }
}