├── style.css └── index.html /style.css: -------------------------------------------------------------------------------- 1 | /* GLOBAL */ 2 | * { 3 | margin: 0; 4 | padding: 0; 5 | } 6 | 7 | body { 8 | background-color: #FFEDD5; /* hex: 0-F */ 9 | font-family: 'Roboto', sans-serif; 10 | } 11 | 12 | ul { 13 | list-style: none; 14 | } 15 | 16 | /* FONTS */ 17 | h1, h2, h3, .price { 18 | font-family: 'Roboto Serif', serif; 19 | text-transform: uppercase; 20 | color: #2D2C2A; 21 | } 22 | 23 | /* HEADER */ 24 | header { 25 | padding: 32px 0; 26 | text-align: center; 27 | } 28 | 29 | header, 30 | section { 31 | max-width: 300px; 32 | margin: 0 auto; 33 | } 34 | 35 | header h1 { 36 | margin-bottom: 4px; 37 | font-size: 28px; 38 | line-height: 33px; 39 | } 40 | 41 | header h1 span { 42 | color: #995000; 43 | } 44 | 45 | header p { 46 | font-size: 14px; 47 | line-height: 16px; 48 | 49 | color: rgba(0, 0, 0, 0.7); 50 | } 51 | 52 | /* SECTION */ 53 | section { 54 | margin-bottom: 24px; 55 | } 56 | 57 | section h2 { 58 | background-color: #FED7AA; 59 | padding: 8px 16px; 60 | text-align: center; 61 | 62 | margin-bottom: 24px; 63 | font-size: 18px; 64 | } 65 | 66 | /* LISTA */ 67 | ul li { 68 | margin-bottom: 16px; 69 | display: flex; 70 | } 71 | 72 | li .details { 73 | max-width: 240px; 74 | } 75 | 76 | .details h3 { 77 | margin-bottom: 8px; 78 | font-size: 16px; 79 | line-height: 19px; 80 | } 81 | 82 | .details p { 83 | color: rgba(0, 0, 0, 0.6); 84 | font-size: 14px; 85 | line-height: 21px; 86 | } 87 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | RocketCoffee 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |

RocketCoffee

20 |

Aberto todos os dias. 8h-21h

21 |
22 | 23 |
24 |

Brunch

25 | 26 | 54 |
55 | 56 |
57 |

Bebidas

58 | 59 | 87 |
88 | 89 | 90 | --------------------------------------------------------------------------------