diff --git a/index.html b/index.html
index 71a1524..8766344 100644
--- a/index.html
+++ b/index.html
@@ -387,8 +387,7 @@
Wireless Gaming Headset
-
-
Secretlab Omega
+
Secretlab Omega
Ergonomic Gaming Chair
(Adjustable)
@@ -458,7 +457,8 @@
Frequently Asked Questions
-
+ data-aos="fade-right">
+
diff --git a/style.css b/style.css
index e7a1df4..8858b16 100644
--- a/style.css
+++ b/style.css
@@ -1662,10 +1662,14 @@ button {
}
#faq {
+ display: flex;
+ justify-content: center;
+ align-items: center;
padding-top: 100px;
}
.faq-container {
+
max-width: 800px;
margin: 40px auto;
padding: 20px;
@@ -1673,13 +1677,27 @@ button {
border: 1px solid #ddd;
border-radius: 10px;
box-shadow: 2 10px 8px rgba(255, 254, 254, 0.1);
+ background: linear-gradient(to right, #d72e7b, #f2994a);
}
.faq-title {
text-align: center;
+
+
font-size: 1.8em;
- color: #ffffff;
+ color: #000;
margin-bottom: 20px;
+ font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
+
+
+
+ /* Text shadow */
+ text-shadow: 5px 5px 9px #fcfbfb;
+
+ /* Add padding and display properties */
+ display: inline-block;
+ padding: 10px 20px;
+ border-radius: 5px;
}
.faq {
@@ -1693,7 +1711,7 @@ button {
.faq-question {
padding: 15px;
font-size: 1.2em;
- background-color: #f6763f;
+ background-color: #2e1104;
color: #fff;
border: none;
border-radius: 5px;
@@ -1706,7 +1724,7 @@ button {
}
.faq-question:hover {
- background-color: #ff6b6b;
+ background-color: #450e0e;
}
.faq-answer {
@@ -1740,6 +1758,28 @@ button {
transform: rotate(225deg);
}
+
+/* hover effect */
+.faq:hover {
+ box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.2); /* Adds a shadow effect */
+ transform: scale(1.02); /* Slightly increases the size */
+ transition: all 0.3s ease; /* Smooth transition */
+}
+
+.faq-question:hover {
+ background-color: #450e0e; /* Change background color */
+ color: #fff; /* Keeps the text color consistent */
+}
+
+.faq-answer:hover {
+ background-color: #ffd1a1; /* Slightly darker background on hover */
+ border-left-color: #ff6b6b; /* Changes border color */
+}
+
+
+
+
+
/* Body styles for consistency */
#review-body {
text-align: center;