.at-articlePickerWithBackground {
    padding: 3em 0;
}

.at-articlePickerWithBackground__wrapper {
    width: 90%;
    margin: 0 auto;
}

.at-articlePickerWithBackground--white {
    background: #fff;
}

.at-articlePickerWithBackground--gray {
    background: #eee;
}

.at-articlePickerWithBackground--green {
    background: rgba(98, 236, 188, .4);
}

.at-articlePickerWithBackground--gray.at-articlePickerWithBackground--ribbon {
    background: linear-gradient(#fff 0%, #fff 20%, #eee 20%, #eee 70%, #fff 70%, #fff 100%);
}

.at-articlePickerWithBackground--green.at-articlePickerWithBackground--ribbon {
    background: linear-gradient(#fff 0%, #fff 20%, rgba(98, 236, 188, .4) 20%, rgba(98, 236, 188, .4) 70%, #fff 70%, #fff 100%);
}

@media (width: 768px) {
    .at-articlePickerWithBackground__wrapper {
        width: auto;
    }
}