| /* Large CSS file for testing */ |
| |
| body { |
| font-family: Arial, sans-serif; |
| line-height: 1.6; |
| color: #333; |
| } |
| |
| .container { |
| width: 90%; |
| margin: 0 auto; |
| padding: 20px; |
| } |
| |
| .header { |
| background: #f4f4f4; |
| padding: 1rem; |
| border-bottom: 1px solid #ddd; |
| } |
| |
| .header h1 { |
| margin: 0; |
| } |
| |
| .nav { |
| background: #333; |
| color: #fff; |
| padding: 0.5rem; |
| } |
| |
| .nav ul { |
| padding: 0; |
| list-style: none; |
| } |
| |
| .nav ul li { |
| display: inline; |
| margin-right: 20px; |
| } |
| |
| .nav a { |
| color: #fff; |
| text-decoration: none; |
| } |
| |
| .main { |
| padding: 1rem 0; |
| } |
| |
| .footer { |
| background: #333; |
| color: #fff; |
| text-align: center; |
| padding: 1rem; |
| margin-top: 20px; |
| } |
| |
| .btn { |
| display: inline-block; |
| background: #5cb85c; |
| color: #fff; |
| padding: 10px 20px; |
| border: none; |
| cursor: pointer; |
| } |
| |
| .btn:hover { |
| background: #4cae4c; |
| } |
| |
| .grid { |
| display: grid; |
| grid-template-columns: repeat(4, 1fr); |
| gap: 1rem; |
| } |
| |
| .card { |
| border: 1px solid #ccc; |
| padding: 1rem; |
| box-shadow: 2px 2px 5px rgba(0,0,0,0.1); |
| } |
| |
| .table { |
| width: 100%; |
| border-collapse: collapse; |
| } |
| |
| .table th, .table td { |
| border: 1px solid #ddd; |
| padding: 8px; |
| } |
| |
| .table th { |
| background-color: #f2f2f2; |
| } |
| |
| .form-group { |
| margin-bottom: 15px; |
| } |
| |
| .form-group label { |
| display: block; |
| margin-bottom: 5px; |
| } |
| |
| .form-group input { |
| width: 100%; |
| padding: 8px; |
| border: 1px solid #ccc; |
| } |
| |
| .alert { |
| padding: 15px; |
| margin-bottom: 20px; |
| border: 1px solid transparent; |
| border-radius: 4px; |
| } |
| |
| .alert-success { |
| color: #3c763d; |
| background-color: #dff0d8; |
| border-color: #d6e9c6; |
| } |
| |
| .alert-danger { |
| color: #a94442; |
| background-color: #f2dede; |
| border-color: #ebccd1; |
| } |