From f07b052617ae863b07231e9f99c3a49791cba747 Mon Sep 17 00:00:00 2001
From: eren-brcn <sylar144814@gmail.com>
Date: Mon, 9 Mar 2026 14:11:43 +0300
Subject: [PATCH] solved lab

---
 starter_code/stylesheets/style.css | 87 ++++++++++++++++++++++++++++++
 1 file changed, 87 insertions(+)

diff --git a/starter_code/stylesheets/style.css b/starter_code/stylesheets/style.css
index 59f4a7798..f42ee1778 100644
--- a/starter_code/stylesheets/style.css
+++ b/starter_code/stylesheets/style.css
@@ -8,3 +8,90 @@ paragraph yellow: #ECB12F
 links blue: #2E71A6
 footer links grey: #454245
 */
+:root {
+  --purple-bg: #540B51;    
+  --ivory-bg: #F3EAE2;     
+  --button-blue: #4285F4;  
+  --title-black: #191817;  
+  --para-black: #000000;   
+  --para-yellow: #ECB12F;  
+  --link-blue: #2E71A6;    
+  --footer-grey: #454245;  
+}
+
+body {
+  font-family: sans-serif;
+  margin: 0;
+  color: var(--para-black);
+  background-color: var(--ivory-bg);
+}
+
+h1, h2, h3 { color: var(--title-black); }
+a { color: var(--link-blue); text-decoration: none; }
+
+.btn-primary {
+  background-color: var(--button-blue);
+  color: white;
+  border: none;
+  padding: 10px 20px;
+  border-radius: 4px;
+}
+
+header, .logos, .teams, footer {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 20px;
+}
+
+.logo-row, .footer-links {
+  display: flex;
+  flex-direction: column;
+  gap: 15px;
+}
+
+@media (min-width: 768px) and (max-width: 1024px) {
+  /* Header 2 columns: content and image */
+  header {
+    flex-direction: row;
+    justify-content: space-between;
+    text-align: left;
+  }
+
+  header div, header img { flex: 1; }
+
+  /* Logos and Footer display in single rows */
+  .logo-row, .footer-links, .teams-list {
+    flex-direction: row;
+    justify-content: center;
+    gap: 30px;
+  }
+}
+
+
+@media (min-width: 1024px) and (max-width: 1440px) {
+  .menu-icon { display: none; }
+  .nav-menu { display: flex; gap: 20px; }
+
+  /* Digital HQ buttons horizontal */
+  .hq-buttons {
+    display: flex;
+    flex-direction: row;
+    gap: 10px;
+  }
+}
+
+
+  
+@media (min-width: 1440px) {
+  .header-btns {
+    display: flex;
+    flex-direction: row;
+    gap: 15px;
+  }
+
+  header img {
+    display: block;
+    margin: 0 auto;
+  }
+}
\ No newline at end of file