From 57ab13dc8d42e6335cd8f64139ca02539c1ed7f3 Mon Sep 17 00:00:00 2001 From: Mariia Kovalenko Date: Wed, 26 Nov 2025 15:04:54 +0100 Subject: [PATCH] =?UTF-8?q?=D0=9E=D0=BD=D0=BE=D0=B2=D0=B8=D1=82=D0=B8=20st?= =?UTF-8?q?yles.css?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- styles.css | 144 +++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 144 insertions(+) diff --git a/styles.css b/styles.css index e69de29..79a8118 100644 --- a/styles.css +++ b/styles.css @@ -0,0 +1,144 @@ +body { + font-family: Arial, sans-serif; + margin: 0; + padding: 0; + + min-height: 100vh; + display: flex; + flex-direction: column; +} + + + +#upNavigations { + background-color: #4a5d23; + padding: 20px 40px; + color: white; + font-size: 25px; + height: 60px; + display: flex; + align-items: center; +} + +#upNavigations nav ul { + display: flex; + align-items: center; + gap: 25px; + padding: 0; + margin: 0; +} + +li { + list-style: none; +} + +#upNavigations nav a { + color: white; + text-decoration: none; + font-size: 18px; + padding: 5px 0; +} + +#upNavigations nav a:hover { + text-decoration: underline; +} + +button.patenshop { + background-color: #82b74b; + color: #333; + padding: 10px 25px; + border: none; + border-radius: 40px; + font-size: 18px; + cursor: pointer; + transition: 0.3s; +} + +button.patenshop:hover { + background-color: #c1946a; + color: white; + transform: scale(0.95); +} + + + + + +main { + flex: 1; + padding: 40px; + max-width: 900px; + margin: auto; + text-align: center; +} + +main h1 { + font-size: 42px; + margin-bottom: 20px; + color: #4a5d23; +} + +#monat { + font-weight: bold; + color: #4a5d23; + font-size: 22px; +} + +#nextMonthBtn { + margin-top: 20px; + padding: 14px 25px; + font-size: 18px; + background: #82b74b; + color: white; + border: none; + border-radius: 12px; + cursor: pointer; + transition: 0.3s; + box-shadow: 0 4px 8px rgba(0,0,0,0.2); +} + +#nextMonthBtn:hover { + background: #6fa53a; + transform: translateY(-2px); +} + +#hasenContainer { + margin-top: 40px; + display: flex; + flex-wrap: wrap; + justify-content: center; + gap: 15px; +} + +.hase { + width: 70px; + height: 70px; + filter: drop-shadow(0 3px 4px rgba(0,0,0,0.3)); + animation: popIn 0.3s ease-in-out; +} + +@keyframes popIn { + 0% { transform: scale(0.4); opacity: 0; } + 100% { transform: scale(1); opacity: 1; } +} + + + + +footer { + background-color: #333; + color: white; + text-align: center; + padding: 20px 0; + margin-top: auto; +} + +footer a { + color: #8bc34a; + text-decoration: none; + margin: 20px; +} + +footer a:hover { + text-decoration: underline; +}