/* mainpage.css */ body { font-family: Arial, sans-serif; background-color: #f8f8f8; margin: 0; padding: 0; display: flex; justify-content: center; align-items: center; height: 100vh; } .custom-container { text-align: center; background-color: #ffffff; padding: 20px; border-radius: 10px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } .custom-header h1 { font-size: 2em; color: #2c3e50; } .custom-header h2 { font-size: 1.5em; color: #34495e; } .custom-header p { color: #7f8c8d; margin-bottom: 20px; } .custom-read-button { background-color: #3498db; color: #ffffff; border: none; padding: 10px 20px; font-size: 1em; border-radius: 5px; cursor: pointer; } .custom-read-button:hover { background-color: #2980b9; } .custom-content { display: flex; justify-content: space-around; margin-top: 20px; } .custom-card { background-color: #ecf0f1; border-radius: 10px; padding: 20px; width: 30%; text-align: center; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } .custom-card img { width: 50px; height: 50px; margin-bottom: 10px; } .custom-card h3 { font-size: 1.2em; color: #2c3e50; } .custom-card p { color: #7f8c8d; } .custom-footer img { margin-top: 20px; width: 100px; height: auto; }