htmlandcssproject01

This is restaurant website

<!-- Red Rose Font -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
  href="https://fonts.googleapis.com/css2?family=Red+Rose:wght@300;400;500;600;700&display=swap"
  rel="stylesheet"
/>
<!-- Dela Font -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
  href="https://fonts.googleapis.com/css2?family=Dela+Gothic+One&display=swap"
  rel="stylesheet"
/>
<title>Document</title>

• Our Menu
• Maps
• About
• Contact

Order

A Restaurant That Only Serves Delicious Food

Read Our Menu

• { margin: 0; padding: 0; box-sizing: border-box; font-family: "Red Rose", cursive; }

body { width: 100%; height: 100%; background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("restaurant.png"); background-size: cover; background-attachment: fixed; }

/* ------------------------------ / / ---------- NAVBAR ------------ / / ------------------------------ */

.navbar { display: flex; justify-content: space-between; align-items: center; padding: 0 60px 0 60px; margin-top: 55px; }

.list { display: flex; align-items: center; gap: 63px; list-style: none; font-family: "Red Rose"; font-style: normal; font-weight: 400; font-size: 18px; line-height: 22px; color: #ffc233; }

.logo, .list-item { cursor: pointer; }

.button-small { padding: 12px 40px; background-color: #ff505f; border: none; font-family: "Red Rose"; font-style: normal; font-weight: 700; font-size: 24px; line-height: 30px; color: #ffffff; cursor: pointer; }

/* ------------------------------ / / ---------- HERO ------------ / / ------------------------------ */

.hero { max-width: 1154px; margin: 0 auto; text-align: center; margin-top: 119px; }

.hero-heading { font-family: "Dela Gothic One", cursive; font-style: normal; font-weight: 400; font-size: 104px; line-height: 114px; /* or 110% */ color: #ffc233; }

.button-large { background: #ff505f; font-family: "Red Rose"; font-style: normal; font-weight: 700; font-size: 32px; line-height: 40px; color: #ffffff; border: none; padding: 24px 56px; margin-top: 64px; cursor: pointer; }

.bottom { position: absolute; bottom: 20px; right: 40px; }