.counter { display:block; } .countdown-container { align-content: center; justify-content: center; align-items: center; color: white; margin: 0.5rem; } .countdown-container > form { padding: 0.5rem; color: white; } .countdown-container > form > label { margin-right: 1rem; color: white; } .expired-notice { text-align: center; padding: 0.5rem; border: 1px solid #ebebeb; border-radius: 0.50rem; margin: 20px; margin-left: 500px; margin-right: 500px; background-color: #EAEFEB; color: black; } .expired-notice > span { font-size: 1.1rem; font-weight: 500; color: darkgreen; } .expired-notice > p { font-size: 1.1rem; } .show-counter { padding: 0.5rem; } .show-counter .countdown-link { margin-left: auto; margin-right: auto; display: flex; flex-direction: row; float: center !important; justify-content: center; align-items: center; font-weight: 600; font-size: 1.1rem; color: rgb(255, 255, 255) !important; line-height: 1.75rem; padding: 0.4rem; border: 1px solid #ebebeb; border-radius: 0.75rem; text-decoration: none; width: 22rem; background-color: #000000; } .show-counter .countdown { line-height: 1.5rem; padding: 0 0.75rem 0 0.75rem; align-items: center; display: flex; flex-direction: column; } .show-counter .countdown.danger { color: white; } .show-counter .countdown > p { margin: 0; } .show-counter .countdown > span { text-transform: none; color:white; font-size: 1.1rem; line-height: 2rem; } @media only screen and (max-width: 500px) { .show-counter .countdown > span { font-size: 1.1rem; line-height: 1rem; } .show-counter .countdown-link { font-size: 1.1rem; } }