This is a custom code placeholder.
Switch to Preview or publish the page
to see how your code works.
Double-click to edit
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>The Design Lounge Menu</title> <link href="styles.css" rel="stylesheet" type="text/css" /> <link href="http://fonts.cdnfonts.com/css/futura-md-bt" rel="stylesheet"> <style> @import url('http://fonts.cdnfonts.com/css/futura-md-bt'); </style> <style> body { background-image: url(https://cdn.shopify.com/s/files/1/0015/4461/8099/files/WhatsApp_Image_2022-03-29_at_8.38.02_AM.jpg?v=1648540934); font-family: 'Futura Md BT', sans-serif; height: 100%; /* Center and scale the image nicely */ background-position: center; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; } h1 { font-size: 40px; margin-top: 0; margin-bottom: 15px; } h2 { font-size: 30px; } h1, h2, p { text-align: center; } h2{font-style:bold;} .menu { width: 80%; background-color: rgb(255, 255, 255); margin-left: auto; margin-right: auto; padding: 20px; max-width: 500px; opacity: 0.9; } hr { height: 2px; background-color: rgb(0, 0, 0); border-color: rgb(0, 0, 0); } .bottom-line { margin-top: 25px; } .item p { display: inline-block; margin-top: 5px; margin-bottom: 5px; font-size: 18px; } .flavor, .dessert { text-align: left; width: 75%; } .note { text-align: left; width: 85%; font-size:14px !important; } .price { text-align: right; width: 25%; float: right; } span{ float:right; padding-right:25px; margin-top:-10px; top:5px; font-size:15px; display:block; } .logo{ padding-left:115px; display:inline-block; text-align:center; width: 30%; height: 30%; } /* FOOTER */ footer { font-size: 14px; } .address { margin-bottom: 5px; } a { color: black; } a:visited { color: black; } a:hover { color: rgb(0, 0, 0); } a:active { color: rgb(0, 0, 0); } </style> </head> <body> <div class="menu"> <header> <img class="logo" src="https://cdn.shopify.com/s/files/1/0015/4461/8099/files/WhatsApp_Image_2022-03-29_at_12.21.52_PM.jpg?v=1648549533" /> <h1>THE DESIGN LOUNGE </h1><span>By MatsMall</span> </header> <br/> <hr /> <main> <section> <h2>Breakfast</h2> <article class="item"> <p class="flavor">Croissant Combo <h7 class="note">(Plain Croissant + Coffee)</h7></p> <p class="price">45 Dhs</p> </article> <article class="item"> <p class="note">Note: V60 not included</p> </article> <article class="item"> <p class="flavor">Design Croissant Benedict</p> <p class="price">45 Dhs</p> </article> <article class="item"> <p class="flavor">Design Toast Benedict</p> <p class="price">45 Dhs</p> </article> <article class="item"> <p class="flavor">Design Avocado Toast</p> <p class="price">48 Dhs</p> </article> <article class="item"> <p class="flavor">Design Lebnah With Egg</p> <p class="price">40 Dhs</p> </article> </section> <section> <h2>Desserts</h2> <article class="item"> <p class="dessert">Chocolate Waffle</p> <p class="price">38 Dhs</p> </article> <article class="item"> <p class="dessert">San Sebastian</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="dessert">Saffron Milk Cake</p> <p class="price">38 Dhs</p> </article> <article class="item"> <p class="dessert">Acai Design Secret</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="dessert">Design French Toast</p> <p class="price">45 Dhs</p> </article> <article class="item"> <p class="dessert">Design Assedha Cake</p> <p class="price">38 Dhs</p> </article> <article class="item"> <p class="dessert">COCO ASAY</p> <p class="price">37 Dhs</p> </article> <article class="item"> <p class="dessert">Design Molten Cake</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="dessert">Design Chocolate Cake</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="dessert">Design Hazelnut Cake</p> <p class="price">35 Dhs</p> </article> </section> <section> <h2>Coffee</h2> <article class="item"> <p class="flavor">Espresso</p> <p class="price">18 Dhs</p> </article> <article class="item"> <p class="flavor">Double Shot Espresso</p> <p class="price">22 Dhs</p> </article> <article class="item"> <p class="flavor">Macchiato <h7 class="note">(Hot/Iced)</h7></p> <p class="price">26 Dhs</p> </article> <article class="item"> <p class="flavor">Caramel Macchiato</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="flavor">French Press Coffee</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="flavor">Americano <h7 class="note">(Hot/Iced)</h7></p> <p class="price">20 Dhs</p> </article> <article class="item"> <p class="flavor">Turkish Coffee</p> <p class="price">22 Dhs</p> </article> <article class="item"> <p class="flavor">Cappuccino</p> <p class="price">26 Dhs</p> </article> <article class="item"> <p class="flavor">Picolo</p> <p class="price">24 Dhs</p> </article> <article class="item"> <p class="flavor">Cortado</p> <p class="price">24 Dhs</p> </article> <article class="item"> <p class="flavor">Classic Latte <h7 class="note">(Hot/Iced)</h7></p> <p class="price">26 Dhs</p> </article> <article class="item"> <p class="flavor">Spanish Latte <h7 class="note">(Hot/Iced)</h7></p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="flavor">Rose Latte</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="flavor">Pistachio Latte</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="flavor">Lavander Latte</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="flavor">Saffron Latte</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="flavor">Cold brew</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="flavor">Syphon</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="flavor">Chemex</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="flavor">Affogato</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="flavor">Flat White</p> <p class="price">26 Dhs</p> </article> <article class="item"> <p class="flavor">V60</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="note">Note: Each Extra Shot +3 Dhs</p> </article> </section> <section> <h2>Milkshakes</h2> <article class="item"> <p class="flavor">ICE DUBAI</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="flavor">BLUE HAWAI</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="flavor">Pistachio</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="flavor">Ice Mocha</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="flavor">Design Mix Smoothly</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="flavor">Design Fitness Smoothie</p> <p class="price">35 Dhs</p> </article> <article class="item"> <p class="flavor">Design Secret Smoothie</p> <p class="price">37 Dhs</p> </article> </section> <section> <section> <h2>Ice Cream</h2> <h3>Flavors: (1 Scoop 12 Dhs, 2 Scoops 21 Dhs)</h3> <article class="item"> <p class="flavor">Chocolate</p> </article> <article class="item"> <p class="flavor">Vanilla</p> </article> <article class="item"> <p class="flavor">Coffee</p> </article> <h3>Sauce: (Each Sauce 5 Dhs)</h3> <article class="item"> <p class="flavor">Chocolate Sauce</p> </article> <article class="item"> <p class="flavor">Caramel Sauce</p> </article> <article class="item"> <p class="flavor">Pistachio Sauce</p> </article> <h3>Toppings: (Each Topping 5 Dhs)</h3> <article class="item"> <p class="flavor">Lotus</p> </article> <article class="item"> <p class="flavor">Chocolate Chips</p> </article> <article class="item"> <p class="flavor">Cereal</p> </article> <article class="item"> <p class="flavor">Nuts</p> </article> <article class="item"> <p class="flavor">Sprinkles</p> </article> </section> <section> <h2>Hot Beverages</h2> <article class="item"> <p class="flavor">Arabic Coffee</p> <p class="price">25 Dhs</p> </article> <article class="item"> <p class="flavor">English Tea</p> <p class="price">20 Dhs</p> </article> <article class="item"> <p class="flavor">Green Tea</p> <p class="price">20 Dhs</p> </article> <article class="item"> <p class="flavor">Jasmine Tea</p> <p class="price">20 Dhs</p> </article> <article class="item"> <p class="flavor">Hot Chocolate</p> <p class="price">25 Dhs</p> </article> <article class="item"> <p class="dessert">Hot Choco Box</p> <p class="price">35 Dhs</p> </article> </section> <section> <h2>Cold Beverages</h2> <article class="item"> <p class="flavor">Fresh Orange Juice</p> <p class="price">20 Dhs</p> </article> <article class="item"> <p class="flavor">Lemon & Mint</p> <p class="price">20 Dhs</p> </article> <article class="item"> <p class="flavor">Classic Mojito</p> <p class="price">29 Dhs</p> </article> <article class="item"> <p class="flavor">Raspberry Mojito</p> <p class="price">29 Dhs</p> </article> <article class="item"> <p class="flavor">Blueberry Mojito</p> <p class="price">29 Dhs</p> </article> <article class="item"> <p class="flavor">Passion Fruit Mojito</p> <p class="price">29 Dhs</p> </article> <article class="item"> <p class="flavor">Vimto Mojito</p> <p class="price">29 Dhs</p> </article> <article class="item"> <p class="flavor">Pink Glow</p> <p class="price">29 Dhs</p> </article> <article class="item"> <p class="flavor">Design Secret Smoothie</p> <p class="price">35 Dhs</p> </article> </section> <section> <h2>Soft Drinks</h2> <article class="item"> <p class="flavor">Pepsi</p> <p class="price">8 Dhs</p> </article> <article class="item"> <p class="flavor">7up</p> <p class="price">8 Dhs</p> </article> <article class="item"> <p class="flavor">Gingre Ale</p> <p class="price">12 Dhs</p> </article> </section> <section> <h2>Water</h2> <article class="item"> <p class="flavor">Still water</p> <p class="price">7 Dhs</p> </article> <article class="item"> <p class="flavor">Sparkling water</p> <p class="price">12 Dhs</p> </article> </section> </main> <hr class="bottom-line" /> <footer> <p> <a href="https://matsmall.com/" target="_blank" >Visit our website</a > </p> </footer> </div> </body> <html></html> </html>