From 5b03261ec36b4ee01503823e1089a46f057a43f4 Mon Sep 17 00:00:00 2001 From: Kerem Semiz Date: Wed, 14 Aug 2024 11:47:37 +0300 Subject: [PATCH] Worked more on CSS --- contact.css | 151 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 151 insertions(+) diff --git a/contact.css b/contact.css index 9eb1ba3..a71805a 100644 --- a/contact.css +++ b/contact.css @@ -94,4 +94,155 @@ body { justify-content: space-between; flex-wrap: wrap; gap: 2rem; +} + +.contact-text { + flex: 1; + padding: 2rem; +} + +.contact-text h2 { + font-size: 2.5rem; + margin-bottom: 1rem; + color: white; +} + +.contact-text p { + font-size: 1.2rem; + color: var(--grey4); +} + +.contact-form { + flex: 1; + padding: 2rem; +} + +.contact-form label { + display: block; + margin-bottom: 0.5rem; + font-size: 1.1rem; + color: white; +} + +.contact-form input, .contact-form textarea { + width: 100%; + padding: 0.8rem; + margin-bottom: 1rem; + border-radius: 0.3rem; + border: 1px solid var(--grey2); + background-color: var(--bg); + color: white; + font-size: 1rem; +} + +.contact-form button.submit-button { + padding: 0.8rem 1.5rem; + border: none; + background-color: var(--blue1); + color: white; + font-size: 1rem; + border-radius: 0.3rem; + cursor: pointer; + transition: var(--transition); +} + +.contact-form button.submit-button:hover { + background-color: var(--blue2); +} + +.footer { + margin-left: 10rem; + margin-right: 10rem; + font-family: 'Archivo', sans-serif; + background-color: #1A1A1A; + color: #fff; + background-color: black; + padding: 2rem; + color: #fff; +} + +.footer-container { + display: flex; + justify-content: space-between; + align-items: start; + flex-wrap: wrap; +} + +.footer-branding { + max-width: 30%; +} + +.footer-branding h1 { + font-size: 2rem; +} + +.footer-branding p { + font-size: 1.2rem; + margin: 1rem 0; +} + +.get-started-button { + background-color: #57161F; + color: #fff; + border: none; + padding: 0.8rem 1.5rem; + font-size: 1rem; + cursor: pointer; + border-radius: 0.3rem; +} + +.footer-links { + display: flex; + flex-wrap: wrap; + gap: 2rem; +} + +.footer-column { + display: flex; + flex-direction: column; +} + +.footer-column h2 { + font-size: 1.2rem; + margin-bottom: 1rem; +} + +.footer-column a { + color: #fff; + text-decoration: none; + margin-bottom: 0.5rem; + font-size: 1rem; +} + +.footer-column a{ + text-decoration: underline; +} + +.footer-bottom { + display: flex; + justify-content: space-between; + align-items: center; + flex-wrap: wrap; + margin-top: 2rem; + border-top: 1px solid #444; + padding-top: 1rem; +} + +.footer-bottom p { + margin: 0; +} + +.footer-bottom-links { + display: flex; + gap: 1rem; +} + +.footer-bottom-links a { + color: #fff; + text-decoration: none; + font-size: 0.9rem; +} + +.footer-bottom-links a { + text-decoration: underline; } \ No newline at end of file