-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
170 lines (167 loc) · 8.07 KB
/
index.html
File metadata and controls
170 lines (167 loc) · 8.07 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Digital Trend</title>
<link rel="shortcut icon" href="img/female-avatar.png" type="image/x-icon">
<link rel="stylesheet" href="styles/styles.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@8/swiper-bundle.min.css">
</head>
<body>
<header>
<div class="container">
<div class="logo"> <a href="#">Digital Trend </a></div>
<nav>
<ul class="nav__ul">
<li><a href="#">Hello</a></li>
<li> <a href="#">Our Works</a></li>
<li> <a href="#">Blog </a></li>
<li> <a href="#">Contact </a></li>
</ul>
<div class="button__box">
<div class="my-button">
<div class="btn-elem"></div>
</div>
</div>
</nav>
</div>
</header>
<main>
<div class="container">
<div class="main__menu">
<h1 class="gs_reveal">We are ready for your digital marketing</h1>
<div class="contact featured-image-container ipsGrid_span5 gs_reveal gs_reveal_fromLeft"> <button>Let us
discuss together!</button><a href="tel:+998991001879">
<div class="fa-solid fa-phone"></div><span>+99 000 070 4224</span>
</a></div>
</div>
</div>
</main>
<section class="about">
<div class="container">
<div class="about__texts gs_reveal">
<h1>the best <span>Digital Marketing agency</span> in Rio de Janeiro </h1>
<p> Lorem ipsum dolor sit amet consectetur adipisicing elit.
Ullam amet, officia ducimus exercitationem tenetur quidem.</p>
<p> Dolor sit <span>Lorem, ipsum</span> amet consectetur adipisicing elit.
Laboriosam cupiditate excepturi, molestiae animi aut et?
Soluta aperiam sapiente accusamus, impedit omnis praesentium
nam sunt</p>
</div>
</div>
</section>
<section class="slider">
<div class="container">
<h1 class="gs_reveal gs_reveal_fromRight">Please take a look through our <span>featured Digital
Trends</span></h1>
<div class="swiper mySwiper gs_reveal">
<div class="swiper-wrapper">
<div class="swiper-slide"><img src="img/project/project-image04.jpg" alt="project">
<div class="box">
<div class="text">
<p>Select Mode</p>
<h1>Race Bicycle </h1>
</div><a href="#"> <i class="fa-solid fa-chevron-right"></i></a>
</div>
</div>
<div class="swiper-slide"><img src="img/project/project-image01.jpg" alt="project">
<div class="box">
<div class="text">
<p>Select Mode</p>
<h1>Race Bicycle </h1>
</div><a href="#"> <i class="fa-solid fa-chevron-right"></i></a>
</div>
</div>
<div class="swiper-slide"><img src="img/project/project-image02.jpg" alt="project">
<div class="box">
<div class="text">
<p>Select Mode</p>
<h1>Race Bicycle </h1>
</div><a href="#"> <i class="fa-solid fa-chevron-right"></i></a>
</div>
</div>
<div class="swiper-slide"><img src="img/project/project-image03.jpg" alt="project">
<div class="box">
<div class="text">
<p>Select Mode</p>
<h1>Race Bicycle </h1>
</div><a href="#"> <i class="fa-solid fa-chevron-right"></i></a>
</div>
</div>
<div class="swiper-slide"><img src="img/project/project-image05.jpg" alt="project">
<div class="box">
<div class="text">
<p>Select Mode</p>
<h1>Race Bicycle </h1>
</div><a href="#"> <i class="fa-solid fa-chevron-right"></i></a>
</div>
</div>
</div>
<div class="swiper-pagination"></div>
</div>
</div>
</section>
<section class="client">
<div class="container">
<div class="client__text gs_reveal gs_reveal_fromRight">
<h3>Client testimonials</h3>
<p> Lorem, ipsum dolor sit amet consectetur adipisicing natus
elit. Iste quibusdam id rerum natus impedit numquam
<h6> <span>Hello World </span>/ Digital Agency IDRB</h6>
</p>
</div>
</div>
</section>
<footer>
<div class="container__footer">
<div class="footer__box">
<div class="footer__box-top">
<h1 class="gs_reveal gs_reveal_fromLeft">We make creative <span>brands </span>only</h1>
<div class="footer__top-menu">
<div class="footer__contact gs_reveal gs_reveal_fromLeft">
<h3>contact info </h3>
<div class="contact__box"> <a href="tel:+998991001879">
<div class="fa-solid fa-phone"></div><span>+99 000 070 4224</span>
</a><a href="mailto:abilkosimovsarkor@gmail.com">
<div class="fa-solid fa-envelope"></div><span>hello@comunity.com</span>
</a></div>
</div>
<div class="footer__adress gs_reveal gs_reveal_fromRight">
<h3>our studio </h3>
<div class="adress__box"> <span class="fa-sharp fa-solid fa-house"></span>
<p>Lorem ipsum dolor consectetur adipisicing elit. Lorem, ipsum dolor.</p>
</div>
</div>
</div>
</div>
<div class="footer__box-bottom">
<p>Copyright © 2020 Your Company Design TemplateMo</p>
<nav>
<ul>
<li> <a href="#">Stories</a></li>
<li> <a href="#">Work with us</a></li>
<li> <a href="#">Privacy</a></li>
</ul>
</nav>
<div class="footer__social"><a href="#">
<div class="fa-brands fa-instagram"></div>
</a><a href="#">
<div class="fa-brands fa-twitter"></div>
</a><a href="#">
<div class="fa-brands fa-facebook"></div>
</a><a href="#">
<div class="fa-brands fa-linkedin"></div>
</a></div>
</div>
</div>
</div>
</footer>
</body>
<script src="https://cdn.jsdelivr.net/npm/swiper@8/swiper-bundle.min.js"> </script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.4/gsap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.4/ScrollTrigger.min.js"></script>
<script src="scripts/script.js"> </script>
</html>