-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
1 changed file
with
171 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,171 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="UTF-8" /> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
<title>Home | REJOUICE® Clone</title> | ||
<!-- favicon --> | ||
<link rel="icon" type="image/png" sizes="32x32" href="./assets/32x32.png" /> | ||
|
||
<!-- locomotive-scroll.css --> | ||
<!-- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/locomotive-scroll.css"/> --> | ||
|
||
<!-- remix-icon --> | ||
<link href="https://cdn.jsdelivr.net/npm/[email protected]/fonts/remixicon.css" rel="stylesheet"> | ||
|
||
<!-- style.css --> | ||
<link rel="stylesheet" href="style.css" /> | ||
</head> | ||
<body> | ||
<div class="main"> | ||
<div class="section-1"> | ||
<div class="cursor"> | ||
<h5>Play Reel</h5> | ||
</div> | ||
<video src="./assets/bg-video.mp4" autoplay loop muted></video> | ||
<div class="section-1-content"> | ||
<nav> | ||
<h3>The Venture Agency.</h3> | ||
<h4>Menu</h4> | ||
</nav> | ||
<h1><span>r</span><span>e</span><span>j</span><span>o</span><span>u</span><span>i</span><span>c</span><span>e</span> | ||
</h1> | ||
</div> | ||
</div> | ||
<!-- <div class="section-2"> | ||
<div class="part1"> | ||
<h3 class="elem"> | ||
<span>A brand accelerator. <br>With two engagement models.</span> | ||
</h3> | ||
<h4 class="elem"> | ||
<span><sub>Paris & San Diego</sub></span> | ||
</h4> | ||
</div> | ||
<div class="elem"> | ||
<h1> | ||
<span> We are a digital brand accelerator curating dream teams for dream clients. We design, develop, and scale market-defining brands. Choose full cash compensation or offset up to 50% of our fees for equity in your company. Your vision, your decision.</span> | ||
</h1> | ||
</div> | ||
</div> --> | ||
<div class="section-2"> | ||
<div class="part1"> | ||
<div> | ||
<div class="elem"> | ||
<h4>A brand accelerator.</h4> | ||
</div> | ||
<div class="elem"> | ||
<h4>With two engagement models.</h4> | ||
</div> | ||
</div> | ||
<div class="elem"> | ||
<h4><span><sub>Paris & San Diego</sub></span></h4> | ||
</div> | ||
</div> | ||
|
||
<div class="elem"> | ||
<h1> | ||
We are a digital | ||
brand accelerator. We | ||
</h1> | ||
</div> | ||
<div class="elem"> | ||
<h1>design, develop, and scale market-defining</h1> | ||
</div> | ||
<div class="elem"> | ||
<h1>brands by unlocking their hidden potential.</h1> | ||
</div> | ||
<div class="elem"> | ||
<h1>Choose full cash compensation or offset up to</h1> | ||
</div> | ||
<div class="elem"> | ||
<h1>50% of our fees for equity in your company.</h1> | ||
</div> | ||
<div class="elem"> | ||
<h1>Your vision, your decision.<br /><br /></h1> | ||
</div> | ||
</div> | ||
<div class="section-3"> | ||
<div class="section-3-top"> | ||
<h4>Agency & Venture <span>Models</span> <i class="ri-corner-right-down-line"></i></h4> | ||
<h2>Explore Our Services</h2> | ||
<h2>& engagement models</h2> | ||
</div> | ||
<div class="section-3-div"> | ||
<div class="section-3-h3"> | ||
<h3>Transforming visions into brands.</h3> | ||
<h4><i class="ri-corner-down-right-line"></i> See The Work</h4> | ||
</div> | ||
<div class="boxes"> | ||
<div class="box"> | ||
<img src="./assets/car.avif" alt="car"> | ||
<span><img src="./assets/Rivian_image.avif" alt="Rivian_image" class="image"></span> | ||
<video src="./assets/Website-homepage-Work-01_1.mp4" autoplay muted loop></video> | ||
<!-- <img src="./assets/Rivian_image.avif" alt="Rivian_image" class="image"> --> | ||
</div> | ||
<div class="box"> | ||
<img src="./assets/man.avif" alt="man"> | ||
<span><img src="./assets/oura.svg" alt="oura" class="image"></span> | ||
<video src="./assets/Website-homepage-Work-02_1.mp4" autoplay muted loop></video> | ||
</div> | ||
<div class="box"> | ||
<img src="./assets/sportsCar.avif" alt="sportsCar"> | ||
<span><img src="./assets/moxion.svg" alt="maxion" class="image"></span> | ||
<video src="./assets/Website-homepage-Work-03_1.mp4" autoplay muted loop></video> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
<div class="section-4"> | ||
<div class="part1"> | ||
<h3 > | ||
<span>We operate on a simple philosophy: <br>Quality over quantity.</span> | ||
</h3> | ||
</div> | ||
<div class="elem"> | ||
<h1> | ||
<span> We partner with 5 clients each year. This allows for intence focus on the Transformation and launch of your brand by our very best team, which is the only team we have.</span> | ||
</h1> | ||
</div> | ||
</div> | ||
<div class="section-5"> | ||
<div class="cursor1"> | ||
<h5>Play Reel</h5> | ||
</div> | ||
<video src="./assets/RJ-BALL-BLUE-ORANGE-scaled.webm" autoplay muted loop></video> | ||
<svg class="abs tl:0 fit transform rotate:-90deg" viewBox="0 0 100 100"> | ||
<circle cx="50" cy="50" r="49" stroke="#fff" stroke-width="0.25" fill="none" class="o:0.3 $$2$$ $$3$$ $$4$$ (.in-view):tween:all,2.8s,easeOutSlow dasharray:308 dashoffset:616 (.in-view):dashoffset:554.4"></circle> | ||
<circle cx="50" cy="50" r="49" stroke="#fff" stroke-width="0.25" fill="none" class="$$5$$ $$6$$ $$7$$ (.in-view):tween:all,2.8s,easeOutSlow dasharray:308 dashoffset:308 (.in-view):dashoffset:246.4"></circle> | ||
</svg> | ||
<svg class="abs tl:0 fit transform rotate:0 $$8$$ (.in-view):tween:all,2.8s,easeOutSlow (.in-view):rotate:72deg" viewBox="0 0 100 100"> | ||
<circle cx="50" cy="1" r="1" fill="#fff"></circle> | ||
</svg> | ||
</div> | ||
</div> | ||
|
||
|
||
<!-- locomotive-scroll.js --> | ||
<script | ||
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/locomotive-scroll.js" | ||
></script> | ||
|
||
<!-- gsap --> | ||
<script | ||
src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.3/gsap.min.js" | ||
integrity="sha512-7Au1ULjlT8PP1Ygs6mDZh9NuQD0A5prSrAUiPHMXpU6g3UMd8qesVnhug5X4RoDr35x5upNpx0A6Sisz1LSTXA==" | ||
crossorigin="anonymous" | ||
referrerpolicy="no-referrer" | ||
></script> | ||
|
||
<!-- ScrollTrigger.min.js --> | ||
<script | ||
src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.3/ScrollTrigger.min.js" | ||
integrity="sha512-LQQDtPAueBcmGXKdOBcMkrhrtqM7xR2bVrnMtYZ8ImAZhFlIb5xrMqQ6uZviyeSB+4mYj89ta8niiCIQM1Gj0w==" | ||
crossorigin="anonymous" | ||
referrerpolicy="no-referrer" | ||
></script> | ||
|
||
<!-- script --> | ||
<!-- <script src="app.js"></script> --> | ||
<script src="app.js"></script> | ||
</body> | ||
</html> |