diff --git a/index.html b/index.html index 167058b1..3c012947 100644 --- a/index.html +++ b/index.html @@ -423,6 +423,9 @@

What Our Customers Say

Contact Us

+
+ Contact Image +
@@ -440,9 +443,7 @@

Contact Us

-
- Contact Image -
+
diff --git a/style.css b/style.css index 642a1288..0ce86d00 100644 --- a/style.css +++ b/style.css @@ -15,13 +15,16 @@ padding: 10px; margin-bottom: 15px; text-align: center; - width: 90%; border-bottom: 1px solid #ddd; border-radius: 6px; + align-items: center; } .card-body { display: flex; - justify-content: space-between; /* Form on the left and image on the right */ + width: 90%; + margin: 20px auto; + padding: 20px; + justify-content: space-between; /* Form on the right and image on the left */ align-items: flex-start; /* Align content to the top */ } @@ -30,10 +33,11 @@ } .image-section { - width: 50%; /* Width for the image section */ + width: 80%; /* Width for the image section */ display: flex; justify-content: center; /* Center the image */ align-items: center; + height: 70%; } .image-section img { @@ -870,6 +874,48 @@ button:hover img { font-size: 20px; } + input, textarea { + width: 160%; /* Adjust width for better alignment */ + padding: 10px; + border: 1px solid #ccc; + border-radius: 5px; + } + + .card-body { + display: flex; + width: 90%; + margin: 20px auto; + padding: 20px; + justify-content: space-between; /* Form on the right and image on the left */ + align-items: flex-start; /* Align content to the top */ + flex-direction: column; + } + + .image-section { + width: 90%; /* Width for the image section */ + display: flex; + justify-content: center; /* Center the image */ + align-items: center; + margin-bottom: 8px; + } + .form-section { + width: 50%; /* Width for the form section */ + } + + + + .image-section img { + max-width: 120%; /* Make sure image does not exceed its container width */ + height: auto; + align-items: center; + justify-content: center; + } + + .form-group { + margin-bottom: 20px; + } + + .footer-content { flex-direction: column; align-items: center; @@ -887,7 +933,6 @@ button:hover img { .footer-bottom { max-width: fit-content; } - }