index.html 17.4 KB
Newer Older
1
<!DOCTYPE html>
Thomas Park's avatar
Thomas Park committed
2
3
4
5
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Bootswatch: Themed swatches for Twitter Bootstrap</title>
6

Thomas Park's avatar
Thomas Park committed
7
8
9
10
    <!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
11

Thomas Park's avatar
Thomas Park committed
12
13
    <!-- Le styles -->
    <link href="css/bootstrap.css" rel="stylesheet">
Thomas Park's avatar
Thomas Park committed
14
    <link href="css/bootswatch.css" rel="stylesheet">
Thomas Park's avatar
Thomas Park committed
15
16
17
18

	<script type="text/javascript">

	  var _gaq = _gaq || [];
Thomas Park's avatar
Thomas Park committed
19
		  _gaq.push(['_setAccount', 'UA-23019901-1']);
Thomas Park's avatar
Thomas Park committed
20
		  _gaq.push(['_setDomainName', "bootswatch.com"]);
Thomas Park's avatar
Thomas Park committed
21
22
  		  _gaq.push(['_setAllowLinker', true]);
		  _gaq.push(['_trackPageview']);
Thomas Park's avatar
Thomas Park committed
23
24
25
26
27
28

	  (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);
	  })();
29

Thomas Park's avatar
Thomas Park committed
30
	</script>
Thomas Park's avatar
Thomas Park committed
31
	
Thomas Park's avatar
Thomas Park committed
32
33
34
35
36
37
38
39
40
41
42
  </head>

  <body>
    <div class="navbar navbar-fixed-top">
      <div class="navbar-inner">
        <div class="container">
			<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
	            <span class="icon-bar"></span>
	            <span class="icon-bar"></span>
	            <span class="icon-bar"></span>
			</a>
Thomas Park's avatar
Thomas Park committed
43
          <a class="brand" href="./">Bootswatch</a>
Thomas Park's avatar
Thomas Park committed
44
45
46
47
48
49
          <div class="nav-collapse">
            <ul class="nav">
              <li><a id="swatch-link" href="#swatches">The Swatches</a></li>
		       <li class="dropdown">
		         <a class="dropdown-toggle" data-toggle="dropdown" href="#">Preview <b class="caret"></b></a>
		         <ul class="dropdown-menu">
Thomas Park's avatar
Thomas Park committed
50
		           <li><a href="default">Default</a></li>
Thomas Park's avatar
Thomas Park committed
51
		           <li class="divider"></li>
Thomas Park's avatar
Thomas Park committed
52
		           <li><a href="cerulean">Cerulean</a></li>
Thomas Park's avatar
Thomas Park committed
53
	           	   <li><a href="cyborg">Cyborg</a></li>
Thomas Park's avatar
Thomas Park committed
54
		           <li><a href="journal">Journal</a></li>
Thomas Park's avatar
Thomas Park committed
55
56
57
		           <li><a href="simplex">Simplex</a></li>
		           <li><a href="spacelab">Spacelab</a></li>
		           <li><a href="united">United</a></li>
Thomas Park's avatar
Thomas Park committed
58
59
60
61
62
63
		         </ul>
		       </li>
            </ul>
          </div><!--/.nav-collapse -->
        </div>
      </div>
64
65
    </div>

Thomas Park's avatar
Thomas Park committed
66
    <div class="container">
67
68
69
		
		<div class="alert alert-info">
			
70
71
			<p><strong>18 Feb:</strong> Added a swatchmaker, available on <a target="_blank" href="https://github.com/thomaspark/bootswatch/">GitHub</a>.</p>
						
Thomas Park's avatar
Thomas Park committed
72
			<p><strong>17 Feb:</strong> Updated to the <a target="_blank" href="http://www.markdotto.com/2012/02/17/bootstrap-2-0-1-released/">newly released</a> Bootstrap 2.0.1. Previous versions can be downloaded from <a target="_blank" href="https://github.com/thomaspark/bootswatch/downloads">GitHub</a>.</p>
73
			
Thomas Park's avatar
Thomas Park committed
74
			<p><strong>16 Feb:</strong> Follow the <a target="_blank" href="http://feeds.feedburner.com/bootswatch">RSS feed</a> or the <a target="_blank" href="http://feedburner.google.com/fb/a/mailverify?uri=bootswatch&loc=en_US">email list</a> to get notified when new swatches are released.</p>
75
			
Thomas Park's avatar
Thomas Park committed
76
			<p><strong>14 Feb:</strong> Visit the <a target="_blank" onclick="pageTracker._link(this.href); return false;" href=" http://thomaspark.me/2012/02/introducing-bootswatch/">blog post</a> that discusses Bootswatch in more detail.</p>
77
78
79
			
		</div>
	
Thomas Park's avatar
Thomas Park committed
80
81
82
83
84
85
86
87
88
89
90
91
92
      <!-- Main hero unit for a primary marketing message or call to action -->
      <div class="hero-unit">
        <h1>Bootswatch</h1>
        <p>Add color to your <a target="_blank" href="http://twitter.github.com/bootstrap/">Bootstrap</a> site without touching a color picker.</p>
		
        <div id="social">
  	      <div class="span4 offset1">
  			<iframe src="http://markdotto.github.com/github-buttons/github-btn.html?user=thomaspark&repo=bootswatch&type=watch&count=true"
  			  allowtransparency="true" frameborder="0" scrolling="0" width="110px" height="20px"></iframe>
			<iframe src="http://markdotto.github.com/github-buttons/github-btn.html?user=thomaspark&repo=bootswatch&type=fork"
			    allowtransparency="true" frameborder="0" scrolling="0" width="53px" height="20px"></iframe>		
  		  </div>
          <div class="span4 offset1">
Thomas Park's avatar
Thomas Park committed
93
  			<a href="https://twitter.com/thomashpark" class="twitter-follow-button" data-show-count="false" data-show-screen-name="true">Follow @thomashpark</a>
Thomas Park's avatar
Thomas Park committed
94
  			<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://bootswatch.com" data-via="thomashpark">Tweet</a>
Thomas Park's avatar
Thomas Park committed
95
96
97
98
99
  		  </div>
  	    </div>	
      </div>

      <!-- Example row of columns -->
Thomas Park's avatar
Thomas Park committed
100
      <div class="row about">
Thomas Park's avatar
Thomas Park committed
101
102
103
104
105
106
107
108
109
110
111
        <div class="span4">
          <img src="img/glyphicons_036_file.png">
		  <h3>Easy to Install</h3>
          <p>Simply download the CSS file from the swatch of your choice and replace the one in Bootstrap. No messing around with hex values.</p>
       </div>
        <div class="span4">
		  <img src="img/glyphicons_009_magic.png">
          <h3>Whole New Feel</h3>
          <p>We've all been there with the black bar and blue buttons. See how a splash of color and typography can transform the feel of your site.</p>
        </div>
        <div class="span4">
Thomas Park's avatar
Thomas Park committed
112
          <img src="img/glyphicons_050_link.png">
113
114
		  <h3>Tested for 2.0.1</h3>
          <p>Swatches are built for and tested with the latest version of Bootstrap. <a target="_blank" href="https://github.com/thomaspark/bootswatch/downloads">Previous versions</a> are also available for download.</p>
Thomas Park's avatar
Thomas Park committed
115
116
117
118
119
120
121
       </div>
      </div>
	  
      <div class="row about">
        <div class="span4">
		  <img src="img/glyphicons_341_github.png">
          <h3>Open Source</h3>
122
          <p>Licensed under Apache 2.0 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
123
124
125
126
127
128
129
130
131
132
        </div>
         <div class="span4">
           <img src="img/glyphicons_025_binoculars.png">
  	  <h3>Modular</h3>
           <p>Changes are contained in just two LESS files, enabling modification and ensuring forward compatibility.</p>
         </div>
		
        <div class="span4">
          <img src="img/glyphicons_032_wifi_alt.png">
		  <h3>Stay Updated</h3>
Thomas Park's avatar
Thomas Park committed
133
          <p>Be notified when new swatches are released by subscribing to the <a target="_blank" href="http://feeds.feedburner.com/bootswatch">RSS feed</a> or <a target="_blank" href="http://feedburner.google.com/fb/a/mailverify?uri=bootswatch&loc=en_US">email list</a>.</p>
Thomas Park's avatar
Thomas Park committed
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
        </div>
      </div>
	  
	  <div class="row">
		  <div class="span12">
		  	  <h1 id="swatches">The Swatches</h1>
			  <ul class="thumbnails">


			    <li class="span4">
			      <div class="thumbnail">
			        <img src="cerulean/thumbnail.png" alt="">
			        <div class="caption">
			          <h3>Cerulean</h3>
			          <p>A calm, blue sky.</p>
			          <div class="btn-toolbar">
Thomas Park's avatar
Thomas Park committed
150
						<div class="btn-group"><a class="btn btn-large" href="cerulean">Preview</a></div>
Thomas Park's avatar
Thomas Park committed
151
						<div class="btn-group">
Thomas Park's avatar
Thomas Park committed
152
						  <a class="btn btn-large btn-primary" target="_blank" href="cerulean/bootstrap.min.css"
Thomas Park's avatar
Thomas Park committed
153
154
155
156
157
158
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cerulean', 'bootstrap.min.css']);">Download</a>
						  <a class="btn btn-large btn-primary dropdown-toggle" data-toggle="dropdown" href="#">
						    <span class="caret"></span>
						  </a>
						  <ul class="dropdown-menu">
						    <!-- dropdown menu links -->
Thomas Park's avatar
Thomas Park committed
159
							<li><a target="_blank" href="cerulean/bootstrap.min.css" 
Thomas Park's avatar
Thomas Park committed
160
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cerulean', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
Thomas Park's avatar
Thomas Park committed
161
							<li><a target="_blank" href="cerulean/bootstrap.css"
Thomas Park's avatar
Thomas Park committed
162
163
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cerulean', 'bootstrap.css']);">bootstrap.css</a></li>
							<li class="divider"></li>
Thomas Park's avatar
Thomas Park committed
164
  							<li><a target="_blank" href="cerulean/variables.less"
Thomas Park's avatar
Thomas Park committed
165
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cerulean', 'variables.less']);">variables.less</a></li>
Thomas Park's avatar
Thomas Park committed
166
  							<li><a target="_blank" href="cerulean/bootswatch.less"
Thomas Park's avatar
Thomas Park committed
167
168
169
170
171
172
173
174
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cerulean', 'bootswatch.less']);">bootswatch.less</a></li>
						  </ul>
						</div>
					</div>
			        </div>
			      </div>
			    </li>

Thomas Park's avatar
Thomas Park committed
175

Thomas Park's avatar
Thomas Park committed
176
177
178
179
180
181
182
183
184
			    <li class="span4">
			      <div class="thumbnail">
			        <img src="cyborg/thumbnail.png" alt="">
			        <div class="caption">
			          <h3>Cyborg</h3>
			          <p>Jet black and electric blue.</p>
			          <div class="btn-toolbar">
						<div class="btn-group"><a class="btn btn-large" href="cyborg">Preview</a></div>
						<div class="btn-group">
Thomas Park's avatar
Thomas Park committed
185
						  <a class="btn btn-large btn-primary" target="_blank" href="cyborg/bootstrap.min.css"
Thomas Park's avatar
Thomas Park committed
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cyborg', 'bootstrap.min.css']);">Download</a>
						  <a class="btn btn-large btn-primary dropdown-toggle" data-toggle="dropdown" href="#">
						    <span class="caret"></span>
						  </a>
						  <ul class="dropdown-menu">
						    <!-- dropdown menu links -->
							<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>
						</div>
					</div>
			        </div>
			      </div>
			    </li>



Thomas Park's avatar
Thomas Park committed
210
211
212
213
214
			    <li class="span4">
			      <div class="thumbnail">
			        <img src="journal/thumbnail.png" alt="">
			        <div class="caption">
			          <h3>Journal</h3>
Thomas Park's avatar
Thomas Park committed
215
			          <p>Crisp like a new sheet of paper.</p>
Thomas Park's avatar
Thomas Park committed
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
			          <div class="btn-toolbar">
						<div class="btn-group"><a class="btn btn-large" href="journal">Preview</a></div>
						<div class="btn-group">
						  <a class="btn btn-large btn-primary" target="_blank" href="journal/bootstrap.min.css"
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'journal', 'bootstrap.min.css']);">Download</a>
						  <a class="btn btn-large btn-primary dropdown-toggle" data-toggle="dropdown" href="#">
						    <span class="caret"></span>
						  </a>
						  <ul class="dropdown-menu">
						    <!-- dropdown menu links -->
							<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>
						</div>
					</div>
			        </div>
			      </div>
Thomas Park's avatar
Thomas Park committed
240

Thomas Park's avatar
Thomas Park committed
241

Thomas Park's avatar
Thomas Park committed
242
243
244
245
246
247
248
249
	
  			    <li class="span4">
  			      <div class="thumbnail">
  			        <img src="simplex/thumbnail.png" alt="">
  			        <div class="caption">
  			          <h3>Simplex</h3>
  			          <p>Flat, matte, minimalist.</p>
  			          <div class="btn-toolbar">
Thomas Park's avatar
Thomas Park committed
250
  						<div class="btn-group"><a class="btn btn-large" href="simplex">Preview</a></div>
Thomas Park's avatar
Thomas Park committed
251
  						<div class="btn-group">
Thomas Park's avatar
Thomas Park committed
252
  						  <a class="btn btn-primary btn-large" target="_blank" href="simplex/bootstrap.min.css"
Thomas Park's avatar
Thomas Park committed
253
254
255
256
257
258
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'simplex', 'bootstrap.min.css']);">Download</a>
  						  <a class="btn btn-primary btn-large dropdown-toggle" data-toggle="dropdown" href="#">
  						    <span class="caret"></span>
  						  </a>
  						  <ul class="dropdown-menu">
  						    <!-- dropdown menu links -->
Thomas Park's avatar
Thomas Park committed
259
  							<li><a target="_blank" href="simplex/bootstrap.min.css"
Thomas Park's avatar
Thomas Park committed
260
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'simplex', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
261
  							<li><a target="_blank" href="simplex/bootstrap.css"
Thomas Park's avatar
Thomas Park committed
262
263
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'simplex', 'bootstrap.css']);">bootstrap.css</a></li>
							<li class="divider"></li>
264
  							<li><a target="_blank" href="simplex/variables.less"
Thomas Park's avatar
Thomas Park committed
265
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'simplex', 'variables.less']);">variables.less</a></li>
266
  							<li><a target="_blank" href="simplex/bootswatch.less"
Thomas Park's avatar
Thomas Park committed
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'simplex', 'bootswatch.less']);">bootswatch.less</a></li>
  						  </ul>
  						</div>
  					</div>
  			        </div>
  			      </div>
  			    </li>
				  
			
			    <li class="span4">
			      <div class="thumbnail">
			        <img src="spacelab/thumbnail.png" alt="">
			        <div class="caption">
			          <h3>Spacelab</h3>
			          <p>Silvery and sleek.</p>
			          <div class="btn-toolbar">
Thomas Park's avatar
Thomas Park committed
283
						<div class="btn-group"><a class="btn btn-large" href="spacelab">Preview</a></div>
Thomas Park's avatar
Thomas Park committed
284
						<div class="btn-group">
Thomas Park's avatar
Thomas Park committed
285
						  <a class="btn btn-large btn-primary" target="_blank" href="spacelab/bootstrap.min.css"
Thomas Park's avatar
Thomas Park committed
286
287
288
289
290
291
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'spacelab', 'bootstrap.min.css']);">Download</a>
						  <a class="btn btn-large btn-primary dropdown-toggle" data-toggle="dropdown" href="#">
						    <span class="caret"></span>
						  </a>
						  <ul class="dropdown-menu">
						    <!-- dropdown menu links -->
Thomas Park's avatar
Thomas Park committed
292
							<li><a target="_blank" href="spacelab/bootstrap.min.css"
Thomas Park's avatar
Thomas Park committed
293
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'spacelab', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
294
							<li><a target="_blank" href="spacelab/bootstrap.css"
Thomas Park's avatar
Thomas Park committed
295
296
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'spacelab', 'bootstrap.css']);">bootstrap.css</a></li>
							<li class="divider"></li>
297
  							<li><a target="_blank" href="spacelab/variables.less"
Thomas Park's avatar
Thomas Park committed
298
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'spacelab', 'variables.less']);">variables.less</a></li>
299
  							<li><a target="_blank" href="spacelab/bootswatch.less"
Thomas Park's avatar
Thomas Park committed
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'spacelab', 'bootswatch.less']);">bootswatch.less</a></li>
						  </ul>
						</div>
					</div>
			        </div>
			      </div>
			    </li>
				  
				    
			    <li class="span4">
			      <div class="thumbnail">
			        <img src="united/thumbnail.png" alt="">
			        <div class="caption">
			          <h3>United</h3>
			          <p>Bright colors and a distinctive font.</p>
			          <div class="btn-toolbar">
Thomas Park's avatar
Thomas Park committed
316
						<div class="btn-group"><a class="btn btn-large" href="united">Preview</a></div>
Thomas Park's avatar
Thomas Park committed
317
						<div class="btn-group">
Thomas Park's avatar
Thomas Park committed
318
						  <a class="btn btn-large btn-primary" target="_blank" href="united/bootstrap.min.css"
Thomas Park's avatar
Thomas Park committed
319
320
321
322
323
324
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'united', 'bootstrap.min.css']);">Download</a>
						  <a class="btn btn-large btn-primary dropdown-toggle" data-toggle="dropdown" href="#">
						    <span class="caret"></span>
						  </a>
						  <ul class="dropdown-menu">
						    <!-- dropdown menu links -->
Thomas Park's avatar
Thomas Park committed
325
							<li><a target="_blank" href="united/bootstrap.min.css"
Thomas Park's avatar
Thomas Park committed
326
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'united', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
327
							<li><a target="_blank" href="united/bootstrap.css"
Thomas Park's avatar
Thomas Park committed
328
329
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'united', 'bootstrap.css']);">bootstrap.css</a></li>
							<li class="divider"></li>
330
  							<li><a target="_blank" href="united/variables.less"
Thomas Park's avatar
Thomas Park committed
331
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'united', 'variables.less']);">variables.less</a></li>
332
  							<li><a target="_blank" href="united/bootswatch.less"
Thomas Park's avatar
Thomas Park committed
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
								onClick="_gaq.push(['_trackEvent', 'bootswatch', 'united', 'bootswatch.less']);">bootswatch.less</a></li>
						  </ul>
						</div>
					</div>
			        </div>
			      </div>
			    </li>

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

      <hr>

      <footer>
		<p class="pull-right"><a href="#">Back to top</a></p>
350
351
352
		Made by <a target="_blank" href="http://thomaspark.me" onclick="pageTracker._link(this.href); return false;">Thomas Park</a>. Submissions and feedback welcome at <a href="mailto:thomas@thomaspark.me">thomas@thomaspark.me</a>.<br/>
		Code licensed under the <a target="_blank" href="http://www.apache.org/licenses/LICENSE-2.0">Apache License v2.0</a>.<br/>
		Based on <a target="_blank" href="http://twitter.github.com/bootstrap/">Bootstrap</a>. Hosted on <a target="_blank" href="http://pages.github.com/">GitHub</a>. Icons from <a target="_blank" href="http://glyphicons.com/">Glyphicons</a>. Web fonts from <a target="_blank" href="http://www.google.com/webfonts">Google</a>.</p>
Thomas Park's avatar
Thomas Park committed
353
354
355
356
357
358
359
360
361
362
363
364
365
      </footer>

    </div> <!-- /container -->

    <!-- Le javascript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="js/jquery.js"></script>
    <script src="js/bootstrap-dropdown.js"></script>
	<script>!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>
366
</html>