forked from KenzieAcademy/restaurantmenu
/
style1.css
58 lines (42 loc) · 1.4 KB
/
style1.css
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
@import url('https://fonts.googleapis.com/css?family=Lato|Supermercado+One');
/* Use the 'Lato' font family at 18px throughout the body of the document, and cover the background with the 'map-bg.jpg' image. */
nav {font-family: "lato";
font-size: 18px;}
body{
background-image: url("map-bg.jpg");
font-size: 18px;
font-family: lato;
}
#main {width: 900px; margin: 10px auto;}
/* Use the 'Supermercado One' font at 45px (colored #5d4037) for the restaurant name. */
h1 {
font-family: "Supermercado One";
font-size: 45px;
color: #5d4037;
}
/* Set the separator between the columns (the "column-rule") to be 2px dashed rosybrown. */
#menu {columns: 400px 2;
column-gap: 100px;
column-rule: 2px dashed rosybrown;}
section {margin-bottom: 50px;}
/* Show each of the section headings of the menu (e.g. "Starters") in small caps, colored #6d4c41. */
h2 {margin: 0;
color: #6d4c41;
font-variant: small-caps;
}
/* Make the name of each menu item appear in bold in a 20px size. */
dt{
font-display: Bolder;
font-size: 20px;
}
dd {margin: 0 0 12px 0; display: flex;}
.details {order: 1;}
/* Show the price of each item in a large font, in the color named 'firebrick' */
.price {order: 2;
padding-left: 10px;
color: firebrick;
font-size: large;
}
/* Draw a 2px dashed rosybrown border around the address/footer */
address {padding: 10px;
border: rosybrown dashed 2px;}