-
Discover Bangalore's Events & Meetups
+
Discover Events & Meetups
+
BANGALORE
Explore the best vibrant events, tech conferences, and exciting happenings in the Silicon Valley of India.
Explore Events
diff --git a/style.css b/style.css
index 92740a9..370e276 100644
--- a/style.css
+++ b/style.css
@@ -31,8 +31,6 @@ body {
max-width: 1200px;
margin: 0 auto;
width: 90%;
- max-width: 1200px;
- margin: 0 auto;
padding: 0 1rem;
}
@@ -278,26 +276,81 @@ body {
/* Hero Section Css */
.hero {
- background-size: cover;
- background-position: center;
+ position: relative;
height: 100vh;
display: flex;
- align-items: center;
justify-content: center;
+ align-items: center;
text-align: center;
- color: #fff;
- position: relative;
- background: linear-gradient(135deg, rgba(74, 144, 226, 0.8), rgba(231, 76, 60, 0.8));
+ background-size: cover;
+ background-position: center;
+ background: linear-gradient(135deg, rgba(95, 158, 231, 0.8), rgba(211, 104, 92, 0.8));
}
.hero-content {
- max-width: min(800px, 90%);
- padding: 2rem;
- background-color: rgba(0, 0, 0, 0.5);
+ max-width: 1000px;
+ width: 90%;
+ padding: 1rem;
border-radius: 10px;
backdrop-filter: blur(10px);
}
+.highlight-text {
+ font-size: clamp(6rem, 12vw, 10rem);
+ font-weight: 800;
+ color: transparent;
+ background-clip: text;
+ -webkit-background-clip: text;
+ background-size: cover;
+ background-repeat: no-repeat;
+ background-position: center;
+ margin: 0 auto;
+ white-space: nowrap;
+ overflow: visible;
+ text-align: center;
+ text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.3);
+ line-height: 1.1;
+ animation: changeBackground 10s infinite;
+ position: relative;
+ z-index: 1;
+ padding: 0;
+ width: 100%;
+ display: block;
+}
+
+@keyframes changeBackground {
+
+ 0%,
+ 16.66% {
+ background-image: url('assets/images/text-backgrounds/image1.png');
+ }
+
+ 16.67%,
+ 33.33% {
+ background-image: url('assets/images/text-backgrounds/image2.png');
+ }
+
+ 33.34%,
+ 49.99% {
+ background-image: url('assets/images/text-backgrounds/image3.png');
+ }
+
+ 50%,
+ 66.66% {
+ background-image: url('assets/images/text-backgrounds/image4.png');
+ }
+
+ 66.67%,
+ 83.33% {
+ background-image: url('assets/images/text-backgrounds/image5.png');
+ }
+
+ 83.34%,
+ 100% {
+ background-image: url('assets/images/text-backgrounds/image6.png');
+ }
+}
+
.hero h1 {
font-size: clamp(2rem, 5vw, 3.5rem);
margin-bottom: 1rem;
@@ -306,25 +359,34 @@ body {
.hero p {
font-size: clamp(1rem, 3vw, 1.2rem);
- max-width: 600px;
- margin: 0 auto 2rem;
+ max-width: 800px;
+ margin: 0 auto;
+ color: #000000;
+ font-weight: 600;
+ text-shadow: none;
+ line-height: 1.3;
+ margin-top: 40px;
+ margin-bottom: 40px;
}
.explore-button {
display: inline-block;
- background-color: var(--secondary-color);
color: #fff;
padding: 1rem 2.5rem;
+ font-weight: 600;
+ color: #fff;
+ background-color: var(--primary-color);
border-radius: 50px;
text-decoration: none;
- font-weight: 600;
transition: all 0.3s ease;
text-transform: uppercase;
letter-spacing: 1px;
+ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+ margin-top: 20px;
}
.explore-button:hover {
- background-color: #e67e22;
+ background-color: #686969;
transform: translateY(-3px);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
@@ -535,7 +597,7 @@ body.dark-mode .footer {
}
.dark-mode .navbar {
- background-color: #2a2a2a !important; /* Dark gray background */
+ background-color: #2a2a2a !important;
transition: background-color 0.3s ease;
}
@@ -619,6 +681,10 @@ body.dark-mode .event-date,
.theme-options.active {
transform: translateX(50%) translateY(0);
}
+
+ .highlight-text {
+ font-size: 11vw;
+ }
}
@media (max-width: 480px) {