53 lines
		
	
	
		
			2.0 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			53 lines
		
	
	
		
			2.0 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
<!-- Hero Section -->
 | 
						|
<div class="relative bg-black">
 | 
						|
  <div class="mx-auto max-w-7xl grid grid-cols-1 lg:grid-cols-2 gap-8 lg:gap-16 items-start pt-24 py-12">
 | 
						|
    <!-- Left Column (Image Section) -->
 | 
						|
    <div class="relative overflow-hidden bg-indigo-600 lg:h-full">
 | 
						|
      <div class="image-container">
 | 
						|
        <img class="object-cover w-full h-full" src="/images/ow5.png" alt="Image description">
 | 
						|
      </div>
 | 
						|
    </div>
 | 
						|
    
 | 
						|
    <!-- Right Column (Text Section) -->
 | 
						|
    <div class="relative sm:py-24 lg:pt-24 lg:py-12 lg:px-8 px-4">
 | 
						|
      <div class="max-w-xl mx-auto">
 | 
						|
        <h2 class="text-base font-semibold leading-7 text-indigo-400">INVEST</h2>
 | 
						|
        <p class="mt-2 text-3xl font-bold tracking-tight text-white sm:text-4xl">OurPass</p>
 | 
						|
        <p class="mt-2 text-lg leading-7 text-gray-300">A Unique Approach to Global Citizenship</p>
 | 
						|
        <div class="mt-4 text-base leading-7 text-gray-300">
 | 
						|
          <p>OurWorld presents an innovative approach to obtaining global citizenship through strategic investment. <b>OurPass: The Venture Creator Passport Program</b> offers a unique pathway for global investors to obtain residency and, eventually, citizenship in multiple countries.</p>
 | 
						|
        </div>
 | 
						|
        <div class="mt-8">
 | 
						|
          <a href="#" class="inline-flex rounded-md bg-white/10 px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-white/20 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-white">Learn More</a>
 | 
						|
        </div>
 | 
						|
      </div>
 | 
						|
    </div>
 | 
						|
  </div>
 | 
						|
</div>
 | 
						|
 | 
						|
<style>
 | 
						|
  .image-container {
 | 
						|
    position: relative;
 | 
						|
    width: 100%;
 | 
						|
    height: 100%;
 | 
						|
  }
 | 
						|
 | 
						|
  .image-container::after {
 | 
						|
    content: "";
 | 
						|
    position: absolute;
 | 
						|
    top: 0;
 | 
						|
    left: 0;
 | 
						|
    width: 100%;
 | 
						|
    height: 100%;
 | 
						|
    background-color: #6366F1; /* Indigo-600 color */
 | 
						|
    mix-blend-mode: overlay;
 | 
						|
    opacity: 0.5; /* Adjust opacity as needed */
 | 
						|
  }
 | 
						|
 | 
						|
  /* Reset margin and padding for the entire page if needed */
 | 
						|
  body, html {
 | 
						|
    margin: 0;
 | 
						|
    padding: 0;
 | 
						|
  }
 | 
						|
</style>
 |