diff --git a/background.png b/background.png new file mode 100644 index 0000000..edd03a3 Binary files /dev/null and b/background.png differ diff --git a/foreground.png b/foreground.png new file mode 100644 index 0000000..6e8bdf7 Binary files /dev/null and b/foreground.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..daae0a9 --- /dev/null +++ b/index.html @@ -0,0 +1,45 @@ + + + + + + Parallax Website + + + +
+
+ Background + foreground +

ADVENTURE

+
+
+

Adventure Time

+

+ Adventure time embodies the spirit of exploration and excitement, beckoning individuals to break free from routine and embrace the unknown. It's a canvas where enthusiasts paint their stories with daring escapades, whether scaling lofty peaks, navigating untamed waters, or embarking on spontaneous road trips. The clock ticks differently in the realm of adventure, where uncertainty becomes a thrilling companion. Each moment becomes a chapter in a personal narrative, fostering resilience, courage, and an enduring appreciation for life's unexpected twists. Adventure time is not merely a break from the ordinary; it's a transformative journey that rekindles the flame of curiosity and fuels the soul with the unmatched vitality of the untamed outdoors. +

+ +
+

BIKING

+
+

+ Biking, a dynamic adventure on two wheels, propels enthusiasts into a world of speed, skill, and exploration. Whether navigating rugged mountain trails or cruising along scenic roads, the rhythmic pedal strokes create a symphony of motion. The wind becomes a companion as bikers embrace the thrill of the ride, conquering challenging terrains with each turn of the crank. Beyond the physical exertion, biking is a journey of discovery—unveiling hidden landscapes and pushing personal limits. From the adrenaline rush of downhill descents to the quiet satisfaction of conquering uphill climbs, biking is a versatile and invigorating pursuit that fosters a deep connection between rider and the ever-changing outdoor terrain. +

+ +
+

PARA GLIDING

+
+

+ Paragliding, a breathtaking aerial pursuit, unlocks the boundless skies for thrill-seekers. Suspended beneath a colorful wing, adventurers soar with the wind, defying gravity's constraints. The sensation of flight is both liberating and exhilarating as paragliders navigate currents, gaining a bird's-eye view of landscapes below. Harnessing wind currents and thermals, they weave gracefully through the air, experiencing a profound sense of freedom. Paragliding is more than a sport; it's a fusion of adrenaline, tranquility, and a unique communion with the sky. Whether soaring over majestic mountains or coastal cliffs, every glide is an extraordinary journey, connecting enthusiasts to the vast, open expanses that beckon from above. +

+ +
+

SURFING

+
+

+ Surfing is more than a sport; it's a captivating dance with the ocean's rhythmic energy. As surfers paddle into the vast expanse, they become one with the rolling waves, skillfully riding the tide on a sleek board. The adrenaline surges as they carve through the water, finding a delicate balance between power and finesse. The sea becomes a dynamic playground, offering an ever-changing canvas for surfers to showcase their prowess. Beyond the physical demands, surfing instills a deep connection to nature—a communion of wind, water, and surfer. Each wave tells a unique story, making every ride a thrilling and immersive journey into the heart of the ocean's timeless allure. +

+
+
+ + diff --git a/sport-1.jpg b/sport-1.jpg new file mode 100644 index 0000000..773012d Binary files /dev/null and b/sport-1.jpg differ diff --git a/sport-2.jpg b/sport-2.jpg new file mode 100644 index 0000000..42f52cb Binary files /dev/null and b/sport-2.jpg differ diff --git a/sport-3.jpg b/sport-3.jpg new file mode 100644 index 0000000..8083923 Binary files /dev/null and b/sport-3.jpg differ diff --git a/style.css b/style.css new file mode 100644 index 0000000..d6bb176 --- /dev/null +++ b/style.css @@ -0,0 +1,96 @@ +* { + margin: 0; + padding: 0; + box-sizing: border-box; + font-family: cursive; +} +#wrapper { + height: 100vh; + overflow: auto; + overflow-x: hidden; + perspective: 10px; +} +.container { + position: relative; + height: 100%; + display: flex; + justify-content: center; + align-items: center; + transform-style: preserve-3d; + z-index: -1; +} +.background { + transform: translatez(-49px) scale(6); +} +.foreground { + transform: translateZ(-20px) scale(3); +} +.background, +.foreground { + position: absolute; + height: 100%; + width: 100%; + object-fit: cover; + z-index: -1; +} +h1 { + position: absolute; + top: 5rem; + font-size: 10rem; + color: white; + text-shadow: 0 0 10px rgba(0, 0, 0, 0.3); + letter-spacing: 4px; +} +section { + background-color: rgb(45, 45, 45); + color: white; + padding: 5rem 0; +} +.secondHeading { + font-size: 5rem; + padding: 0 10rem; +} +.text { + font-size: 1.5rem; + padding: 0 10rem; + margin: 5rem 0; +} +.bg{ + position: relative; + width: 100%; + background-attachment: fixed; + background-position: center; + background-size: cover; + height: 500px; +} +.desc{ + position: absolute; + background-color: white; + padding: 0.5rem 2.5rem; + top:40%; + left: 60%; + transform:translateX(-50%) translateX(-50%); + color:black; + font-size: 3.5rem; + font-weight:600 ; +} +.desc1{ + position: absolute; + background-color: white; + padding: 0.5rem 2.5rem; + top:40%; + left: 66%; + transform:translateX(-50%) translateX(-50%); + color:black; + font-size: 3.5rem; + font-weight:600 ; +} +.bg1 { + background-image: url(sport-1.jpg); +} +.bg2 { + background-image: url(sport-2.jpg); +} +.bg3 { + background-image: url(sport-3.jpg); +}