/** Fonts **/
@import url("https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|PT+Sans");
/** Variables **/
/** Mixins **/

body .announcements-container {
    width: 100%;
    background: #ffcb08;
    /*overflow: hidden;
        position: absolute;
        top: 40%;
        left: 20%;
        display: inline-block;
        font-family: "PT Sans", sans-serif;*/
    height: 40px;
    line-height: 40px;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-bottomleft: 4px;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}

        body .announcements-container:hover {
            box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.2);
        }

    body .announcements-container .container-title {
        width: 13%;
        height: 100%;
        overflow: hidden;
        padding: 0 15px 0 15px;
        float: left;
        background: #00529c;
        text-align: center;
        font-size: 13px;
        text-transform: uppercase;
        color: white;
        letter-spacing: 1px;
        -webkit-border-top-left-radius: 2px;
        -webkit-border-bottom-left-radius: 2px;
        -moz-border-radius-topleft: 2px;
        -moz-border-radius-bottomleft: 2px;
        border-top-left-radius: 2px;
        border-bottom-left-radius: 2px;
    }

    @media only screen and (max-width:520px) and (min-width:220px)
    {
        body .announcements-container .container-title 
        {
            width: 20% !important;
        }
    }

            body .announcements-container .container-title img {
                width: 16px;
                height: 16px;
                vertical-align: middle;
                margin: -5px 3px 0 0;
            }

        body .announcements-container ul.announcements {
            width: 67%;
            float: left;
            height: 40px;
            overflow: hidden;
            list-style-type: none;
            vertical-align: middle;
        }

            body .announcements-container ul.announcements li {
                width: 100%;
                overflow: hidden;
                font-size: 14px;
                /*margin: -15px 0 0 0;*/
                vertical-align: middle;
                padding: 0;
                line-height: 40px;
                text-align: left;
                white-space: nowrap;
                text-overflow: ellipsis;
            }

                body .announcements-container ul.announcements li a {
                    width: 100%;
                    text-decoration: none;
                    color: #000 !important;
                    font-weight:500;
                    margin-left:20px;
                    -webkit-transition: color 0.5s ease-out;
                    -moz-transition: color 0.5s ease-out;
                    -o-transition: color 0.5s ease-out;
                    transition: color 0.5s ease-out;
                }

                    body .announcements-container ul.announcements li a:hover {
                        color: #03a9f4;
                    }

                    body .announcements-container ul.announcements li a:visited {
                        color: #616161;
                    }