From 5300a00007e64b8d1dbdc2e5fb139b6709d4d1d4 Mon Sep 17 00:00:00 2001
From: Viljami Salminen <viljami.salminen@gmail.com>
Date: Mon, 29 Apr 2013 15:33:19 +0300
Subject: [PATCH] Adds new index and styles

---
 .DS_Store               | Bin 6148 -> 6148 bytes
 example.css             | 227 ++++++++++++++++++++++++++++++++++++++++
 index.htm => index.html |   8 +-
 3 files changed, 231 insertions(+), 4 deletions(-)
 create mode 100644 example.css
 rename index.htm => index.html (98%)

diff --git a/.DS_Store b/.DS_Store
index 76211fc483fe4268296142b77956d1f36b491a6c..5008ddfcf53c02e82d7eee2e57c38e5672ef89f6 100644
GIT binary patch
delta 70
zcmZoMXfc=|#>AjHu~2NHo+1YW5HK<@2y8yc?8dVB0&^DgW_AvK4xj>{$am(+{342+
UKzW7)kiy9(Jj$D6L{=~Z05zizaR2}S

literal 6148
zcmeHK%SyvQ6unbxZGAvDqRZe?q|_%0E<&lGJE1}sDw-H+A~7jVYK2;j|KNA{IsT5G
zc~mS_TnHj^FWfmdckY=qCzF{D5s6yYTO}$JQ4uaNS3>iN$$sf$mNS_GP^d9l2Vs2S
zhOs+V%Zb0KfP8n8v`!VeqBebef0z<t8NCOu%GA#<kV`Gpwki6yc7`tLmK?f9b%?k^
z7nD%)VTOEmhiM8hwx_ri@+k#B{DxCNl@G=>JaKzT+swdcw;cvaTCKi_+(dq|Fja)j
zo-~8Vi+i=W8+plb!;gE7z`Jyv&Z&x1C+#LRr=xlfozzE<ijU$rM0{eZn}L`5XXS-{
ze|>Fx#oE{ztXTc+O@v!()xn?yD?b(ImnysaM^684aQ~nufWVicY|h{i9ubT@$xWjZ
zg>lqEe#jZtGO_}!04wk_1<a~aocY->%w`2xfq$rgTpujBMB8AdQ7s*4)DZxfM_L(T
zd6tkI%b;yA(}*6J&{UwN3UkB|nvT3>>TH9VMolMS4j;nYS(p=wP<O}pmMSM<Yvh&{
zU<F1Mn9!GHx&QBdef}RM@f9n;3j8YtM84jr*YHSYZykF$xz}3obGS5FmuY;bAW&N|
fYUNhE2v>%@B?F*sFw=+(jQ<EI8Mt8uepP`t!JT`S

diff --git a/example.css b/example.css
new file mode 100644
index 0000000..cbc5f8d
--- /dev/null
+++ b/example.css
@@ -0,0 +1,227 @@
+* {
+  margin: 0;
+  padding: 0;
+}
+
+html {
+  background: #222 url("bg.png") repeat;
+}
+
+body {
+  _width: 70%;
+  color: #888;
+  font: 14px/20px Helvetica, Arial, sans-serif;
+  margin: 20px auto 0;
+  max-width: 800px;
+  text-align: center;
+  text-shadow: 0 -2px 1px #000;
+  -webkit-font-smoothing: antialiased;
+}
+
+h1 { 
+  font: 40px/60px "Helvetica Neue", Helvetica, Arial, sans-serif;
+  color: #fff;
+  font-weight: 200;
+  }
+
+h2 { 
+  font: 16px/20px "Helvetica Neue", Helvetica, Arial, sans-serif; 
+  margin-bottom: 40px;
+  }
+
+h3 { 
+  font: 16px/20px "Helvetica Neue", Helvetica, Arial, sans-serif; 
+  color: #fff;
+  font-weight: 900;
+  margin-top: 40px;
+  }
+
+h4 { 
+  font: 14px/20px "Helvetica Neue", Helvetica, Arial, sans-serif; 
+  font-weight: 900;
+  margin-top: 40px;
+  }
+
+#wrapper {
+  padding: 20px;
+  }
+
+a {
+  text-decoration: none;
+  color: #fff;
+  }
+
+a:hover {
+  border-bottom: 1px solid #666;
+  }
+
+p,h3,h4,pre {
+  text-align: left;
+  max-width: 500px;
+  margin: 0 auto 20px;
+  }
+
+.rslides {
+  box-shadow: 0 0 20px #000;
+  -moz-box-shadow: 0 0 20px #000;
+  -webkit-box-shadow: 0 0 20px #000;
+  margin: 0 auto 40px;
+}
+
+.rslides {
+  position: relative;
+  list-style: none;
+  overflow: hidden;
+  width: 100%;
+  padding: 0;
+  margin: 0 auto 40px;
+  }
+
+.rslides2 {
+  position: relative;
+  list-style: none;
+  overflow: hidden;
+  width: 100%;
+  padding: 0;
+  box-shadow: none;
+  -moz-box-shadow: none;
+  -webkit-box-shadow: none;
+  margin: 0 auto;
+  }
+
+.rslides_tabs {
+  background: rgba(0,0,0,.25);
+  box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0);
+  -moz-box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0);
+  -webkit-box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0);
+  font-size: 18px;
+  list-style: none;
+  margin: 0 auto 50px;
+  max-width: 540px;
+  padding: 10px 0;
+  text-align: center;
+  width: 100%;
+}
+
+.rslides_tabs li {
+  display: inline;
+  float: none;
+  margin-right: 1px;
+}
+
+.rslides_tabs a {
+  width: auto;
+  line-height: 20px;
+  padding: 9px 20px;
+  height: auto;
+  background: transparent;
+  display: inline;
+}
+
+.rslides_tabs a:hover {
+  border: 0;
+}
+
+.rslides_tabs li:first-child {
+  margin-left: 0;
+}
+
+.rslides_tabs .rslides_here a {
+  background: rgba(255,255,255,.1);
+  color: #fff;
+  font-weight: bold;
+}
+
+a {
+  color: #fff;
+  text-decoration: none;
+}
+
+pre,code {
+  font-family: monospace, monospace;
+  }
+
+pre {
+  -webkit-font-smoothing: subpixel-antialiased;
+  -webkit-box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0);
+  -moz-box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0);
+  box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0);
+  -webkit-border-radius: 5px;
+  -moz-border-radius: 5px;
+  border-radius: 5px;
+  text-shadow: none;
+  width: auto;
+  background: #111;
+  background: rgba(0,0,0,.25);
+  padding: 20px;
+  margin-bottom: 30px;
+  _padding: 0;
+  font-size: 13px;
+  color: #fff;
+  _float: left;
+  _width: 100%;
+  white-space: pre;
+  white-space: no-wrap;
+  overflow-x: scroll;
+  }
+
+pre::-webkit-scrollbar {
+  -webkit-appearance: none;
+  background-color: rgba(255,255,255,.1);
+  width: 8px;
+  height: 8px;
+  }
+
+pre::-webkit-scrollbar-thumb {
+  border-radius: 4px;
+  background-color: rgba(255,255,255,.5);
+  }
+
+pre::-webkit-scrollbar-thumb:hover {
+  border-radius: 4px;
+  background-color: rgba(255,255,255,.8);
+  }
+
+.list {
+  text-align: left;
+  max-width: 450px;
+  margin: 0 auto;
+  }
+
+#download {
+  background: #333;
+  background: rgba(255,255,255,.1);
+  border: 1px solid rgba(255,255,255,.1);
+  border-radius: 5px;
+  -moz-border-radius: 5px;
+  -webkit-border-radius: 5px;
+  box-shadow: 0 0 10px #000;
+  -moz-box-shadow: 0 0 10px #000;
+  -webkit-box-shadow: 0 0 10px #000;
+  display: block;
+  font-size: 20px;
+  font-weight: bold;
+  margin: 60px auto;
+  max-width: 500px;
+  padding: 20px;
+}
+
+#download:hover {
+  background: rgba(255,255,255,.15);
+}
+
+.footer {
+  font-size: 11px;
+}
+
+@media screen and (max-width: 540px) {
+  h1 {
+    font: 24px/50px "Helvetica Neue", Helvetica, Arial, sans-serif;
+  }
+  .github {
+    display: none;
+  }
+  .list {
+    margin-left: 20px;
+  }
+}
\ No newline at end of file
diff --git a/index.htm b/index.html
similarity index 98%
rename from index.htm
rename to index.html
index 6e07aa3..d807941 100644
--- a/index.htm
+++ b/index.html
@@ -4,7 +4,7 @@
   <meta charset="utf-8">
   <title>ResponsiveSlides.js &middot; Responsive jQuery Slider &amp; Slideshow</title>
   <meta name="author" content="Viljami Salminen">
-  <meta name="description" content="ResponsiveSlides.js is a tiny jQuery plugin that automatically creates responsive slider using images inside a container">
+  <meta name="description" content="ResponsiveSlides.js is a tiny jQuery plugin that automatically creates responsive slider using images inside a container.">
   <meta name="viewport" content="width=device-width,initial-scale=1">
   <link rel="stylesheet" href="responsiveslides.css">
   <link rel="stylesheet" href="example.css">
@@ -12,15 +12,15 @@
   <script>window.jQuery || document.write('<script src="http://viljamis.com/js/libs/jquery-1.8.2.min.js"><\/script>')</script>
   <script src="responsiveslides.min.js"></script>
   <script>
-    $(function() {
+    $(function () {
 
-      // Slideshow 1 
+      // Slideshow 1
       $(".rslides1").responsiveSlides({
         speed: 1000,
         maxwidth: 800
       });
 
-      // Slideshow 2 
+      // Slideshow 2
       $(".rslides2").responsiveSlides({
         auto: false,
         pager: true,