I reduced the font size, made the assignment buttons smaller, and moved the location of the assignment buttons from the center of the page toward the bottom so it wouldn't interfere with the bus images to the left.
Using the singular file - just to show the changes in the two announcement buttons, but on the actual signage it will be different, here is the difference between before and after the edits:
Proposed changes
Changed:
.bus-announcement-container { position: absolute; top: 55%; right: 6%; width: 50%; padding: 20px !important; font-size: 30px;To:.bus-announcement-container { position: absolute; top: 85%; right: 3%; width: 25%; padding: 20px !important; font-size: 20px;Changed:
#morning .bus-announcement-container { top: 50%; right: 3%; width: 27%; }To:
#morning .bus-announcement-container { top: 80%; right: 3%; width: 25%; }Brief description of rationale
I reduced the font size, made the assignment buttons smaller, and moved the location of the assignment buttons from the center of the page toward the bottom so it wouldn't interfere with the bus images to the left.
Using the singular file - just to show the changes in the two announcement buttons, but on the actual signage it will be different, here is the difference between before and after the edits:
Before:
After: