/* Reset some default styles */ body, h1, h2, h3, p, ul, ol { margin: 0; padding: 0; } /* Set a background color for the entire admin area */ body { background-color: #f4f4f4; font-family: Arial, sans-serif; } /* Style the header */ #header { background-color: #333; color: #fff; padding: 20px; text-align: center; } /* Style the navigation menu */ #nav { background-color: #444; color: #fff; padding: 10px; } #nav ul { list-style: none; padding: 0; } #nav li { margin-bottom: 10px; } #nav a { text-decoration: none; color: #fff; font-weight: bold; } /* Style the main content area */ #content { padding: 20px; background-color: #fff; box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); } /* Style buttons */ .button { background-color: #3498db; color: #fff; padding: 10px 20px; border: none; cursor: pointer; } .button:hover { background-color: #2980b9; } /* Style tables */ table { width: 100%; border-collapse: collapse; margin-bottom: 20px; } table, th, td { border: 1px solid #ddd; } th, td { padding: 10px; text-align: left; } /* Add some responsive styles */ @media (max-width: 768px) { #nav { padding: 5px; } #content { padding: 10px; } } /* Style form elements */ input[type="text"], input[type="password"], select, textarea { width: 100%; padding: 10px; margin-bottom: 10px; border: 1px solid #ddd; border-radius: 4px; box-sizing: border-box; } /* Style form buttons */ .form-button { background-color: #27ae60; color: #fff; padding: 10px 20px; border: none; cursor: pointer; } .form-button:hover { background-color: #219049; }