.likes-ratings-container {
    margin: 1rem 0;
    white-space: nowrap;
    display: flex;
    color: #fff;
}
.likes-ratings-container .likes-rating {
    display: flex;
    align-items: center;
    padding: 0.5rem 1rem;
    transition: all .15s ease;
    cursor: pointer;
}

[data-likes-readonly] .likes-rating {
    cursor: default;
    pointer-events: none;
}

.likes-ratings-container:not([data-likes-readonly]) .like:active {
    transform: scale(1.25);
}

.likes-ratings-container .likes-rating span {
    display: inline-flex;
    padding-left: 5px;
}

.likes-ratings-container .likes-rating svg {
    width: 20px;
    vertical-align: middle;
    opacity: 0.5;
}

.likes-ratings-container .like-up {
    background-color: #26AE60;
    border-radius: 3px 0 0 3px;
}

.likes-ratings-container .like-down {
    background-color: #C03A2B;
    margin-left: 1px;
    border-radius: 0 3px 3px 0;
}

[data-likes-error] {
    color: #C03A2B;
    font-size: 90%;
    padding-top: 5px;
}