/* Base styles */ body { background-color: orange; color: darkgray; margin: 0; padding: 0; font-family: Arial, sans-serif; } h1, h2, h3, h4, h5, h6, p { color: black; } ol { color: black; } .container { background-color: white; border: 3px solid black; border-radius: 10px; padding: 20px; margin: 10px; box-sizing: border-box; } /* Styles for tablets (screen width 1025px and higher) */ @media (min-width: 1025px){ .container { margin: 20px auto; max-width: 50%; } } /* Styles for tablets (screen width 768px to 1024px) */ @media (min-width: 768px) and (max-width: 1024px) { .container { margin: 20px auto; max-width: 80%; } } /* Styles for mobile devices (screen width up to 767px) */ @media (max-width: 767px) { .container { margin: 10px; width: 90%; } }