* { margin: 0; padding: 0; box-sizing: border-box; } /* html, body { height: 100%; }*/ body { font-family: Arial, sans-serif; background-color: #073b4c; display: flex; /*flex-direction: column;*/ } h1 { text-align: center; padding: 20px 0; color: #ffd166; } .content { flex: 1; padding: 20px; } .sidebar { width: 230px; background-color: #022532; /*2c3e50*/ height: 100vh; color: white; display: flex; flex-direction: column; padding: 20px; letter-spacing: 2px; } .sidebar a { padding: 20px; color: white; text-decoration: none; /*margin-bottom: 20px;*/ display: block; font-size: 18px; } .sidebar a:hover { text-decoration: underline; } .footer { position: fixed; left: 0; bottom: 0; width: 100%; background-color: #022532; color: white; text-align: center; padding: 8px 0; } table { margin-left: 25%; width: 50%; border-collapse: collapse; } th, td { border: 1px solid #ccc; padding: 10px; text-align: left; color: white; font-weight: bold; font-size: 16px; letter-spacing: 1px; } th { background-color: #f4f4f4; color: black; } #excel, #pdf { float: right; margin-left: 10px; margin-right: 10px; color: white; font-size: 16px; background-color: green; border: none; border-radius: 4px; padding: 5px; } #pdf { background-color: red; } select { padding: 5px; } option { font-size: 16px; }