index.html 43.3 KB
Newer Older
Thomas Park's avatar
Thomas Park committed
1
2
3
4
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
XhmikosR's avatar
XhmikosR committed
5
6
    <title>Bootswatch: Free themes for Bootstrap</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
7
    <link rel="stylesheet" href="./flatly/bootstrap.css" media="screen">
Thomas Park's avatar
Thomas Park committed
8
9
    <link rel="stylesheet" href="./bower_components/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="./assets/css/bootswatch.min.css">
10
11
    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
12
13
      <script src="./bower_components/html5shiv/dist/html5shiv.js"></script>
      <script src="./bower_components/respond/dest/respond.min.js"></script>
14
    <![endif]-->
XhmikosR's avatar
XhmikosR committed
15
    <script>
Thomas Park's avatar
Thomas Park committed
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33

     var _gaq = _gaq || [];
      _gaq.push(['_setAccount', 'UA-23019901-1']);
      _gaq.push(['_setDomainName', "bootswatch.com"]);
        _gaq.push(['_setAllowLinker', true]);
      _gaq.push(['_trackPageview']);

     (function() {
       var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
       ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
       var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
     })();

    </script>
  </head>
  <body>
    <script src="./assets/js/bsa.js"></script>

Thomas Park's avatar
Thomas Park committed
34
    <div class="navbar navbar-default navbar-fixed-top">
Thomas Park's avatar
Thomas Park committed
35
      <div class="container">
Thomas Park's avatar
Thomas Park committed
36
37
38
39
40
41
42
43
44
        <div class="navbar-header">
          <a href="./" class="navbar-brand">Bootswatch</a>
          <button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#navbar-main">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
        </div>
        <div class="navbar-collapse collapse" id="navbar-main">
Thomas Park's avatar
Thomas Park committed
45
46
47
48
          <ul class="nav navbar-nav">
            <li class="dropdown">
              <a class="dropdown-toggle" data-toggle="dropdown" href="#" id="themes">Themes <span class="caret"></span></a>
              <ul class="dropdown-menu" aria-labelledby="themes">
Thomas Park's avatar
Thomas Park committed
49
                <li><a href="./default/">Default</a></li>
Thomas Park's avatar
Thomas Park committed
50
                <li class="divider"></li>
Thomas Park's avatar
Thomas Park committed
51
52
53
54
55
56
57
58
59
60
61
62
63
64
                <li><a href="./amelia/">Amelia</a></li>
                <li><a href="./cerulean/">Cerulean</a></li>
                <li><a href="./cosmo/">Cosmo</a></li>
                <li><a href="./cyborg/">Cyborg</a></li>
                <li><a href="./flatly/">Flatly</a></li>
                <li><a href="./journal/">Journal</a></li>
                <li><a href="./lumen/">Lumen</a></li>
                <li><a href="./readable/">Readable</a></li>
                <li><a href="./simplex/">Simplex</a></li>
                <li><a href="./slate/">Slate</a></li>
                <li><a href="./spacelab/">Spacelab</a></li>
                <li><a href="./superhero/">Superhero</a></li>
                <li><a href="./united/">United</a></li>
                <li><a href="./yeti/">Yeti</a></li>
Thomas Park's avatar
Thomas Park committed
65
66
              </ul>
            </li>
Thomas Park's avatar
Thomas Park committed
67
68
            <li>
              <a href="./help/">Help</a>
Thomas Park's avatar
Thomas Park committed
69
70
71
72
73
74
            </li>
            <li>
              <a href="http://news.bootswatch.com">Blog</a>
            </li>
          </ul>

Thomas Park's avatar
Thomas Park committed
75
          <ul class="nav navbar-nav navbar-right">
Thomas Park's avatar
Thomas Park committed
76
77
78
79
80
81
82
83
84
85
86
            <li><a href="http://builtwithbootstrap.com/" target="_blank">Built With Bootstrap</a></li>
            <li><a href="https://wrapbootstrap.com/?ref=bsw" target="_blank">WrapBootstrap</a></li>
          </ul>

        </div>
      </div>
    </div>

    <div class="splash">
      <div class="container">

Thomas Park's avatar
Thomas Park committed
87
88
        <div class="row">
          <div class="col-lg-12">
Chris Rebert's avatar
Chris Rebert committed
89
            <h1>Free themes for Bootstrap</h1>
Thomas Park's avatar
Thomas Park committed
90
91
            <div id="social">
              <span>
92
93
                <iframe id="gh-fork" src="http://ghbtns.com/github-btn.html?user=thomaspark&repo=bootswatch&type=fork" allowtransparency="true" frameborder="0" scrolling="0" width="53" height="20"></iframe>
                <iframe id="gh-star" src="http://ghbtns.com/github-btn.html?user=thomaspark&repo=bootswatch&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="110" height="20"></iframe>
Thomas Park's avatar
Thomas Park committed
94
95
96
97
98
99
              </span>
              <span>
                <a href="https://twitter.com/thomashpark" class="twitter-follow-button" data-show-count="false" data-show-screen-name="true">Follow @thomashpark</a>
                <a href="https://twitter.com/share" class="twitter-share-button" data-url="http://bootswatch.com" data-via="thomashpark">Tweet</a>
              </span>
            </div>
Thomas Park's avatar
Thomas Park committed
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
            <div class="col-lg-6 col-lg-offset-3">
              <div class="well sponsor" style="background-color: rgba(0, 0, 0, 0.4);">
                <a href="http://srv.buysellads.com/direct/click/track/yes/x/G6NDC27ICWAI627UCWALYK7UCKBILKJMCT7I5" rel="nofollow" target="_blank">
                  <span style="float: left; margin-right: 15px;">
                    <img src="http://srv.buysellads.com/direct/image/track/yes/x/G6NDC27ICWAI627UCWALYK7UCKBILKJMCT7I5" width="175" height="135">
                  </span>
                </a>
                <a href="http://srv.buysellads.com/direct/click/track/yes/x/G6NDC27ICWAI627UCWALYK7UCKBILKJMCT7I5" rel="nofollow" target="_blank">
                  <h4 style="margin-bottom: 0.4em;">Treehouse</h4>
                  <div class="clearfix">
                    <p>Learn Web Design, Coding, Mobile App Development &amp; More.</p>
                    <p>Start Learning for Free!</p>
                  </div>
                </a>
              </div>
Thomas Park's avatar
Thomas Park committed
115
            </div>
Thomas Park's avatar
Thomas Park committed
116
          </div>
Thomas Park's avatar
Thomas Park committed
117
118
119
120
121
122
123
124
125
        </div>

      </div>
    </div>

    <div class="section-tout">
      <div class="container">

        <div class="row">
Thomas Park's avatar
Thomas Park committed
126
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
127
            <h3><i class="fa fa-file-o"></i> Easy to Install</h3>
Thomas Park's avatar
Thomas Park committed
128
129
            <p>Simply download a CSS file and replace the one in Bootstrap. No messing around with hex values.</p>
          </div>
Thomas Park's avatar
Thomas Park committed
130
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
131
            <h3><i class="fa fa-github"></i> Open Source</h3>
Thomas Park's avatar
Thomas Park committed
132
            <p>Bootstrap themes are released under the MIT License and maintained by the community on <a target="_blank" href="https://github.com/thomaspark/bootswatch">GitHub</a>.</p>
Thomas Park's avatar
Thomas Park committed
133
          </div>
Thomas Park's avatar
Thomas Park committed
134
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
135
            <h3><i class="fa fa-wrench"></i> Tuned for 3.1.1</h3>
136
            <p>Themes are built for the latest version of Bootstrap. <a href="/2/">Version 2.3.2</a> and <a target="_blank" href="https://github.com/thomaspark/bootswatch/tags">others</a> are also available to download.</p>
Thomas Park's avatar
Thomas Park committed
137
          </div>
Thomas Park's avatar
Thomas Park committed
138
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
139
            <h3><i class="fa fa-cogs"></i> Modular</h3>
Thomas Park's avatar
Thomas Park committed
140
141
             <p>Changes are contained in just two LESS files, enabling modification and ensuring forward compatibility.</p>
          </div>
Thomas Park's avatar
Thomas Park committed
142
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
143
            <h3><i class="fa fa-cloud"></i> Get Plugged In</h3>
Thomas Park's avatar
Thomas Park committed
144
            <p>An <a href="./help/#api" onclick="pageTracker._link(this.href); return false;">API</a> is available for integrating with your platform. In use by <a href="http://320press.com/wpbs/" target="_blank">WPBS</a>, <a href="http://www.fusionleaf.com/" target="_blank">FusionLeaf</a>, <a href="http://yabdab.com/stacks/snaps/bootsnap/" target="_blank">BootSnap</a>, and others.</p>
Thomas Park's avatar
Thomas Park committed
145
          </div>
Thomas Park's avatar
Thomas Park committed
146
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
147
            <h3><i class="fa fa-bullhorn"></i> Stay Updated</h3>
XhmikosR's avatar
XhmikosR committed
148
            <p>Be notified about updates by subscribing via <a href="http://feeds.feedburner.com/bootswatch">RSS feed</a>, <a href="http://feedburner.google.com/fb/a/mailverify?uri=bootswatch&amp;loc=en_US">email</a>, or <a href="http://news.bootswatch.com" onclick="pageTracker._link(this.href); return false;">Tumblr</a>.</p>
Thomas Park's avatar
Thomas Park committed
149
150
          </div>
        </div>
Thomas Park's avatar
Thomas Park committed
151

Thomas Park's avatar
Thomas Park committed
152
153
154
155
156
157
158
      </div>
    </div>

    <div class="section-preview">
      <div class="container">
        <div class="row">

Thomas Park's avatar
Thomas Park committed
159
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
160
161
162
163
164
165
166
            <div class="preview">
              <div class="image">
                <a href="amelia/"><img src="amelia/thumbnail.png" class="img-responsive" alt="Amelia"></a>
              </div>
              <div class="options">
                <h3>Amelia</h3>
                <p>Sweet and cheery</p>
Thomas Park's avatar
Thomas Park committed
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
                <div class="btn-group"><a class="btn btn-info" href="amelia/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="amelia/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'amelia', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="amelia/bootstrap.min.css"
                      onClick="_gaq.push(['_trackEvent', 'bootswatch', 'amelia', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="amelia/bootstrap.css"
                      onClick="_gaq.push(['_trackEvent', 'bootswatch', 'amelia', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="amelia/variables.less"
                      onClick="_gaq.push(['_trackEvent', 'bootswatch', 'amelia', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="amelia/bootswatch.less"
                      onClick="_gaq.push(['_trackEvent', 'bootswatch', 'amelia', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
Thomas Park's avatar
Thomas Park committed
184
185
186
187
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
188
189

          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
190
191
192
193
194
195
            <div class="preview">
              <div class="image">
                <a href="cerulean/"><img src="cerulean/thumbnail.png" class="img-responsive" alt="Cerulean"></a>
              </div>
              <div class="options">
                <h3>Cerulean</h3>
Thomas Park's avatar
Thomas Park committed
196
                <p>A calm blue sky</p>
Thomas Park's avatar
Thomas Park committed
197
198
199
200
201
202
203
204
205
206
207
208
209
                <div class="btn-group"><a class="btn btn-info" href="cerulean/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="cerulean/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cerulean', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="cerulean/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cerulean', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="cerulean/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cerulean', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="cerulean/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cerulean', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="cerulean/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cerulean', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
Thomas Park's avatar
Thomas Park committed
210
211
212
213
214
                </div>
              </div>
            </div>
          </div>

Thomas Park's avatar
Thomas Park committed
215
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
216
217
218
219
220
221
            <div class="preview">
              <div class="image">
                <a href="cosmo/"><img class="img-responsive" src="cosmo/thumbnail.png" alt="Cosmo"></a>
              </div>
              <div class="options">
                <h3>Cosmo</h3>
Thomas Park's avatar
Thomas Park committed
222
223
224
225
226
227
228
229
230
231
232
233
234
235
                <p>An ode to Metro</p>
                <div class="btn-group"><a class="btn btn-info" href="cosmo/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="cosmo/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cosmo', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="cosmo/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cosmo', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="cosmo/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cosmo', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="cosmo/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cosmo', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="cosmo/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cosmo', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
Thomas Park's avatar
Thomas Park committed
236
237
238
239
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
240

241
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
242
243
244
245
246
247
            <div class="preview">
              <div class="image">
                <a href="cyborg/"><img class="img-responsive" src="cyborg/thumbnail.png" alt="Cyborg"></a>
              </div>
              <div class="options">
                <h3>Cyborg</h3>
Thomas Park's avatar
Thomas Park committed
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
                <p>Jet black and electric blue</p>
                <div class="btn-group"><a class="btn btn-info" href="cyborg/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="cyborg/bootstrap.min.css"
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cyborg', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="cyborg/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cyborg', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="cyborg/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cyborg', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="cyborg/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cyborg', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="cyborg/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cyborg', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
Thomas Park's avatar
Thomas Park committed
263
264
                </div>
              </div>
265
            </div>
Thomas Park's avatar
Thomas Park committed
266
          </div>
Thomas Park's avatar
Thomas Park committed
267
268

          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
269
270
271
272
273
274
            <div class="preview">
              <div class="image">
                <a href="flatly/"><img class="img-responsive" src="flatly/thumbnail.png" alt="Flatly"></a>
              </div>
              <div class="options">
                <h3>Flatly</h3>
Thomas Park's avatar
Thomas Park committed
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
                <p>Flat and modern</p>
                <div class="btn-group"><a class="btn btn-info" href="flatly/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="flatly/bootstrap.min.css"
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'flatly', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="flatly/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'flatly', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="flatly/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'flatly', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="flatly/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'flatly', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="flatly/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'flatly', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
Thomas Park's avatar
Thomas Park committed
290
291
292
293
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
294
295

          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
296
297
298
299
300
301
            <div class="preview">
              <div class="image">
                <a href="journal/"><img class="img-responsive" src="journal/thumbnail.png" alt="Journal"></a>
              </div>
              <div class="options">
                <h3>Journal</h3>
Thomas Park's avatar
Thomas Park committed
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
                <p>Crisp like a new sheet of paper</p>
                <div class="btn-group"><a class="btn btn-info" href="journal/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="journal/bootstrap.min.css"
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'journal', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="journal/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'journal', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="journal/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'journal', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="journal/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'journal', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="journal/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'journal', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
Thomas Park's avatar
Thomas Park committed
317
318
319
320
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
321

Thomas Park's avatar
Thomas Park committed
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
          <div class="col-lg-4 col-sm-6">
            <div class="preview">
              <div class="image">
                <a href="lumen/"><img src="lumen/thumbnail.png" class="img-responsive" alt="Lumen"></a>
              </div>
              <div class="options">
                <h3>Lumen</h3>
                <p>Light and shadow</p>
                <div class="btn-group"><a class="btn btn-info" href="lumen/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="lumen/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'lumen', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="lumen/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'lumen', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="lumen/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'lumen', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="lumen/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'lumen', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="lumen/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'lumen', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
                </div>
              </div>
            </div>
          </div>

348
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
349
350
351
352
353
354
            <div class="preview">
              <div class="image">
                <a href="readable/"><img class="img-responsive" src="readable/thumbnail.png" alt="Readable"></a>
              </div>
              <div class="options">
                <h3>Readable</h3>
Thomas Park's avatar
Thomas Park committed
355
356
357
358
359
360
361
362
363
364
365
366
367
368
                <p>Optimized for legibility</p>
                <div class="btn-group"><a class="btn btn-info" href="readable/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="readable/bootstrap.min.css"
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'readable', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="readable/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'readable', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="readable/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'readable', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="readable/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'readable', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="readable/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'readable', 'bootswatch.less']);">bootswatch.less</a></li>
Thomas Park's avatar
Thomas Park committed
369
370
371
372
373
374
375
376
377
378
379
380
381
                  </ul>
                </div>
              </div>
            </div>
          </div>

          <div class="col-lg-4 col-sm-6">
            <div class="preview">
              <div class="image">
                <a href="shamrock/"><img class="img-responsive" src="shamrock/thumbnail.png" alt="Shamrock"></a>
              </div>
              <div class="options">
                <h3>Shamrock</h3>
382
                <p>Luck of the Irish <span class="label label-warning">For March Only!</span></p>
Thomas Park's avatar
Thomas Park committed
383
384
385
386
387
388
389
390
391
392
393
394
395
                <div class="btn-group"><a class="btn btn-info" href="shamrock/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="shamrock/bootstrap.min.css"
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'shamrock', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="shamrock/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'shamrock', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="shamrock/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'shamrock', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="shamrock/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'shamrock', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="shamrock/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'shamrock', 'bootswatch.less']);">bootswatch.less</a></li>
Thomas Park's avatar
Thomas Park committed
396
                  </ul>
Thomas Park's avatar
Thomas Park committed
397
398
399
400
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
401
402

          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
403
404
405
406
407
408
            <div class="preview">
              <div class="image">
                <a href="simplex/"><img class="img-responsive" src="simplex/thumbnail.png" alt="Simplex"></a>
              </div>
              <div class="options">
                <h3>Simplex</h3>
Thomas Park's avatar
Thomas Park committed
409
410
411
                <p>Mini and minimalist</p>
                <div class="btn-group"><a class="btn btn-info" href="simplex/">Preview</a></div>
                <div class="btn-group">
Thomas Park's avatar
Thomas Park committed
412
                  <a class="btn btn-info" target="_blank" href="simplex/bootstrap.min.css"
Thomas Park's avatar
Thomas Park committed
413
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'simplex', 'bootstrap.min.css']);">Download</a>
Thomas Park's avatar
Thomas Park committed
414
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
Thomas Park's avatar
Thomas Park committed
415
416
417
418
419
420
421
422
423
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="simplex/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'simplex', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="simplex/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'simplex', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="simplex/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'simplex', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="simplex/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'simplex', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
Thomas Park's avatar
Thomas Park committed
424
425
426
427
                </div>
              </div>
            </div>
          </div>
428

Thomas Park's avatar
Thomas Park committed
429
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
430
431
432
433
434
435
            <div class="preview">
              <div class="image">
                <a href="slate/"><img class="img-responsive" src="slate/thumbnail.png" alt="Slate"></a>
              </div>
              <div class="options">
                <h3>Slate</h3>
Thomas Park's avatar
Thomas Park committed
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
                <p>Shades of gunmetal gray</p>
                <div class="btn-group"><a class="btn btn-info" href="slate/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="slate/bootstrap.min.css"
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'slate', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="slate/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'slate', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="slate/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'slate', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="slate/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'slate', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="slate/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'slate', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
Thomas Park's avatar
Thomas Park committed
451
452
453
454
455
                </div>

              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
456
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
457
458
459
460
461
462
            <div class="preview">
              <div class="image">
                <a href="spacelab/"><img class="img-responsive" src="spacelab/thumbnail.png" alt="Spacelab"></a>
              </div>
              <div class="options">
                <h3>Spacelab</h3>
Thomas Park's avatar
Thomas Park committed
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
                <p>Silvery and sleek</p>
                <div class="btn-group"><a class="btn btn-info" href="spacelab/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="spacelab/bootstrap.min.css"
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'spacelab', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="spacelab/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'spacelab', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="spacelab/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'spacelab', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="spacelab/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'spacelab', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="spacelab/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'spacelab', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
Thomas Park's avatar
Thomas Park committed
478
479
480
481
                </div>
              </div>
            </div>
          </div>
482

Thomas Park's avatar
Thomas Park committed
483
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
            <div class="preview">
              <div class="image">
                <a href="superhero/"><img class="img-responsive" src="superhero/thumbnail.png" alt="Superhero"></a>
              </div>
              <div class="options">
                <h3>Superhero</h3>
                <p>The brave and the blue</p>
                <div class="btn-group"><a class="btn btn-info" href="superhero/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="superhero/bootstrap.min.css"
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'superhero', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="superhero/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'superhero', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="superhero/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'superhero', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="superhero/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'superhero', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="superhero/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'superhero', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
                </div>
              </div>
            </div>
          </div>
509

Thomas Park's avatar
Thomas Park committed
510
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
511
512
            <div class="preview">
              <div class="image">
Thomas Park's avatar
Thomas Park committed
513
                <a href="united/"><img class="img-responsive" src="united/thumbnail.png" alt="United"></a>
Thomas Park's avatar
Thomas Park committed
514
515
              </div>
              <div class="options">
Thomas Park's avatar
Thomas Park committed
516
517
518
                <h3>United</h3>
                <p>Ubuntu orange and unique font</p>
                <div class="btn-group"><a class="btn btn-info" href="united/">Preview</a></div>
Thomas Park's avatar
Thomas Park committed
519
                <div class="btn-group">
Thomas Park's avatar
Thomas Park committed
520
521
                  <a class="btn btn-info" target="_blank" href="united/bootstrap.min.css"
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'united', 'bootstrap.min.css']);">Download</a>
Thomas Park's avatar
Thomas Park committed
522
523
524
525
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
Thomas Park's avatar
Thomas Park committed
526
527
                    <li><a target="_blank" href="united/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'united', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="united/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'united', 'bootstrap.css']);">bootstrap.css</a></li>
Thomas Park's avatar
Thomas Park committed
528
                    <li class="divider"></li>
Thomas Park's avatar
Thomas Park committed
529
530
                    <li><a target="_blank" href="united/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'united', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="united/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'united', 'bootswatch.less']);">bootswatch.less</a></li>
Thomas Park's avatar
Thomas Park committed
531
                  </ul>
Thomas Park's avatar
Thomas Park committed
532
533
534
                </div>
              </div>
            </div>
Thomas Park's avatar
Thomas Park committed
535
          </div>
536

Thomas Park's avatar
Thomas Park committed
537
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
538
539
            <div class="preview">
              <div class="image">
Thomas Park's avatar
Thomas Park committed
540
                <a href="yeti/"><img class="img-responsive" src="yeti/thumbnail.png" alt="Yeti"></a>
Thomas Park's avatar
Thomas Park committed
541
542
              </div>
              <div class="options">
Thomas Park's avatar
Thomas Park committed
543
544
545
                <h3>Yeti</h3>
                <p>A friendly foundation</p>
                <div class="btn-group"><a class="btn btn-info" href="yeti/">Preview</a></div>
Thomas Park's avatar
Thomas Park committed
546
                <div class="btn-group">
Thomas Park's avatar
Thomas Park committed
547
548
                  <a class="btn btn-info" target="_blank" href="yeti/bootstrap.min.css"
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'yeti', 'bootstrap.min.css']);">Download</a>
Thomas Park's avatar
Thomas Park committed
549
550
551
552
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
Thomas Park's avatar
Thomas Park committed
553
554
                    <li><a target="_blank" href="yeti/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'yeti', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="yeti/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'yeti', 'bootstrap.css']);">bootstrap.css</a></li>
Thomas Park's avatar
Thomas Park committed
555
                    <li class="divider"></li>
Thomas Park's avatar
Thomas Park committed
556
557
                    <li><a target="_blank" href="yeti/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'yeti', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="yeti/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'yeti', 'bootswatch.less']);">bootswatch.less</a></li>
Thomas Park's avatar
Thomas Park committed
558
                  </ul>
Thomas Park's avatar
Thomas Park committed
559
560
561
562
563
564
565
566
567
568
569
570
                </div>
              </div>
            </div>
          </div>


        </div>
      </div>


      <div class="container">
        <div class="row">
Thomas Park's avatar
Thomas Park committed
571

Thomas Park's avatar
Thomas Park committed
572
573
          <div class="col-lg-12">
            <h1>Want more?</h1>
574
            <p class="lead">Check out my personal faves from the paid templates at <a target="_blank" href="https://wrapbootstrap.com/?ref=bsw" title="Marketplace for premium Bootstrap templates" onclick="_gaq.push(['_trackEvent', 'click', 'outbound', 'wrapbootstrap']);">WrapBootstrap</a>.</p>
Thomas Park's avatar
Thomas Park committed
575
          </div>
576

Thomas Park's avatar
Thomas Park committed
577
          <div class="col-lg-4 col-sm-4">
Thomas Park's avatar
Thomas Park committed
578
579
            <div class="preview">
              <div class="image">
580
                <a target="_blank" href="http://wrapbootstrap.com/preview/WB0412697?ref=bsw"><img class="img-responsive" src="https://s3.amazonaws.com/wrapbootstrap/live/products/icons/WB0412697.jpg" alt="Front Row"></a>
Thomas Park's avatar
Thomas Park committed
581
582
              </div>
              <div class="options">
583
584
585
                <h3>Unify</h3>
                <p>A fresh, fully-responsive design</p>
                <div class="btn-group"><a class="btn btn-info" target="_blank" href="http://wrapbootstrap.com/preview/WB0412697?ref=bsw">Preview</a></div>
Thomas Park's avatar
Thomas Park committed
586
                <div class="btn-group">
587
588
                  <a class="btn btn-info" target="_blank" href="https://wrapbootstrap.com/theme/unify-responsive-website-template-WB0412697?ref=bsw"
                  onClick="_gaq.push(['_trackEvent', 'click', 'outbound', 'wrapbootstrap-unify']);">Info</a>
Thomas Park's avatar
Thomas Park committed
589
590
591
592
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
593
594

          <div class="col-lg-4 col-sm-4">
Thomas Park's avatar
Thomas Park committed
595
596
            <div class="preview">
              <div class="image">
597
                <a target="_blank" href="http://wrapbootstrap.com/preview/WB02634G3?ref=bsw"><img class="img-responsive" src="https://s3.amazonaws.com/wrapbootstrap/live/products/600x375/WB02634G3.png" alt="Clean Canvas"></a>
Thomas Park's avatar
Thomas Park committed
598
599
              </div>
              <div class="options">
600
601
602
                <h3>Clean Canvas</h3>
                <p>A beautiful showcase for your works</p>
                <div class="btn-group"><a class="btn btn-info" target="_blank" href="http://wrapbootstrap.com/preview/WB02634G3?ref=bsw">Preview</a></div>
Thomas Park's avatar
Thomas Park committed
603
                <div class="btn-group">
604
605
                  <a class="btn btn-info" target="_blank" href="https://wrapbootstrap.com/theme/clean-canvas-business-theme-WB02634G3?ref=bsw"
                  onClick="_gaq.push(['_trackEvent', 'click', 'outbound', 'wrapbootstrap-cleancanvas']);">Info</a>
Thomas Park's avatar
Thomas Park committed
606
607
608
609
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
610
611

          <div class="col-lg-4 col-sm-4">
Thomas Park's avatar
Thomas Park committed
612
613
614
615
616
617
            <div class="preview">
              <div class="image">
                <a target="_blank" class="img-responsive" href="http://wrapbootstrap.com/preview/WB00U99JJ?ref=bsw"><img class="img-responsive" src="https://s3.amazonaws.com/wrapbootstrap/live/products/600x375/WB00U99JJ.png" alt="Clean Canvas"></a>
              </div>
              <div class="options">
                <h3>Base Admin</h3>
Thomas Park's avatar
Thomas Park committed
618
619
620
621
622
                <p>A polished template for an admin dashboard</p>
                <div class="btn-group"><a class="btn btn-info" target="_blank" href="http://wrapbootstrap.com/preview/WB00U99JJ?ref=bsw">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="https://wrapbootstrap.com/theme/base-admin-WB00U99JJ?ref=bsw"
                  onClick="_gaq.push(['_trackEvent', 'click', 'outbound', 'wrapbootstrap-baseadmin']);">Info</a>
Thomas Park's avatar
Thomas Park committed
623
624
625
626
627
                </div>
              </div>
            </div>
          </div>

Thomas Park's avatar
Thomas Park committed
628
        </div>
Thomas Park's avatar
Thomas Park committed
629
630
631
632

        <div class="row">
          <div class="col-lg-12">
            <h1>Still looking?</h1>
Thomas Park's avatar
Thomas Park committed
633
            <p class="lead">Learn to code your own themes with these books from <a target="_blank" href="http://www.amazon.com/?tag=bootswatch-20">Amazon</a>.</p>
Thomas Park's avatar
Thomas Park committed
634
          </div>
Thomas Park's avatar
Thomas Park committed
635
          <div class="col-lg-4 col-sm-4">
Thomas Park's avatar
Thomas Park committed
636
637
            <div class="preview">
              <div class="image">
XhmikosR's avatar
XhmikosR committed
638
                <a onClick="_gaq.push(['_trackEvent', 'refs', 'amazon', 'htmlandcss']);" href="http://www.amazon.com/gp/product/1118008189/ref=as_li_tf_tl?ie=UTF8&amp;tag=bootswatch-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=1118008189" target="_blank"><img class="img-responsive" src="assets/img/refs/htmlandcss.png" alt="HTML and CSS: Design and Build Websites, by Jon Duckett"></a>
Thomas Park's avatar
Thomas Park committed
639
640
641
642
643

              </div>
              <div class="options">
                <h3>HTML &amp; CSS</h3>
                <p>Jon Duckett</p>
Thomas Park's avatar
Thomas Park committed
644
                <div>
XhmikosR's avatar
XhmikosR committed
645
646
                  <img src="http://www.assoc-amazon.com/e/ir?t=bootswatch-20&amp;l=as2&amp;o=1&amp;a=1118008189" width="1" height="1" alt="" style="border:none !important; margin:0px !important; height: 1px;" />
                  <div class="btn-group"><a class="btn btn-info" onClick="_gaq.push(['_trackEvent', 'refs', 'amazon', 'htmlandcss']);" href="http://www.amazon.com/gp/product/1118008189/ref=as_li_tf_tl?ie=UTF8&amp;tag=bootswatch-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=1118008189" target="_blank">Amazon</a></div>
Thomas Park's avatar
Thomas Park committed
647
648
649
650
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
651
          <div class="col-lg-4 col-sm-4">
Thomas Park's avatar
Thomas Park committed
652
653
            <div class="preview">
              <div class="image">
654

XhmikosR's avatar
XhmikosR committed
655
                <a onClick="_gaq.push(['_trackEvent', 'refs', 'amazon', 'lesscss']);" href="http://www.amazon.com/gp/product/178216376X/ref=as_li_tf_tl?ie=UTF8&amp;tag=bootswatch-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=178216376X" target="_blank"><img class="img-responsive" src="assets/img/refs/lesscss.jpg" alt="Instant LESS CSS Preprocessor How-to, by Alex Libby"></a>
Thomas Park's avatar
Thomas Park committed
656
657
658

              </div>
              <div class="options">
659

Thomas Park's avatar
Thomas Park committed
660
661
                <h3>Instant LESS</h3>
                <p>Alex Libby</p>
Thomas Park's avatar
Thomas Park committed
662
                <div>
XhmikosR's avatar
XhmikosR committed
663
664
                  <img src="http://www.assoc-amazon.com/e/ir?t=bootswatch-20&amp;l=as2&amp;o=1&amp;a=1449399029" width="1" height="1" alt="" style="border:none !important; margin:0px !important; height: 1px;" />
                  <div class="btn-group"><a class="btn btn-info" onClick="_gaq.push(['_trackEvent', 'refs', 'amazon', 'lesscss']);" href="http://www.amazon.com/gp/product/178216376X/ref=as_li_tf_tl?ie=UTF8&amp;tag=bootswatch-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=178216376X" target="_blank">Amazon</a></div>
Thomas Park's avatar
Thomas Park committed
665
666
667
668
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
669
          <div class="col-lg-4 col-sm-4">
Thomas Park's avatar
Thomas Park committed
670
671
            <div class="preview">
              <div class="image">
672

XhmikosR's avatar
XhmikosR committed
673
                <a onClick="_gaq.push(['_trackEvent', 'refs', 'amazon', 'beautifulwebdesign']);" href="http://www.amazon.com/gp/product/098057689X/ref=as_li_tf_tl?ie=UTF8&amp;tag=bootswatch-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=098057689X" target="_blank"><img class="img-responsive" src="assets/img/refs/beautifulwebdesign.png" alt="The Principles of Beautiful Web Design, by Jason Beaird"></a>
Thomas Park's avatar
Thomas Park committed
674
675
676

              </div>
              <div class="options">
677

Thomas Park's avatar
Thomas Park committed
678
679
                <h3>Beautiful Web Design</h3>
                <p>Jason Beaird</p>
Thomas Park's avatar
Thomas Park committed
680
                <div>
XhmikosR's avatar
XhmikosR committed
681
682
                  <img src="http://www.assoc-amazon.com/e/ir?t=bootswatch-20&amp;l=as2&amp;o=1&amp;a=098057689X" width="1" height="1" alt="" style="border:none !important; margin:0px !important; height: 1px;" />
                  <div class="btn-group"><a class="btn btn-info" onClick="_gaq.push(['_trackEvent', 'refs', 'amazon', 'beautifulwebdesign']);" href="http://www.amazon.com/gp/product/098057689X/ref=as_li_tf_tl?ie=UTF8&amp;tag=bootswatch-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=098057689X" target="_blank">Amazon</a></div>
Thomas Park's avatar
Thomas Park committed
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
                </div>
              </div>
            </div>
          </div>
        </div>



      </div>
    </div>

    <div class="container">
      <footer>
        <div class="row">
          <div class="col-lg-12">
698

Thomas Park's avatar
Thomas Park committed
699
700
701
702
703
704
            <ul class="list-unstyled">
              <li class="pull-right"><a href="#top">Back to top</a></li>
              <li><a href="http://news.bootswatch.com" onclick="pageTracker._link(this.href); return false;">Blog</a></li>
              <li><a href="http://feeds.feedburner.com/bootswatch">RSS</a></li>
              <li><a href="https://twitter.com/thomashpark">Twitter</a></li>
              <li><a href="https://github.com/thomaspark/bootswatch/">GitHub</a></li>
705
              <li><a href="./help/#api">API</a></li>
Thomas Park's avatar
Thomas Park committed
706
707
              <li><a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&amp;hosted_button_id=F22JEM3Q78JC2">Donate</a></li>
            </ul>
Thomas Park's avatar
Thomas Park committed
708
            <p>Made by <a href="http://thomaspark.me" rel="nofollow">Thomas Park</a>. Contact him at <a href="mailto:thomas@bootswatch.com">thomas@bootswatch.com</a>.</p>
Thomas Park's avatar
Thomas Park committed
709
            <p>Code released under the <a href="https://github.com/thomaspark/bootswatch/blob/gh-pages/LICENSE">MIT License</a>.</p>
Thomas Park's avatar
Thomas Park committed
710
            <p>Based on <a href="http://getbootstrap.com" rel="nofollow">Bootstrap</a>. Icons from <a href="http://fortawesome.github.io/Font-Awesome/" rel="nofollow">Font Awesome</a>. Web fonts from <a href="http://www.google.com/webfonts" rel="nofollow">Google</a>.</p>
Thomas Park's avatar
Thomas Park committed
711
712
713

          </div>
        </div>
714

Thomas Park's avatar
Thomas Park committed
715
      </footer>
716

Thomas Park's avatar
Thomas Park committed
717
718
719
720

    </div>


721
    <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
Thomas Park's avatar
Thomas Park committed
722
723
    <script src="./bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
    <script src="./assets/js/bootswatch.js"></script>
XhmikosR's avatar
XhmikosR committed
724
    <script>
Thomas Park's avatar
Thomas Park committed
725
726
727
      !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");
    </script>
  </body>
Graham Campbell's avatar
Tweaks    
Graham Campbell committed
728
</html>