├── images
    ├── item1.png
    ├── item2.png
    ├── item3.png
    ├── item4.png
    ├── logo.png
    ├── appleStore.png
    ├── playStore.png
    ├── collection1.jpg
    ├── collection2.jpg
    ├── collection3.jpg
    ├── collection4.jpg
    ├── mobileBanner.png
    ├── heroSectionLogo.png
    └── heroSectionBackground.png
├── README.md
├── index.html
└── styles.css


/images/item1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/aditya12gusain/zomato-landing-page-10722/HEAD/images/item1.png


--------------------------------------------------------------------------------
/images/item2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/aditya12gusain/zomato-landing-page-10722/HEAD/images/item2.png


--------------------------------------------------------------------------------
/images/item3.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/aditya12gusain/zomato-landing-page-10722/HEAD/images/item3.png


--------------------------------------------------------------------------------
/images/item4.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/aditya12gusain/zomato-landing-page-10722/HEAD/images/item4.png


--------------------------------------------------------------------------------
/images/logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/aditya12gusain/zomato-landing-page-10722/HEAD/images/logo.png


--------------------------------------------------------------------------------
/images/appleStore.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/aditya12gusain/zomato-landing-page-10722/HEAD/images/appleStore.png


--------------------------------------------------------------------------------
/images/playStore.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/aditya12gusain/zomato-landing-page-10722/HEAD/images/playStore.png


--------------------------------------------------------------------------------
/images/collection1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/aditya12gusain/zomato-landing-page-10722/HEAD/images/collection1.jpg


--------------------------------------------------------------------------------
/images/collection2.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/aditya12gusain/zomato-landing-page-10722/HEAD/images/collection2.jpg


--------------------------------------------------------------------------------
/images/collection3.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/aditya12gusain/zomato-landing-page-10722/HEAD/images/collection3.jpg


--------------------------------------------------------------------------------
/images/collection4.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/aditya12gusain/zomato-landing-page-10722/HEAD/images/collection4.jpg


--------------------------------------------------------------------------------
/images/mobileBanner.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/aditya12gusain/zomato-landing-page-10722/HEAD/images/mobileBanner.png


--------------------------------------------------------------------------------
/images/heroSectionLogo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/aditya12gusain/zomato-landing-page-10722/HEAD/images/heroSectionLogo.png


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # This is a zomato landing page clone
2 | 
3 | Zomato-landing-page-10722
4 | aditya12gusain
5 | 
6 | This is a new SETUP Branch
7 | 


--------------------------------------------------------------------------------
/images/heroSectionBackground.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/aditya12gusain/zomato-landing-page-10722/HEAD/images/heroSectionBackground.png


--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
  1 | <!DOCTYPE html>
  2 | <html lang="en">
  3 |   <head>
  4 |     <meta charset="UTF-8" />
  5 |     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  6 |     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  7 |     <!-- zomato logo in the tab -->
  8 |     <link
  9 |       rel="icon"
 10 |       type="image/x-icon"
 11 |       href="https://upload.wikimedia.org/wikipedia/commons/thumb/7/75/Zomato_logo.png/220px-Zomato_logo.png"
 12 |     />
 13 |     <!-- font awesome icons -->
 14 |     <link
 15 |       rel="stylesheet"
 16 |       href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css"
 17 |       integrity="sha512-KfkfwYDsLkIlwQp6LFnl8zNdLGxu9YAA1QvwINks4PhcElQSvqcyVLLD9aMhXd13uQjoXtEKNosOWaZqXgel0g=="
 18 |       crossorigin="anonymous"
 19 |       referrerpolicy="no-referrer"
 20 |     />
 21 |     <!-- poppins font by google fonts -->
 22 |     <link rel="preconnect" href="https://fonts.googleapis.com" />
 23 |     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
 24 |     <link
 25 |       href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
 26 |       rel="stylesheet"
 27 |     />
 28 | 
 29 |     <!-- importing styles.css -->
 30 |     <link rel="stylesheet" href="styles.css" />
 31 | 
 32 |     <title>Zomato Clone</title>
 33 |   </head>
 34 |   <body>
 35 |     <section class="hero__section">
 36 |       <header>
 37 |         <nav class="navbar">
 38 |           <a href="#">Get The App</a>
 39 |           <div class="navbar__menu_container">
 40 |             <a href="#" class="link">Inventor Relations</a>
 41 |             <a href="#" class="link">Add Restaurant</a>
 42 |             <a href="#" class="link">Login</a>
 43 |             <a href="#" class="link">Sign Up</a>
 44 |             <a href="#" class="user__icon">
 45 |               <i class="fa-solid fa-user"></i>
 46 |             </a>
 47 |           </div>
 48 |         </nav>
 49 |       </header>
 50 | 
 51 |       <div class="hero__section_container">
 52 |         <img
 53 |           class="hero__section_logo"
 54 |           src="images/heroSectionLogo.png"
 55 |           alt="Zomato Logo"
 56 |         />
 57 |         <h1 class="hero__section_title">
 58 |           Discover the best food & drinks in Delhi NCR
 59 |         </h1>
 60 |         <div class="hero__section_input_container">
 61 |           <input
 62 |             class="input_container_location"
 63 |             type="text"
 64 |             placeholder="TWCA, 1, Ashok Rd, Hanu"
 65 |           />
 66 |           <input
 67 |             class="input_container_search"
 68 |             type="text"
 69 |             placeholder="Search for a restaurant, cuisine or a dish"
 70 |           />
 71 |         </div>
 72 |       </div>
 73 |     </section>
 74 | 
 75 |     <section class="container we__offer">
 76 |       <div class="we__offer_card">
 77 |         <img src="images/item1.png" alt="" />
 78 |         <div class="we__offer_content">
 79 |           <h2>Order Online</h2>
 80 |           <p>Stay home and order to your doorstep</p>
 81 |         </div>
 82 |       </div>
 83 | 
 84 |       <div class="we__offer_card">
 85 |         <img src="images/item2.png" alt="" />
 86 |         <div class="we__offer_content">
 87 |           <h2>Dining</h2>
 88 |           <p>View the city's favourite dining venue</p>
 89 |         </div>
 90 |       </div>
 91 | 
 92 |       <div class="we__offer_card">
 93 |         <img src="images/item3.png" alt="" />
 94 |         <div class="we__offer_content">
 95 |           <h2>Nightlife and Clubs</h2>
 96 |           <p>Explore the city's top nightlife outlets</p>
 97 |         </div>
 98 |       </div>
 99 |     </section>
100 | 
101 |     <section class="container collections">
102 |       <h1>Collections</h1>
103 | 
104 |       <div class="sub__heading_container">
105 |         <span
106 |           >Explore curated lists of top restaurants, cafes, pubs, and barsin
107 |           Delhi NCR, based on trends</span
108 |         >
109 |         <span> All collections in Delhi NCR </span>
110 |       </div>
111 | 
112 |       <div class="collections_card_container">
113 |         <div class="card card1">
114 |           <div class="overlay"></div>
115 |           <div class="content">
116 |             <h4>Live Cricket Screening</h4>
117 |             <span>58 Places</span>
118 |           </div>
119 |         </div>
120 | 
121 |         <div class="card card2">
122 |           <div class="overlay"></div>
123 |           <div class="content">
124 |             <h4>Ramadan Special</h4>
125 |             <span>22 Places</span>
126 |           </div>
127 |         </div>
128 | 
129 |         <div class="card card3">
130 |           <div class="overlay"></div>
131 |           <div class="content">
132 |             <h4>Newly Opened</h4>
133 |             <span>100 Places</span>
134 |           </div>
135 |         </div>
136 | 
137 |         <div class="card card4">
138 |           <div class="overlay"></div>
139 |           <div class="content">
140 |             <h4>Trending This Week</h4>
141 |             <span>30 Places</span>
142 |           </div>
143 |         </div>
144 |       </div>
145 |     </section>
146 | 
147 |     <section class="container get__the_app">
148 |       <div class="semiContainer">
149 |         <div class="left">
150 |           <img src="images/mobileBanner.png" alt="" />
151 |         </div>
152 |         <div class="right">
153 |           <h1>Get the Zomato App</h1>
154 |           <p>
155 |             We will send you a link, open it on your phone to download the app.
156 |           </p>
157 |           <div class="radio__buttons_container">
158 |             <div>
159 |               <input type="radio" id="email" name="download_app" />
160 |               <label for="email" style="font-size: 14px">Email</label>
161 |             </div>
162 |             <div>
163 |               <input type="radio" id="phone" name="download_app" />
164 |               <label for="phone" style="font-size: 14px">Phone</label>
165 |             </div>
166 |           </div>
167 |           <div class="input_container">
168 |             <input type="email" placeholder="Email" />
169 |             <button>Share App Link</button>
170 |           </div>
171 |           <div class="download__app_container">
172 |             <h5>Download App From</h5>
173 |             <div>
174 |               <img src="images/appleStore.png" alt="" />
175 |               <img src="images/playStore.png" alt="" />
176 |             </div>
177 |           </div>
178 |         </div>
179 |       </div>
180 |     </section>
181 | 
182 |     <footer class="container footer">
183 |       <div class="footer_section1">
184 |         <img src="images/logo.png" alt="" />
185 |         <div class="section1__buttonContainer">
186 |           <button>
187 |             <img
188 |               src="https://flagcdn.com/w40/in.png"
189 |               alt="indian flag"
190 |               style="width: 17px"
191 |             />India
192 |           </button>
193 |           <button><i class="fa fa-globe"></i>English</button>
194 |         </div>
195 |       </div>
196 |       <div class="navigation_container">
197 |         <div class="link__container">
198 |           <h5>ABOUT ZOMATO</h5>
199 |           <a class="footer__link" href="#">Who we are</a>
200 |           <a class="footer__link" href="#">Blogs</a>
201 |           <a class="footer__link" href="#">Work with us</a>
202 |           <a class="footer__link" href="#">Investor Relations</a>
203 |           <a class="footer__link" href="#">Report Fraud</a>
204 |         </div>
205 | 
206 |         <div class="link__container">
207 |           <h5>ZOMAVERSE</h5>
208 |           <a class="footer__link" href="#">Zomato</a>
209 |           <a class="footer__link" href="#">Feeding India</a>
210 |           <a class="footer__link" href="#">Hyperpure</a>
211 |           <a class="footer__link" href="#">Zomaland</a>
212 |         </div>
213 | 
214 |         <div class="link__container">
215 |           <h5>FOR RESTAURANTS</h5>
216 |           <a class="footer__link" href="#">Partner With Us</a>
217 |           <a class="footer__link" href="#">Apps For You</a>
218 |           <br />
219 |           <h5>FOR ENTERPRICES</h5>
220 |           <a class="footer__link" href="#">Zomato For Work</a>
221 |         </div>
222 | 
223 |         <div class="link__container">
224 |           <h5>Learn More</h5>
225 |           <a class="footer__link" href="#">Privacy</a>
226 |           <a class="footer__link" href="#">Security</a>
227 |           <a class="footer__link" href="#">Terms</a>
228 |           <a class="footer__link" href="#">Sitemap</a>
229 |         </div>
230 | 
231 |         <div class="link__container">
232 |           <h5>SOCIAL LINKS</h5>
233 |           <div class="social__links_container">
234 |             <button><i class="fa-brands fa-linkedin-in"></i></button>
235 |             <button><i class="fa-brands fa-instagram"></i></button>
236 |             <button><i class="fa-brands fa-twitter"></i></button>
237 |             <button><i class="fa-brands fa-youtube"></i></button>
238 |             <button><i class="fa-brands fa-facebook"></i></button>
239 |           </div>
240 |           <br />
241 |           <img
242 |             src="images/appleStore.png"
243 |             alt=""
244 |             class="footer__section_logos"
245 |           />
246 |           <img
247 |             src="images/playStore.png"
248 |             alt=""
249 |             class="footer__section_logos"
250 |           />
251 |         </div>
252 |       </div>
253 |       <div class="disclamer">
254 |         By continuing past this page, you agree to our Terms of Service, Cookie
255 |         Policy, Privacy Policy and Content Policies. All trademarks are
256 |         properties of their respective owners. 2008-2022 © Zomato™ Ltd. All
257 |         rights reserved.
258 |       </div>
259 |     </footer>
260 |   </body>
261 | </html>
262 | 


--------------------------------------------------------------------------------
/styles.css:
--------------------------------------------------------------------------------
  1 | * {
  2 |   margin: 0;
  3 |   padding: 0;
  4 |   box-sizing: border-box;
  5 |   font-family: "Poppins", sans-serif;
  6 | }
  7 | 
  8 | .hero__section {
  9 |   background: url(images/heroSectionBackground.png);
 10 |   background-size: cover;
 11 |   background-position: center;
 12 |   color: white;
 13 |   min-height: 60vh;
 14 | }
 15 | 
 16 | .navbar {
 17 |   display: flex;
 18 |   align-items: center;
 19 |   justify-content: space-between;
 20 |   height: 60px;
 21 |   padding: 16px 48px;
 22 | }
 23 | 
 24 | .navbar a {
 25 |   text-decoration: none;
 26 |   color: white;
 27 | }
 28 | 
 29 | .navbar__menu_container {
 30 |   display: flex;
 31 |   gap: 20px;
 32 | }
 33 | 
 34 | .navbar__menu_container .user__icon {
 35 |   height: 30px;
 36 |   width: 30px;
 37 |   align-items: center;
 38 |   justify-content: center;
 39 |   border-radius: 100%;
 40 |   border: solid 1px white;
 41 |   display: none;
 42 | }
 43 | 
 44 | .hero__section_container {
 45 |   display: flex;
 46 |   flex-direction: column;
 47 |   align-items: center;
 48 |   justify-content: center;
 49 |   gap: 32px;
 50 |   height: calc(60vh - 60px);
 51 | }
 52 | 
 53 | .hero__section_logo {
 54 |   width: 220px;
 55 |   height: auto;
 56 | }
 57 | 
 58 | .hero__section_title {
 59 |   text-align: center;
 60 |   font-size: 30px;
 61 |   font-weight: 400;
 62 | }
 63 | 
 64 | .hero__section_input_container {
 65 |   background-color: white;
 66 |   padding: 10px;
 67 |   display: flex;
 68 |   align-items: center;
 69 |   justify-items: center;
 70 |   gap: 10px;
 71 |   width: 60%;
 72 |   border-radius: 10px;
 73 | }
 74 | 
 75 | .input_container_location,
 76 | .input_container_search {
 77 |   padding: 5px;
 78 |   border: none;
 79 |   outline: none;
 80 | }
 81 | 
 82 | .input_container_location {
 83 |   width: 35%;
 84 |   border-right: 2px solid #e0e0e0;
 85 | }
 86 | 
 87 | .input_container_search {
 88 |   width: 65%;
 89 | }
 90 | 
 91 | @media only screen and (max-width: 600px) {
 92 |   .navbar__menu_container .user__icon {
 93 |     display: flex;
 94 |   }
 95 | 
 96 |   .link {
 97 |     display: none;
 98 |   }
 99 | 
100 |   .navbar {
101 |     padding: 16px;
102 |   }
103 | 
104 |   .hero__section {
105 |     min-height: 80vh;
106 |   }
107 | 
108 |   .hero__section_input_container {
109 |     flex-direction: column;
110 |     background-color: transparent;
111 |     width: 100%;
112 |   }
113 | 
114 |   .input_container_location,
115 |   .input_container_search {
116 |     padding: 15px;
117 |     border-radius: 10px;
118 |     width: 95%;
119 |   }
120 | 
121 |   .hero__section_container {
122 |     height: calc(80vh - 60px);
123 |   }
124 | 
125 |   .hero__section_title {
126 |     font-size: 20px;
127 |     width: 95%;
128 |   }
129 | }
130 | 
131 | .container {
132 |   margin: 3rem auto;
133 |   width: 90%;
134 | }
135 | 
136 | .we__offer {
137 |   display: flex;
138 |   flex-wrap: wrap;
139 |   gap: 1rem;
140 |   align-items: center;
141 |   justify-content: center;
142 | }
143 | 
144 | .we__offer_card {
145 |   border-radius: 10px;
146 |   overflow: hidden;
147 |   border: 1px solid #e0e0e0;
148 |   transition: all 0.3s ease;
149 | }
150 | 
151 | .we__offer_card:hover {
152 |   transform: scale(1.05);
153 | }
154 | 
155 | .we__offer_card img {
156 |   width: 100%;
157 |   height: 160px;
158 |   object-fit: cover;
159 |   object-position: center;
160 | }
161 | 
162 | .we__offer_content {
163 |   padding: 10px;
164 | }
165 | 
166 | .we__offer_content h2 {
167 |   font-size: 20px;
168 |   font-weight: 400;
169 | }
170 | 
171 | .we__offer_content p {
172 |   font-size: 12px;
173 | }
174 | 
175 | .collections h1 {
176 |   font-weight: 600;
177 | }
178 | 
179 | .collections .sub__heading_container {
180 |   font-size: 15px;
181 |   display: flex;
182 |   align-items: center;
183 |   justify-content: space-between;
184 |   flex-wrap: wrap;
185 |   gap: 1rem;
186 | }
187 | 
188 | .sub__heading_container span:nth-child(2) {
189 |   color: #ff7e8b;
190 |   font-size: 13px;
191 |   cursor: pointer;
192 | }
193 | 
194 | .collections_card_container {
195 |   display: flex;
196 |   align-items: center;
197 |   justify-content: center;
198 |   flex-wrap: wrap;
199 |   gap: 0.5rem;
200 |   margin-top: 1.5rem;
201 | }
202 | 
203 | .collections_card_container .card {
204 |   height: 300px;
205 |   min-width: 240px;
206 |   background-size: cover;
207 |   background-position: center;
208 |   border-radius: 10px;
209 |   position: relative;
210 | }
211 | 
212 | .card1 {
213 |   background-image: url("images/collection1.jpg");
214 | }
215 | 
216 | .card2 {
217 |   background-image: url("images/collection2.jpg");
218 | }
219 | 
220 | .card3 {
221 |   background-image: url("images/collection3.jpg");
222 | }
223 | 
224 | .card4 {
225 |   background-image: url("images/collection4.jpg");
226 | }
227 | 
228 | .overlay {
229 |   width: 100%;
230 |   height: 100%;
231 |   position: absolute;
232 |   top: 0;
233 |   left: 0;
234 |   border-radius: 10px;
235 |   background: linear-gradient(
236 |     0deg,
237 |     rgba(0, 0, 0, 0.8) 0%,
238 |     rgba(0, 0, 0, 0.05) 50%,
239 |     rgba(0, 0, 0, 0.05) 85%
240 |   );
241 |   z-index: 5;
242 | }
243 | 
244 | .collections_card_container .card .content {
245 |   position: absolute;
246 |   bottom: 0;
247 |   left: 0;
248 |   color: white;
249 |   padding: 12px 16px;
250 |   font-size: 0.9rem;
251 |   z-index: 6;
252 | }
253 | 
254 | .content h4 {
255 |   font-weight: 400;
256 |   letter-spacing: 0.5px;
257 | }
258 | 
259 | .get__the_app {
260 |   display: flex;
261 |   align-items: center;
262 |   justify-content: center;
263 |   background-color: rgb(255, 251, 247);
264 |   width: 100%;
265 |   padding: 3rem 6rem;
266 | }
267 | 
268 | .get__the_app .semiContainer {
269 |   width: 60%;
270 |   display: flex;
271 |   justify-content: center;
272 |   align-items: center;
273 |   flex-wrap: wrap;
274 |   gap: 1.5rem;
275 | }
276 | 
277 | .get__the_app .semiContainer .left {
278 |   flex: 2;
279 | }
280 | 
281 | .get__the_app .semiContainer .left img {
282 |   width: 100%;
283 |   object-fit: cover;
284 |   object-position: center;
285 | }
286 | 
287 | .get__the_app .semiContainer .right {
288 |   flex: 3;
289 |   height: 100%;
290 |   display: flex;
291 |   flex-direction: column;
292 |   gap: 1rem;
293 | }
294 | 
295 | .right h1 {
296 |   font-weight: 400;
297 |   font-size: 2rem;
298 | }
299 | 
300 | .right p {
301 |   font-size: 0.8rem;
302 | }
303 | 
304 | .semiContainer .right .radio__buttons_container {
305 |   display: flex;
306 |   align-items: center;
307 |   gap: 1rem;
308 | }
309 | 
310 | .semiContainer .right .radio__buttons_container div {
311 |   display: flex;
312 |   align-items: center;
313 |   justify-content: center;
314 |   gap: 10px;
315 | }
316 | 
317 | .right .radio__buttons_container div input {
318 |   height: 15px;
319 |   width: 15px;
320 |   accent-color: rgb(239, 79, 95);
321 | }
322 | 
323 | .semiContainer .right .input_container {
324 |   display: flex;
325 |   gap: 0.5rem;
326 | }
327 | 
328 | .input_container {
329 |   flex-wrap: wrap;
330 | }
331 | 
332 | .input_container button,
333 | .input_container input {
334 |   padding: 10px 12px;
335 | }
336 | 
337 | .input_container input {
338 |   flex: auto;
339 |   border: 1.5px solid gray;
340 |   outline: none;
341 |   border-radius: 5px;
342 | }
343 | 
344 | .input_container button {
345 |   border: none;
346 |   background-color: rgb(239, 79, 95);
347 |   color: white;
348 |   border-radius: 5px;
349 |   cursor: pointer;
350 | }
351 | 
352 | .right .download__app_container {
353 |   display: flex;
354 |   flex-direction: column;
355 |   gap: 0.7rem;
356 | }
357 | 
358 | .download__app_container h5 {
359 |   font-weight: 400;
360 |   color: gray;
361 | }
362 | 
363 | .download__app_container div {
364 |   display: flex;
365 |   gap: 1rem;
366 | }
367 | 
368 | .download__app_container div img {
369 |   width: 35%;
370 | }
371 | 
372 | @media only screen and (max-width: 1300px) {
373 |   .get__the_app .semiContainer .left,
374 |   .get__the_app .semiContainer .right {
375 |     flex: 1;
376 |   }
377 | 
378 |   .get__the_app .semiContainer {
379 |     width: 80%;
380 |   }
381 | }
382 | 
383 | @media only screen and (max-width: 900px) {
384 |   .get__the_app {
385 |     padding: 2rem;
386 |   }
387 | 
388 |   .get__the_app .semiContainer {
389 |     width: 90%;
390 |   }
391 | }
392 | 
393 | @media only screen and (max-width: 700px) {
394 |   .get__the_app {
395 |     padding: 3rem 0;
396 |   }
397 | 
398 |   .get__the_app .semiContainer {
399 |     width: 80%;
400 |     flex-direction: column;
401 |   }
402 | }
403 | 
404 | .footer {
405 |   width: 100%;
406 | }
407 | 
408 | .footer_section1 {
409 |   display: flex;
410 |   align-items: center;
411 |   justify-content: space-between;
412 |   width: 90%;
413 |   margin: auto;
414 |   flex-wrap: wrap;
415 |   gap: 2.5rem;
416 | }
417 | 
418 | .footer_section1 img {
419 |   width: 120px;
420 | }
421 | 
422 | .section1__buttonContainer {
423 |   display: flex;
424 |   gap: 1rem;
425 | }
426 | 
427 | .section1__buttonContainer button {
428 |   padding: 5px 5px;
429 |   width: 90px;
430 |   border: 1px solid gray;
431 |   background-color: transparent;
432 |   border-radius: 5px;
433 |   display: flex;
434 |   align-items: center;
435 |   justify-content: center;
436 |   gap: 10px;
437 |   cursor: pointer;
438 | }
439 | 
440 | .navigation_container {
441 |   display: grid;
442 |   grid-template-columns: repeat(5, 1fr);
443 |   width: 90%;
444 |   margin: auto;
445 |   gap: 1rem;
446 |   padding: 3rem 0;
447 | }
448 | 
449 | .link__container {
450 |   display: flex;
451 |   flex-direction: column;
452 |   gap: 5px;
453 | }
454 | 
455 | .link__container h5 {
456 |   font-weight: 500;
457 |   font-size: 15px;
458 |   margin-bottom: 5px;
459 |   letter-spacing: 0.8px;
460 | }
461 | 
462 | .footer__link {
463 |   text-decoration: none;
464 |   color: gray;
465 |   font-size: 13px;
466 |   font-weight: 300;
467 | }
468 | 
469 | .footer__link:hover {
470 |   color: black;
471 | }
472 | 
473 | .social__links_container {
474 |   display: flex;
475 |   gap: 0.5rem;
476 | }
477 | 
478 | .social__links_container button {
479 |   background-color: black;
480 |   border: none;
481 |   width: 25px;
482 |   height: 25px;
483 |   border-radius: 30px;
484 |   display: flex;
485 |   justify-content: center;
486 |   align-items: center;
487 |   cursor: pointer;
488 | }
489 | 
490 | .social__links_container button i {
491 |   color: white;
492 |   font-size: 13px;
493 | }
494 | 
495 | .footer__section_logos {
496 |   width: 100%;
497 | }
498 | 
499 | .disclamer {
500 |   width: 90%;
501 |   margin: auto;
502 |   color: gray;
503 |   font-size: 12px;
504 |   border-top: 1px solid gray;
505 |   padding-top: 1.5rem;
506 | }
507 | 
508 | @media only screen and (max-width: 900px) {
509 |   .navigation_container {
510 |     grid-template-columns: repeat(3, 1fr);
511 |   }
512 | }
513 | 
514 | @media only screen and (max-width: 600px) {
515 |   .navigation_container {
516 |     grid-template-columns: 1fr 1fr;
517 |   }
518 | }
519 | 
520 | @media only screen and (max-width: 450px) {
521 |   .navigation_container {
522 |     grid-template-columns: 1fr;
523 |   }
524 | }
525 | 


--------------------------------------------------------------------------------