vlcsolutions commited on
Commit
8278fe3
·
verified ·
1 Parent(s): c3ed1c1

Do a color combination for text and image in the banner section

Browse files
Files changed (2) hide show
  1. index.html +6 -6
  2. style.css +5 -0
index.html CHANGED
@@ -219,15 +219,15 @@
219
  </div>
220
  </header>
221
  <!-- Banner Section -->
222
- <section class="relative bg-[var(--vlc-navy)]">
223
  <img src="https://huggingface.co/spaces/vlcsolutions/vlc-tech-turboboost-implementation-wizardry/resolve/main/images/Implementation%20Services-Main%20banner-2025.png"
224
  alt="Implementation Services"
225
- class="w-full h-auto object-cover">
226
- <div class="absolute inset-0 flex items-center justify-center">
227
  <div class="max-w-7xl mx-auto text-center px-4" data-aos="fade-up">
228
- <h1 class="text-4xl md:text-5xl font-bold mb-6 text-white">AI-Driven Implementation That Moves Business Forward</h1>
229
- <p class="text-xl md:text-2xl mb-8 text-white">Deploy Smarter Tech. Drive AI Power.</p>
230
- <a href="https://www.vlcsolutions.com/contactus.html" class="btn-accent px-8 py-3 rounded-full text-lg font-semibold inline-block">Start Your Impactful Implementation Today</a>
231
  </div>
232
  </div>
233
  </section>
 
219
  </div>
220
  </header>
221
  <!-- Banner Section -->
222
+ <section class="relative bg-gradient-to-r from-[var(--vlc-navy)] to-[#00308F]">
223
  <img src="https://huggingface.co/spaces/vlcsolutions/vlc-tech-turboboost-implementation-wizardry/resolve/main/images/Implementation%20Services-Main%20banner-2025.png"
224
  alt="Implementation Services"
225
+ class="w-full h-auto object-cover opacity-90 mix-blend-overlay">
226
+ <div class="absolute inset-0 flex items-center justify-center">
227
  <div class="max-w-7xl mx-auto text-center px-4" data-aos="fade-up">
228
+ <h1 class="text-4xl md:text-5xl font-bold mb-6 text-white drop-shadow-lg">AI-Driven Implementation That Moves Business Forward</h1>
229
+ <p class="text-xl md:text-2xl mb-8 text-white/90 font-medium">Deploy Smarter Tech. Drive AI Power.</p>
230
+ <a href="https://www.vlcsolutions.com/contactus.html" class="btn-accent px-8 py-3 rounded-full text-lg font-semibold inline-block hover:shadow-lg hover:shadow-[var(--vlc-leaf)/30%] transition-all duration-300">Start Your Impactful Implementation Today</a>
231
  </div>
232
  </div>
233
  </section>
style.css CHANGED
@@ -1,8 +1,13 @@
 
1
  body {
2
  padding: 2rem;
3
  font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
4
  }
5
 
 
 
 
 
6
  h1 {
7
  font-size: 16px;
8
  margin-top: 0;
 
1
+
2
  body {
3
  padding: 2rem;
4
  font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
5
  }
6
 
7
+ /* Banner text shadow for better contrast */
8
+ .text-shadow {
9
+ text-shadow: 0 2px 4px rgba(0,0,0,0.3);
10
+ }
11
  h1 {
12
  font-size: 16px;
13
  margin-top: 0;