.whatsNew-sidebar {
    position: sticky;
    top: calc(50vh - 13rem);
    z-index: 1;
}
@media (max-width:767px)  {
    .whatsNew-sidebar {
        position: fixed;
        top: 53px;
        width: 100%;
        box-shadow: 5px 5px 5px 0px rgb(171 171 171 / 75%);
    }
}

.whatsNewNavigation {
    display: flex;
    justify-content: flex-end;
    background: #fff;
    margin-right: 30px;
}
@media (max-width:767px)  {
    .whatsNewNavigation {
        width: 100%;
    }
}

.whatsNewNavigation-alphabet{
    column-count: 1;
}

@media (max-width:767px) {
    .whatsNewNavigation-alphabet {
        display: flex;
        flex-direction: column;
        width: 90%;
        margin: 0 auto;
        padding: 20px;
    }
}
.whatsNewNavigation-letter {
    margin: 0 0 0.5rem 0;
    cursor: pointer;
}

.whatsNewNavigation-letter>a {
    color: #222;
}

.whatsNewNavigation-letter>a:hover {
    color: #06c;
    text-decoration: none;
}

.whatsNewNavigation-letter>.is-selected {
    color: #06c;
}

/* On the "What's New" page, hide the title element */
.newsTitle {
    display: none;
}

.newsBlock {
    position: relative;
    padding: 25px 30px 25px 0;
    transition: background-color .35s ease, box-shadow .35s ease, transform .35s ease, border-radius .35s ease;
}
@media (max-width:767px) {
    .newsBlock {
        scroll-margin-top: 50px;
    }
}

.newsBlock:hover {
    background-color: #f7f7f7;
    text-decoration: none;
    border-radius: 10px;
    box-shadow: 5px 5px 5px 0px rgb(171 171 171 / 75%);
    transform: translate(-20px, 0px);
    top: 0;
    left: 0;
    z-index: 1;
    padding: 25px 15px;
}
@media (max-width:767px) {
    .newsBlock:hover {
        background-color: initial;
        border-radius: initial;
        box-shadow: none;
        transform: none;
        text-decoration: initial;
        z-index: 0;
        padding: 25px 30px 25px 0;
    }
}

.newsText {
    line-height: 160%;
}

.newsStatus {
    display: block;
    width: 8rem;
    color: #fff;
    text-align: center;
    border-radius: 2rem;
    padding: 0.5rem 0;
    margin-bottom: 1rem;
}

.greenStatus {
    background: #6acea0;
}

.blueStatus {
    background: #65a4f4;
}

.yellowStatus {
    background: #fdcc41;
}

.newsSubject {
    display: block;
    font-size: 2.2rem;
    font-weight: bold!important;
    margin: 0 0 8px 0;
}

.newsDigest {
    display: block;
    margin-bottom: 0.5rem;
}

.newsFooter {
    position: absolute;
    top: 3.5rem;
    left: 9rem;
}

.newsBlock:hover .newsFooter{
    left: 10.5rem;
}
@media (max-width:767px) {
    .newsBlock:hover .newsFooter {
        left: 9rem;
    }
}

.newsDate {
    font-size: 1.5rem;
    color: #888;
    font-weight: 300;
}

#newsReminder {
    margin-right: 3rem;
    margin-bottom: 4rem
}
@media (max-width:767px) {
    #newsReminder {
        margin-right: 0;
    }
}