forked from colmtuite/bantam-icons
-
Notifications
You must be signed in to change notification settings - Fork 1
Expand file tree
/
Copy pathdemo.html
More file actions
300 lines (280 loc) · 24.7 KB
/
Copy pathdemo.html
File metadata and controls
300 lines (280 loc) · 24.7 KB
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
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
<!DOCTYPE html>
<html class="" lang="en" style="font-size: 62.5%;">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<title>Bantam Icons</title>
<meta name="author" content="">
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="node_modules/bantam/css/bantam.min.css">
</head>
<body class="ff-system">
<div class="width-90 bps-width-75 bpm-width-50 bpl-width-40 clearfix horizontallyCenter">
<header class="ta-center mt-xxl mb-xxl">
<h1 class="fs-xxxl fw-3 ls-xs">Bantam Icons</h1>
</header>
<div class="display-inlineBlock padding-s">
<svg width="24px" height="24px" viewBox="0 0 24 24">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="#27313C">
<g transform="translate(2.000000, 5.000000)">
<path d="M0,2.00585866 C0,0.898053512 0.898212381,0 1.99079514,0 L18.0092049,0 C19.1086907,0 20,0.897060126 20,2.00585866 L20,11.9941413 C20,13.1019465 19.1017876,14 18.0092049,14 L1.99079514,14 C0.891309342,14 0,13.1029399 0,11.9941413 L0,2.00585866 Z M1,2.00247329 C1,1.44882258 1.44494629,1 1.99339768,1 L18.0066023,1 C18.5552407,1 19,1.45576096 19,2.00247329 L19,11.9975267 C19,12.5511774 18.5550537,13 18.0066023,13 L1.99339768,13 C1.44475929,13 1,12.544239 1,11.9975267 L1,2.00247329 Z" id="Frame"></path>
<rect id="Key" x="15" y="9" width="2" height="2"></rect>
<rect id="Spacebar" x="6" y="9" width="8" height="2"></rect>
<rect id="Key" x="3" y="9" width="2" height="2"></rect>
<rect id="Key" x="15" y="6" width="2" height="2"></rect>
<rect id="Key" x="12" y="6" width="2" height="2"></rect>
<rect id="Key" x="9" y="6" width="2" height="2"></rect>
<rect id="Key" x="6" y="6" width="2" height="2"></rect>
<rect id="Key" x="3" y="6" width="2" height="2"></rect>
<rect id="Key" x="15" y="3" width="2" height="2"></rect>
<rect id="Key" x="12" y="3" width="2" height="2"></rect>
<rect id="Key" x="9" y="3" width="2" height="2"></rect>
<rect id="Key" x="6" y="3" width="2" height="2"></rect>
<rect id="Key" x="3" y="3" width="2" height="2"></rect>
</g>
</g>
</g>
</svg>
</div>
<div class="display-inlineBlock padding-s">
<svg width="24px" height="24px" viewBox="0 0 24 24">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="#27313C">
<g transform="translate(2.000000, 2.000000)">
<path d="M10,20 C15.5228475,20 20,15.5228475 20,10 C20,4.4771525 15.5228475,0 10,0 C4.4771525,0 0,4.4771525 0,10 C0,15.5228475 4.4771525,20 10,20 Z M10,19 C14.9705627,19 19,14.9705627 19,10 C19,5.02943725 14.9705627,1 10,1 C5.02943725,1 1,5.02943725 1,10 C1,14.9705627 5.02943725,19 10,19 Z" id="Combined-Shape"></path>
<path d="M10,15 C12.7614237,15 15,12.7614237 15,10 C15,7.23857625 12.7614237,5 10,5 C7.23857625,5 5,7.23857625 5,10 C5,12.7614237 7.23857625,15 10,15 Z M10,14 C12.209139,14 14,12.209139 14,10 C14,7.790861 12.209139,6 10,6 C7.790861,6 6,7.790861 6,10 C6,12.209139 7.790861,14 10,14 Z" id="Combined-Shape"></path>
<rect id="Rectangle-171" transform="translate(5.121320, 5.121320) rotate(-45.000000) translate(-5.121320, -5.121320) " x="4.62132034" y="2.62132034" width="1" height="5"></rect>
<rect id="Rectangle-171" transform="translate(5.213835, 14.978553) rotate(-135.000000) translate(-5.213835, -14.978553) " x="4.71383476" y="12.6804564" width="1" height="4.59619408"></rect>
<rect id="Rectangle-171" transform="translate(15.121320, 15.121320) rotate(-45.000000) translate(-15.121320, -15.121320) " x="14.6213203" y="12.6213203" width="1" height="5"></rect>
<rect id="Rectangle-171" transform="translate(15.121320, 5.121320) rotate(-315.000000) translate(-15.121320, -5.121320) " x="14.6213203" y="2.62132034" width="1" height="5"></rect>
</g>
</g>
</g>
</svg>
</div>
<div class="display-inlineBlock padding-s">
<svg width="24px" height="24px" viewBox="0 0 24 24">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="#27313C">
<g transform="translate(4.000000, 2.000000)">
<path d="M0,10.0085302 C0,8.8992496 0.894513756,8 1.99406028,8 L14.0059397,8 C15.1072288,8 16,8.90195036 16,10.0085302 L16,17.9914698 C16,19.1007504 15.1054862,20 14.0059397,20 L1.99406028,20 C0.892771196,20 0,19.0980496 0,17.9914698 L0,10.0085302 Z M1,9.99539757 C1,9.44565467 1.44994876,9 2.00684547,9 L13.9931545,9 C14.5492199,9 15,9.4556644 15,9.99539757 L15,18.0046024 C15,18.5543453 14.5500512,19 13.9931545,19 L2.00684547,19 C1.45078007,19 1,18.5443356 1,18.0046024 L1,9.99539757 Z" id="Combined-Shape"></path>
<path d="M13,5 C13,2.23857625 10.7614237,0 8,0 C5.23857625,0 3,2.23857625 3,5 L4,5 C4,2.790861 5.790861,1 8,1 C10.209139,1 12,2.790861 12,5 L13,5 Z M3,5 L4,5 L4,8 L3,8 L3,5 Z M12,5 L13,5 L13,8 L12,8 L12,5 Z" id="Combined-Shape"></path>
<path d="M11,5 C11,3.34314575 9.65685425,2 8,2 C6.34314575,2 5,3.34314575 5,5 L6,5 C6,3.8954305 6.8954305,3 8,3 C9.1045695,3 10,3.8954305 10,5 L11,5 Z M5,5 L6,5 L6,9 L5,9 L5,5 Z M10,5 L11,5 L11,9 L10,9 L10,5 Z" id="Combined-Shape"></path>
</g>
</g>
</g>
</svg>
</div>
<div class="display-inlineBlock padding-s">
<svg width="24px" height="24px" viewBox="0 0 24 24">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="#27313C">
<g transform="translate(2.000000, 7.000000)">
<path d="M0,1.99961498 C0,0.895258123 0.898212381,0 1.99079514,0 L18.0092049,0 C19.1086907,0 20,0.88743329 20,1.99961498 L20,8.00038502 C20,9.10474188 19.1017876,10 18.0092049,10 L1.99079514,10 C0.891309342,10 0,9.11256671 0,8.00038502 L0,1.99961498 Z M1,1.99703014 C1,1.4463856 1.44494629,1 1.99339768,1 L18.0066023,1 C18.5552407,1 19,1.45303631 19,1.99703014 L19,8.00296986 C19,8.5536144 18.5550537,9 18.0066023,9 L1.99339768,9 C1.44475929,9 1,8.54696369 1,8.00296986 L1,1.99703014 Z" id="Frame"></path>
</g>
</g>
</g>
</svg>
</div>
<div class="display-inlineBlock padding-s">
<svg width="24px" height="24px" viewBox="0 0 24 24">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="#27313C">
<g transform="translate(2.000000, 7.000000)">
<path d="M0,1.99961498 C0,0.895258123 0.898212381,0 1.99079514,0 L18.0092049,0 C19.1086907,0 20,0.88743329 20,1.99961498 L20,8.00038502 C20,9.10474188 19.1017876,10 18.0092049,10 L1.99079514,10 C0.891309342,10 0,9.11256671 0,8.00038502 L0,1.99961498 Z M1,1.99703014 C1,1.4463856 1.44494629,1 1.99339768,1 L18.0066023,1 C18.5552407,1 19,1.45303631 19,1.99703014 L19,8.00296986 C19,8.5536144 18.5550537,9 18.0066023,9 L1.99339768,9 C1.44475929,9 1,8.54696369 1,8.00296986 L1,1.99703014 Z" id="Frame"></path>
<rect id="Cell" x="3" y="3" width="4" height="4"></rect>
</g>
</g>
</g>
</svg>
</div>
<div class="display-inlineBlock padding-s">
<svg width="24px" height="24px" viewBox="0 0 24 24">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="#27313C">
<g transform="translate(2.000000, 7.000000)">
<path d="M0,1.99961498 C0,0.895258123 0.898212381,0 1.99079514,0 L18.0092049,0 C19.1086907,0 20,0.88743329 20,1.99961498 L20,8.00038502 C20,9.10474188 19.1017876,10 18.0092049,10 L1.99079514,10 C0.891309342,10 0,9.11256671 0,8.00038502 L0,1.99961498 Z M1,1.99703014 C1,1.4463856 1.44494629,1 1.99339768,1 L18.0066023,1 C18.5552407,1 19,1.45303631 19,1.99703014 L19,8.00296986 C19,8.5536144 18.5550537,9 18.0066023,9 L1.99339768,9 C1.44475929,9 1,8.54696369 1,8.00296986 L1,1.99703014 Z" id="Frame"></path>
<rect id="Cell" x="3" y="3" width="4" height="4"></rect>
<rect id="Cell" x="8" y="3" width="4" height="4"></rect>
</g>
</g>
</g>
</svg>
</div>
<div class="display-inlineBlock padding-s">
<svg width="24px" height="24px" viewBox="0 0 24 24">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="#27313C">
<g transform="translate(2.000000, 7.000000)">
<path d="M0,1.99961498 C0,0.895258123 0.898212381,0 1.99079514,0 L18.0092049,0 C19.1086907,0 20,0.88743329 20,1.99961498 L20,8.00038502 C20,9.10474188 19.1017876,10 18.0092049,10 L1.99079514,10 C0.891309342,10 0,9.11256671 0,8.00038502 L0,1.99961498 Z M1,1.99703014 C1,1.4463856 1.44494629,1 1.99339768,1 L18.0066023,1 C18.5552407,1 19,1.45303631 19,1.99703014 L19,8.00296986 C19,8.5536144 18.5550537,9 18.0066023,9 L1.99339768,9 C1.44475929,9 1,8.54696369 1,8.00296986 L1,1.99703014 Z" id="Frame"></path>
<rect id="Cell" x="3" y="3" width="4" height="4"></rect>
<rect id="Cell" x="8" y="3" width="4" height="4"></rect>
<rect id="Cell" x="13" y="3" width="4" height="4"></rect>
</g>
</g>
</g>
</svg>
</div>
<div class="display-inlineBlock padding-s">
<svg width="24px" height="24px" viewBox="0 0 24 24">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="#160F0F">
<g transform="translate(2.000000, 2.000000)">
<path d="M10,20 C15.5228475,20 20,15.5228475 20,10 C20,4.4771525 15.5228475,0 10,0 C4.4771525,0 0,4.4771525 0,10 C0,15.5228475 4.4771525,20 10,20 Z M10,19 C14.9705627,19 19,14.9705627 19,10 C19,5.02943725 14.9705627,1 10,1 C5.02943725,1 1,5.02943725 1,10 C1,14.9705627 5.02943725,19 10,19 Z" id="Face"></path>
<circle id="Left-eye" cx="7" cy="7" r="1"></circle>
<circle id="Right-eye" cx="13" cy="7" r="1"></circle>
<rect id="Mouth" x="6" y="13" width="8" height="1" rx="0.5"></rect>
</g>
</g>
</g>
</svg>
</div>
<div class="display-inlineBlock padding-s">
<svg width="24px" height="24px" viewBox="0 0 24 24">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="#27313C">
<g transform="translate(3.000000, 3.000000)">
<path d="M0,1.99508929 C0,0.893231902 0.892622799,0 1.99508929,0 L16.0049107,0 C17.1067681,0 18,0.892622799 18,1.99508929 L18,16.0049107 C18,17.1067681 17.1073772,18 16.0049107,18 L1.99508929,18 C0.893231902,18 0,17.1073772 0,16.0049107 L0,1.99508929 Z M1,2.00087166 C1,1.4481055 1.44463086,1 2.00087166,1 L15.9991283,1 C16.5518945,1 17,1.44463086 17,2.00087166 L17,15.9991283 C17,16.5518945 16.5553691,17 15.9991283,17 L2.00087166,17 C1.4481055,17 1,16.5553691 1,15.9991283 L1,2.00087166 Z" id="Frame"></path>
<rect id="Rectangle" x="14" y="1" width="1" height="16"></rect>
<circle id="Knob" cx="3.5" cy="3.5" r="0.5"></circle>
<circle id="Knob" cx="5.5" cy="3.5" r="0.5"></circle>
<circle id="Knob" cx="7.5" cy="3.5" r="0.5"></circle>
<path d="M7.5,15 C9.98528137,15 12,12.9852814 12,10.5 C12,8.01471863 9.98528137,6 7.5,6 C5.01471863,6 3,8.01471863 3,10.5 C3,12.9852814 5.01471863,15 7.5,15 Z M7.5,14 C9.43299662,14 11,12.4329966 11,10.5 C11,8.56700338 9.43299662,7 7.5,7 C5.56700338,7 4,8.56700338 4,10.5 C4,12.4329966 5.56700338,14 7.5,14 Z" id="Door"></path>
<rect id="Handle" x="8" y="10" width="3" height="1"></rect>
</g>
</g>
</g>
</svg>
</div>
<div class="display-inlineBlock padding-s">
<svg width="24px" height="24px" viewBox="0 0 24 24">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="#27313C">
<g transform="translate(2.000000, 2.000000)">
<path d="M10,20 C15.5228475,20 20,15.5228475 20,10 C20,4.4771525 15.5228475,0 10,0 C4.4771525,0 0,4.4771525 0,10 C0,15.5228475 4.4771525,20 10,20 Z M10,19 C14.9705627,19 19,14.9705627 19,10 C19,5.02943725 14.9705627,1 10,1 C5.02943725,1 1,5.02943725 1,10 C1,14.9705627 5.02943725,19 10,19 Z" id="Combined-Shape"></path>
<rect id="Rectangle-383" transform="translate(10.071068, 10.071068) rotate(-45.000000) translate(-10.071068, -10.071068) " x="9.57106781" y="0.571067812" width="1" height="19" rx="0.5"></rect>
</g>
</g>
</g>
</svg>
</div>
<div class="display-inlineBlock padding-s">
<svg width="24px" height="24px" viewBox="0 0 24 24">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="#27313C">
<g transform="translate(2.000000, 4.000000)">
<path d="M0,1.99406028 C0,0.892771196 0.898212381,0 1.99079514,0 L18.0092049,0 C19.1086907,0 20,0.894513756 20,1.99406028 L20,14.0059397 C20,15.1072288 19.1017876,16 18.0092049,16 L1.99079514,16 C0.891309342,16 0,15.1054862 0,14.0059397 L0,1.99406028 Z M1,2.00684547 C1,1.45078007 1.44494629,1 1.99339768,1 L18.0066023,1 C18.5552407,1 19,1.44994876 19,2.00684547 L19,13.9931545 C19,14.5492199 18.5550537,15 18.0066023,15 L1.99339768,15 C1.44475929,15 1,14.5500512 1,13.9931545 L1,2.00684547 Z" id="Combined-Shape"></path>
<rect id="Rectangle-453" x="0" y="3" width="20" height="3"></rect>
</g>
</g>
</g>
</svg>
</div>
<div class="display-inlineBlock padding-s">
<svg width="24px" height="24px" viewBox="0 0 24 24">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="#27313C">
<g transform="translate(3.000000, 3.000000)">
<rect id="Ribbon" x="14" y="3" width="1" height="15" rx="0.5"></rect>
<rect id="Ribbon" x="0" y="3" width="15" height="1" rx="0.5"></rect>
<rect id="Ribbon" x="3" y="14" width="15" height="1" rx="0.5"></rect>
<rect id="Ribbon" x="3" y="0" width="1" height="15" rx="0.5"></rect>
</g>
</g>
</g>
</svg>
</div>
<div class="display-inlineBlock padding-s">
<svg width="24px" height="24px" viewBox="0 0 24 24">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="#27313C">
<g transform="translate(3.000000, 10.000000)">
<path d="M2,4 C3.1045695,4 4,3.1045695 4,2 C4,0.8954305 3.1045695,0 2,0 C0.8954305,0 0,0.8954305 0,2 C0,3.1045695 0.8954305,4 2,4 Z M2,3 C2.55228475,3 3,2.55228475 3,2 C3,1.44771525 2.55228475,1 2,1 C1.44771525,1 1,1.44771525 1,2 C1,2.55228475 1.44771525,3 2,3 Z" id="Combined-Shape"></path>
<path d="M9,4 C10.1045695,4 11,3.1045695 11,2 C11,0.8954305 10.1045695,0 9,0 C7.8954305,0 7,0.8954305 7,2 C7,3.1045695 7.8954305,4 9,4 Z M9,3 C9.55228475,3 10,2.55228475 10,2 C10,1.44771525 9.55228475,1 9,1 C8.44771525,1 8,1.44771525 8,2 C8,2.55228475 8.44771525,3 9,3 Z" id="Combined-Shape"></path>
<path d="M16,4 C17.1045695,4 18,3.1045695 18,2 C18,0.8954305 17.1045695,0 16,0 C14.8954305,0 14,0.8954305 14,2 C14,3.1045695 14.8954305,4 16,4 Z M16,3 C16.5522847,3 17,2.55228475 17,2 C17,1.44771525 16.5522847,1 16,1 C15.4477153,1 15,1.44771525 15,2 C15,2.55228475 15.4477153,3 16,3 Z" id="Combined-Shape"></path>
</g>
</g>
</g>
</svg>
</div>
<div class="display-inlineBlock padding-s">
<svg width="24px" height="24px" viewBox="0 0 24 24">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="#27313C">
<g transform="translate(10.000000, 3.000000)">
<path d="M2,4 C3.1045695,4 4,3.1045695 4,2 C4,0.8954305 3.1045695,0 2,0 C0.8954305,0 0,0.8954305 0,2 C0,3.1045695 0.8954305,4 2,4 Z M2,3 C2.55228475,3 3,2.55228475 3,2 C3,1.44771525 2.55228475,1 2,1 C1.44771525,1 1,1.44771525 1,2 C1,2.55228475 1.44771525,3 2,3 Z" id="Combined-Shape"></path>
<path d="M2,11 C3.1045695,11 4,10.1045695 4,9 C4,7.8954305 3.1045695,7 2,7 C0.8954305,7 0,7.8954305 0,9 C0,10.1045695 0.8954305,11 2,11 Z M2,10 C2.55228475,10 3,9.55228475 3,9 C3,8.44771525 2.55228475,8 2,8 C1.44771525,8 1,8.44771525 1,9 C1,9.55228475 1.44771525,10 2,10 Z" id="Combined-Shape"></path>
<path d="M2,18 C3.1045695,18 4,17.1045695 4,16 C4,14.8954305 3.1045695,14 2,14 C0.8954305,14 0,14.8954305 0,16 C0,17.1045695 0.8954305,18 2,18 Z M2,17 C2.55228475,17 3,16.5522847 3,16 C3,15.4477153 2.55228475,15 2,15 C1.44771525,15 1,15.4477153 1,16 C1,16.5522847 1.44771525,17 2,17 Z" id="Combined-Shape"></path>
</g>
</g>
</g>
</svg>
</div>
<div class="display-inlineBlock padding-s">
<svg width="24px" height="24px" viewBox="0 0 24 24">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="#27313C">
<g transform="translate(2.000000, 4.000000)">
<rect id="Rectangle-426" x="0" y="0" width="1" height="5" rx="0.5"></rect>
<rect id="Rectangle-426" x="0" y="0" width="5" height="1" rx="0.5"></rect>
<rect id="Rectangle-426" x="19" y="0" width="1" height="5" rx="0.5"></rect>
<rect id="Rectangle-426" x="15" y="0" width="5" height="1" rx="0.5"></rect>
<rect id="Rectangle-426" x="0" y="11" width="1" height="5" rx="0.5"></rect>
<rect id="Rectangle-426" x="0" y="15" width="5" height="1" rx="0.5"></rect>
<rect id="Rectangle-426" x="19" y="11" width="1" height="5" rx="0.5"></rect>
<rect id="Rectangle-426" x="15" y="15" width="5" height="1" rx="0.5"></rect>
</g>
</g>
</g>
</svg>
</div>
<div class="display-inlineBlock padding-s">
<svg width="24px" height="24px" viewBox="0 0 24 24">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="#27313C">
<g transform="translate(3.000000, 2.000000)">
<rect id="Ribbon" x="14" y="0" width="1" height="20" rx="0.5"></rect>
<rect id="Rectangle-383" x="0" y="2" width="4" height="1" rx="0.5"></rect>
<rect id="Rectangle-383" x="0" y="5" width="4" height="1" rx="0.5"></rect>
<rect id="Rectangle-383" x="0" y="8" width="4" height="1" rx="0.5"></rect>
<rect id="Rectangle-383" x="0" y="11" width="4" height="1" rx="0.5"></rect>
<rect id="Rectangle-383" x="0" y="14" width="4" height="1" rx="0.5"></rect>
<rect id="Rectangle-383" x="0" y="17" width="4" height="1" rx="0.5"></rect>
<path d="M2,1.99079514 C2,0.891309342 2.89451376,0 3.99406028,0 L16.0059397,0 C17.1072288,0 18,0.898212381 18,1.99079514 L18,18.0092049 C18,19.1086907 17.1054862,20 16.0059397,20 L3.99406028,20 C2.8927712,20 2,19.1017876 2,18.0092049 L2,1.99079514 Z M3,1.99339768 C3,1.44475929 3.44994876,1 4.00684547,1 L15.9931545,1 C16.5492199,1 17,1.44494629 17,1.99339768 L17,18.0066023 C17,18.5552407 16.5500512,19 15.9931545,19 L4.00684547,19 C3.45078007,19 3,18.5550537 3,18.0066023 L3,1.99339768 Z" id="Frame"></path>
</g>
</g>
</g>
</svg>
</div>
<div class="display-inlineBlock padding-s">
<svg width="24px" height="24px" viewBox="0 0 24 24">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="#160F0F">
<g transform="translate(2.000000, 2.000000)">
<circle id="Eye" cx="7" cy="7" r="1"></circle>
<circle id="Eye" cx="13" cy="7" r="1"></circle>
<path d="M10,16 C11.6568542,16 13,14.6568542 13,13 C13,11.3431458 11.6568542,10 10,10 C8.34314575,10 7,11.3431458 7,13 C7,14.6568542 8.34314575,16 10,16 Z M10,15 C11.1045695,15 12,14.1045695 12,13 C12,11.8954305 11.1045695,11 10,11 C8.8954305,11 8,11.8954305 8,13 C8,14.1045695 8.8954305,15 10,15 Z" id="Mouth"></path>
<path d="M10,20 C15.5228475,20 20,15.5228475 20,10 C20,4.4771525 15.5228475,0 10,0 C4.4771525,0 0,4.4771525 0,10 C0,15.5228475 4.4771525,20 10,20 Z M10,19 C14.9705627,19 19,14.9705627 19,10 C19,5.02943725 14.9705627,1 10,1 C5.02943725,1 1,5.02943725 1,10 C1,14.9705627 5.02943725,19 10,19 Z" id="Face"></path>
</g>
</g>
</g>
</svg>
</div>
<div class="display-inlineBlock padding-s">
<svg width="24px" height="24px" viewBox="0 0 24 24">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g fill="#27313C">
<g transform="translate(3.000000, 3.000000)">
<path d="M1,4 L17,4 L17,15.9941413 C17,17.1019465 16.1054862,18 15.0059397,18 L2.99406028,18 C1.8927712,18 1,17.1029399 1,15.9941413 L1,4 Z M2,5 L16,5 L16,15.9975267 C16,16.5511774 15.5500512,17 14.9931545,17 L3.00684547,17 C2.45078007,17 2,16.544239 2,15.9975267 L2,5 Z" id="Box"></path>
<path d="M0,0.999807492 C0,0.447629061 0.444946289,0 0.993397683,0 L17.0066023,0 C17.5552407,0 18,0.443716645 18,0.999807492 L18,5 L0,5 L0,0.999807492 Z M1,1 L17,1 L17,4 L1,4 L1,1 Z" id="Lid"></path>
<rect id="Handle" x="6" y="7" width="6" height="1"></rect>
</g>
</g>
</g>
</svg>
</div>
</div>
</body>
</html>