Contact Us
body {
font-family: Roboto, sans-serif;
background-color: #f5f5f5;
margin: 0;
padding: 0;
}
.contact-section {
text-align: center;
padding: 10px;
background-color: grey
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
max-width: 600px;
margin: 50px auto;
}
.contact-section p {
font-size: 18px;
margin: 10px 0;
}
.contact-section a {
text-decoration: none;
color: #f44336;
font-weight: bold;
}
.contact-section a:hover {
color: #d32f2f;
}
/* Animation for Icons */
.contact-section .fab {
font-size: 50px;
color: #f44;
transition: transform 0.3s ease, color 0.3s ease, opacity 0.5s ease;
}
.contact-section .fab:hover {
transform: scale(1.2); /* Scale animation */
color: #d32f2f;
opacity: 0.8; /* Add opacity effect */
}
/* Animation on Hover for Social Media Links */
.contact-section .social-icons a {
transition: transform 0.3s ease, color 0.3s ease;
}
.contact-section .social-icons a:hover {
transform: translateY(-5px); /* Move upwards slightly on hover */
color: ; /* Change color on hover */
}
/* Contact Icons Section */
.contact-section .contact-icons {
display: flex;
justify-content: center;
margin: 20px 0;
}
.contact-section .contact-icons a {
margin: 0 15px;
}
/* Social Icons Section */
.contact-section .social-icons {
display: flex;
justify-content: center;
margin-top: 20px;
}
.contact-section .social-icons a {
margin: 0 10px;
font-size: 40px; /* Adjust size for social media icons */
}
