/* xmas_theme.css */ body { background-color: #d32f2f; /* Festive red background */ color: #ffffff; /* White text for contrast */ font-family: 'Arial', sans-serif; background-image: url('/static/images/snowflake-pattern.png'); /* Optional: subtle snowflake background */ background-size: cover; background-attachment: fixed; } h1, h2, h3, p { color: #ffeb3b; /* Cheerful yellow for headings */ } a { color: #4caf50; /* Xmas green for links */ text-decoration: none; } a:hover { color: #ffffff; /* White for hover effect */ text-decoration: underline; } button { background-color: #4caf50; /* Xmas green button background */ color: #ffffff; /* White text */ border: none; padding: 10px 20px; border-radius: 5px; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); transition: background-color 0.3s ease; } button:hover { background-color: #388e3c; /* Darker green on hover */ cursor: pointer; } .navbar { background-color: #b71c1c; /* Deep red navbar */ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); } .navbar a { color: #ffeb3b; /* Yellow links */ font-weight: bold; } .navbar a:hover { color: #ffffff; /* White hover effect */ } .container { max-width: 1200px; margin: 0 auto; padding: 20px; } .card { background-color: #4caf50; /* Xmas green for cards */ border-radius: 8px; padding: 20px; margin-bottom: 20px; color: #ffffff; /* White text on cards */ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); } .card-header { font-size: 1.5rem; color: #ffffff; /* White headers inside cards */ font-weight: bold; border-bottom: 2px solid #ffeb3b; /* Yellow underline for card headers */ padding-bottom: 10px; margin-bottom: 15px; } input[type="text"], textarea { width: 100%; padding: 10px; border: 1px solid #ffeb3b; /* Yellow borders */ border-radius: 5px; background-color: #b71c1c; /* Deep red input background */ color: #ffffff; /* White text for contrast */ margin-bottom: 15px; } input[type="submit"], input[type="button"] { background-color: #4caf50; /* Green buttons */ color: white; border: none; padding: 10px 20px; border-radius: 5px; cursor: pointer; font-size: 1rem; transition: background-color 0.3s ease; } input[type="submit"]:hover, input[type="button"]:hover { background-color: #388e3c; /* Darker green on hover */ } footer { background-color: #263238; /* Neutral dark gray for footer */ color: #ffffff; text-align: center; padding: 20px; border-top: 2px solid #ffeb3b; /* Festive yellow border */ } footer a { color: #4caf50; /* Green links */ } footer a:hover { color: #ffeb3b; /* Yellow hover effect */ } /* Additional Xmas touches */ .snowflake { font-size: 2rem; color: #ffffff; animation: fall 10s linear infinite; position: absolute; } @keyframes fall { 0% { top: -10%; transform: translateX(0); } 100% { top: 100%; transform: translateX(20px); } }