.agileViewContainer { display: flex; gap: 12px; flex-direction: column; } .sprintDisplayContainer { border: 4px solid var(--paper); box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.2); border-radius: 2px; padding: 25px; margin: auto; width: 100%; background-color: var(--paper); } @media only screen and (max-width: 1025px) { .sprintDisplayContainer { padding: 2px; } } .sprintSummary { display: flex; width: 100%; } .sprintDisplayContainer.current { border-color: #042901; background-color: var(--paper); } .sprintDisplayContainer.planned { border-color: #2a2000; background-color: var(--paper); } .sprintDisplayContainer.completed { border-color: #2a2000; background-color: var(--paper); } details .sprintSummary::before { content: "+"; font-weight: bolder; font-size: 1.5rem; padding-right: 8px; } details[open] .sprintSummary::before { content: "-"; } .sprintTitle { width: 400px; font-size: 1.6rem; font-weight: 800; } .sprintDates { width: 160px; text-align: right; }