/css/colors.css

  1/***
  2
  3   colors.css v2.0.0
  4   http://clrs.cc
  5   @mrmrs
  6   MIT License
  7
  8***/
  9/*
 10
 11   SKINS
 12   - Backgrounds
 13   - Colors
 14   - Border colors
 15   - SVG fills
 16   - SVG Strokes
 17
 18*/
 19/* Backgrounds */
 20.bg-navy {
 21  background-color: #001F3F; }
 22
 23.bg-blue {
 24  background-color: #0074D9; }
 25
 26.bg-aqua {
 27  background-color: #7FDBFF; }
 28
 29.bg-teal {
 30  background-color: #39CCCC; }
 31
 32.bg-olive {
 33  background-color: #3D9970; }
 34
 35.bg-green {
 36  background-color: #2ECC40; }
 37
 38.bg-lime {
 39  background-color: #01FF70; }
 40
 41.bg-yellow {
 42  background-color: #FFDC00; }
 43
 44.bg-orange {
 45  background-color: #FF851B; }
 46
 47.bg-red {
 48  background-color: #FF4136; }
 49
 50.bg-fuchsia {
 51  background-color: #F012BE; }
 52
 53.bg-purple {
 54  background-color: #B10DC9; }
 55
 56.bg-maroon {
 57  background-color: #85144B; }
 58
 59.bg-white {
 60  background-color: #fff; }
 61
 62.bg-gray {
 63  background-color: #aaa; }
 64
 65.bg-silver {
 66  background-color: #ddd; }
 67
 68.bg-black {
 69  background-color: #111; }
 70
 71/* Colors */
 72.navy {
 73  color: #001F3F; }
 74
 75.blue {
 76  color: #0074D9; }
 77
 78.aqua {
 79  color: #7FDBFF; }
 80
 81.teal {
 82  color: #39CCCC; }
 83
 84.olive {
 85  color: #3D9970; }
 86
 87.green {
 88  color: #2ECC40; }
 89
 90.lime {
 91  color: #01FF70; }
 92
 93.yellow {
 94  color: #FFDC00; }
 95
 96.orange {
 97  color: #FF851B; }
 98
 99.red {
100  color: #FF4136; }
101
102.fuchsia {
103  color: #F012BE; }
104
105.purple {
106  color: #B10DC9; }
107
108.maroon {
109  color: #85144B; }
110
111.white {
112  color: #fff; }
113
114.silver {
115  color: #ddd; }
116
117.gray {
118  color: #aaa; }
119
120.black {
121  color: #111; }
122
123/* Border colors 
124
125   Use with another border utility that sets border-width and style 
126   i.e .border { border-width: 1px; border-style: solid; }     
127*/
128.border--navy {
129  border-color: #001F3F; }
130
131.border--blue {
132  border-color: #0074D9; }
133
134.border--aqua {
135  border-color: #7FDBFF; }
136
137.border--teal {
138  border-color: #39CCCC; }
139
140.border--olive {
141  border-color: #3D9970; }
142
143.border--green {
144  border-color: #2ECC40; }
145
146.border--lime {
147  border-color: #01FF70; }
148
149.border--yellow {
150  border-color: #FFDC00; }
151
152.border--orange {
153  border-color: #FF851B; }
154
155.border--red {
156  border-color: #FF4136; }
157
158.border--fuchsia {
159  border-color: #F012BE; }
160
161.border--purple {
162  border-color: #B10DC9; }
163
164.border--maroon {
165  border-color: #85144B; }
166
167.border--white {
168  border-color: #fff; }
169
170.border--gray {
171  border-color: #aaa; }
172
173.border--silver {
174  border-color: #ddd; }
175
176.border--black {
177  border-color: #111; }
178
179/* Fills for SVG */
180.fill-navy {
181  fill: #001F3F; }
182
183.fill-blue {
184  fill: #0074D9; }
185
186.fill-aqua {
187  fill: #7FDBFF; }
188
189.fill-teal {
190  fill: #39CCCC; }
191
192.fill-olive {
193  fill: #3D9970; }
194
195.fill-green {
196  fill: #2ECC40; }
197
198.fill-lime {
199  fill: #01FF70; }
200
201.fill-yellow {
202  fill: #FFDC00; }
203
204.fill-orange {
205  fill: #FF851B; }
206
207.fill-red {
208  fill: #FF4136; }
209
210.fill-fuchsia {
211  fill: #F012BE; }
212
213.fill-purple {
214  fill: #B10DC9; }
215
216.fill-maroon {
217  fill: #85144B; }
218
219.fill-white {
220  fill: #fff; }
221
222.fill-gray {
223  fill: #aaa; }
224
225.fill-silver {
226  fill: #ddd; }
227
228.fill-black {
229  fill: #111; }
230
231/* Strokes for SVG */
232.stroke-navy {
233  stroke: #001F3F; }
234
235.stroke-blue {
236  stroke: #0074D9; }
237
238.stroke-aqua {
239  stroke: #7FDBFF; }
240
241.stroke-teal {
242  stroke: #39CCCC; }
243
244.stroke-olive {
245  stroke: #3D9970; }
246
247.stroke-green {
248  stroke: #2ECC40; }
249
250.stroke-lime {
251  stroke: #01FF70; }
252
253.stroke-yellow {
254  stroke: #FFDC00; }
255
256.stroke-orange {
257  stroke: #FF851B; }
258
259.stroke-red {
260  stroke: #FF4136; }
261
262.stroke-fuchsia {
263  stroke: #F012BE; }
264
265.stroke-purple {
266  stroke: #B10DC9; }
267
268.stroke-maroon {
269  stroke: #85144B; }
270
271.stroke-white {
272  stroke: #fff; }
273
274.stroke-gray {
275  stroke: #aaa; }
276
277.stroke-silver {
278  stroke: #ddd; }
279
280.stroke-black {
281  stroke: #111; }