Merge pull request #14 from nataliav/master

Just Read theme

31 files changed, 2207 insertions, 0 deletions

diff --git a/Just-Read/.gitignore b/Just-Read/.gitignore
new file mode 100644
index 0000000..9d0295a
--- /dev/null
+++ b/Just-Read/.gitignore
@@ -0,0 +1,7 @@
+# OS generated files #
+######################
+.DS_Store*
+ehthumbs.db
+Icon?
+Thumbs.db
+.DS_Store
diff --git a/Just-Read/less/base.less b/Just-Read/less/base.less
new file mode 100644
index 0000000..5997dcc
--- /dev/null
+++ b/Just-Read/less/base.less
@@ -0,0 +1,115 @@
+// Credits: [HTML Boilerplate[(https://github.com/h5bp/html5-boilerplate)
+
+
+// HTML5 display definitions
+
+article, figcaption, figure, footer, header, nav, section, time { 
+	display: block;
+}
+
+// Base
+
+html {
+    font-size: 100%;
+    -ms-text-size-adjust: 100%;
+    -webkit-text-size-adjust: 100%;    
+}
+
+body {
+    margin: 0;
+}
+
+// Remove text-shadow in selection highlight: h5bp.com/i
+
+::-moz-selection { 
+	background: #fd7; // This color should play well with any design
+	color: #000; 
+	text-shadow: none; 
+}
+
+::selection { 
+	background: #fd7; 
+	color: #000; 
+	text-shadow: none; 
+}
+
+// Improve readability when focused and hovered in all browsers: h5bp.com/h
+
+a:hover, a:active { 
+	outline: 0;
+}
+
+// Code 
+
+pre { 
+	white-space: pre; 
+	white-space: pre-wrap; 
+	word-wrap: break-word; 
+}
+
+// Lists
+
+ol, ul{
+	margin: 0;
+	padding: 0;
+}
+
+// Embedded content
+
+img { 
+	border: 0; 
+	-ms-interpolation-mode: bicubic; 
+	vertical-align: middle; 
+}
+
+// Contain floats: h5bp.com/q
+
+.clearfix:before, .clearfix:after { 
+	content: ""; 
+	display: table; 
+}
+.clearfix:after { 
+	clear: both; 
+}
+.clearfix { 
+	*zoom: 1; 
+}
+
+// Simple fluid media
+
+figure {
+	margin: 0 0 (@line * 1px) 0;
+	position: relative;	
+}
+
+figure img, figure object, figure embed, figure video {
+	display: block;
+	height: auto;
+	max-width: 100%; 	
+}
+
+figcaption{
+	color: lighten(@black, 60%);
+	margin-top: @line * 1px;
+}
+
+// Elastic Object & Iframe Embedded Videos  http://webdesignerwall.com/tutorials/css-elastic-videos
+
+.video-container {
+	height: 0;	
+	margin-bottom: @line * 1px;	
+	padding-bottom: 56.25%;
+	padding-top: 30px;
+	position: relative;
+	overflow: hidden;
+}
+
+.video-container iframe,  
+.video-container object,  
+.video-container embed {
+	height: 100%;
+	left: 0;
+	position: absolute;
+	top: 0;	
+	width: 100%;
+}
\ No newline at end of file
diff --git a/Just-Read/less/codehilite.less b/Just-Read/less/codehilite.less
new file mode 100644
index 0000000..9de1d28
--- /dev/null
+++ b/Just-Read/less/codehilite.less
@@ -0,0 +1,70 @@
+// Color scheme for CodeHilite (code/syntax highlighting using Pygments)
+
+@c1: #757575; // grayish
+@c2: #fa4753; // orange
+@c3: #6bc5d9; // teal
+@c4: #514986; // purple
+@c5: #f8f8f2; // whiteish
+@c6: #f92672; // pink
+@c7: #f4e07c; // yellow
+@c8: #9cc52c; // green
+
+.hll {}
+.c { color:  @c1 } /* Comment */
+.err { color: @c2;} /* Error */
+.k { color: @c3 } /* Keyword */
+.l { color: @c4 } /* Literal */
+.n { color: @c5 } /* Name */
+.o { color: @c6 } /* Operator */
+.p { color: @c5 } /* Punctuation */
+.cm { color:  @c1 } /* Comment.Multiline */
+.cp { color:  @c1 } /* Comment.Preproc */
+.c1 { color:  @c1 } /* Comment.Single */
+.cs { color:  @c1 } /* Comment.Special */
+.ge {} /* Generic.Emph */
+.gs {} /* Generic.Strong */
+.kc { color: @c3 } /* Keyword.Constant */
+.kd { color: @c3 } /* Keyword.Declaration */
+.kn { color: @c6 } /* Keyword.Namespace */
+.kp { color: @c3 } /* Keyword.Pseudo */
+.kr { color: @c3 } /* Keyword.Reserved */
+.kt { color: @c3 } /* Keyword.Type */
+.ld { color: @c7 } /* Literal.Date */
+.m { color: @c4 } /* Literal.Number */
+.s { color: @c7 } /* Literal.String */
+.na { color: @c8 } /* Name.Attribute */
+.nb { color: @c5 } /* Name.Builtin */
+.nc { color: @c8 } /* Name.Class */
+.no { color: @c3 } /* Name.Constant */
+.nd { color: @c8 } /* Name.Decorator */
+.ni { color: @c5 } /* Name.Entity */
+.ne { color: @c8 } /* Name.Exception */
+.nf { color: @c8 } /* Name.Function */
+.nl { color: @c5 } /* Name.Label */
+.nn { color: @c5 } /* Name.Namespace */
+.nx { color: @c8 } /* Name.Other */
+.py { color: @c5 } /* Name.Property */
+.nt { color: @c6 } /* Name.Tag */
+.nv { color: @c5 } /* Name.Variable */
+.ow { color: @c6 } /* Operator.Word */
+.w { color: @c5 } /* Text.Whitespace */
+.mf { color: @c4 } /* Literal.Number.Float */
+.mh { color: @c4 } /* Literal.Number.Hex */
+.mi { color: @c4 } /* Literal.Number.Integer */
+.mo { color: @c4 } /* Literal.Number.Oct */
+.sb { color: @c7 } /* Literal.String.Backtick */
+.sc { color: @c7 } /* Literal.String.Char */
+.sd { color: @c7 } /* Literal.String.Doc */
+.s2 { color: @c7 } /* Literal.String.Double */
+.se { color: @c4 } /* Literal.String.Escape */
+.sh { color: @c7 } /* Literal.String.Heredoc */
+.si { color: @c7 } /* Literal.String.Interpol */
+.sx { color: @c7 } /* Literal.String.Other */
+.sr { color: @c7 } /* Literal.String.Regex */
+.s1 { color: @c7 } /* Literal.String.Single */
+.ss { color: @c7 } /* Literal.String.Symbol */
+.bp { color: @c5 } /* Name.Builtin.Pseudo */
+.vc { color: @c5 } /* Name.Variable.Class */
+.vg { color: @c5 } /* Name.Variable.Global */
+.vi { color: @c5 } /* Name.Variable.Instance */
+.il { color: @c4 } /* Literal.Number.Integer.Long */
\ No newline at end of file
diff --git a/Just-Read/less/main.less b/Just-Read/less/main.less
new file mode 100644
index 0000000..39e705c
--- /dev/null
+++ b/Just-Read/less/main.less
@@ -0,0 +1,589 @@
+@import "base.less";
+@import "mixins.less";
+@import "var.less";
+
+// Credits: [Golden Grid System](http://goldengridsystem.com/) by [Joni Korpi](http://jonikorpi.com/) licensed under [MIT](http://www.opensource.org/licenses/mit-license.php)
+
+// Important numbers
+
+@column: 100% / 18;
+@em: @font-size*1em;
+@font-size: 16;
+@line: 24;
+
+// Mobile first
+
+body {
+	background: @white;
+	color: lighten(@black, 25%);
+	line-height: @line * 1px;	
+	.normal; 
+	.sans;
+}
+
+a{
+	color: @link;
+	text-decoration: none;
+	
+		&:hover{
+			color: darken(@link, 40%);
+			text-decoration:underline;
+		}
+}
+
+h1{
+	.huge;
+	margin: 0 0 (@line * 1.5px) 0;
+	.title;	
+}
+
+h2{
+	.large;
+	margin: (@line * 2px) 0 (@line * 1px);
+	.title;	
+}
+
+h3{
+	color: lighten(@black, 60%);
+	margin: (@line * 1.5px) 0 (@line * 1px);
+	.normal;
+	text-transform: uppercase;
+	.title;
+}
+
+h4, h5, h6{
+	font-weight: 400;
+	margin: (@line * 1px) 0;
+	.normal;
+	.title;		
+}
+
+b, strong{
+	font-weight: 700;
+}
+
+blockquote{
+	border-left: (@line / 4px) solid @link;
+	margin-left: -(@line / 2px);	
+	padding-left: (@line / 4px);
+}
+
+code, .codehilite{
+	background: lighten(@black, 15%); // If you don't a dark scheme for code, we can't be friends
+	.box-shadow(inset 0 0 10px @black);
+	color: @white;
+	display: block;
+	margin-left: -(@line * 1px);
+	.mono();
+	padding: (@line * 1px);	
+	.rounded();	
+}
+
+time{
+	.small;
+	text-transform: uppercase;
+}
+
+.post ul li{
+	list-style-image: url('../images/bullet.png'); // or use something less colorful, like list-style-type: square
+}
+
+// Archive
+
+.archive li{
+	list-style: none;
+}
+
+.archive a{
+	border-bottom: 1px dotted lighten(@black, 80%);
+	display: block;
+	padding: (@line / 2px) 0;
+	.transition();
+		
+		&:hover{
+			background-color: lighten(@black, 95%);
+			text-decoration:none;
+		}
+}
+
+.archive time{
+	color: lighten(@black, 40%);
+	display: inline;
+	padding-left: @line / 2px;
+}
+
+// jQuery UI tabs (in the archive)
+
+.tabmenu li{
+	list-style-type: none;
+		
+		a{
+			border: 1px solid @link;
+			.border-box;			
+			display: block;
+			float: left;
+			padding: (@line / 2px) 0;
+			text-align: center;
+			width: 50%;
+			
+				&:hover{
+					text-decoration:none
+				}
+		}
+		
+		&:last-child a{
+			border-left: none;
+		}
+}
+
+// Make jQuery tabs work (because I don't use the themes's CSS)
+
+.ui-tabs-hide{
+	display: none;
+}
+
+.tabmenu li a:hover, .ui-tabs-selected a, .ui-tabs-selected a{
+	background-color: lighten(@black, 95%);
+}
+
+// Push the button
+
+.btn { 
+	color: @white; 
+	background-color: @color;
+	border: none;
+	
+	-webkit-box-shadow: inset 0px -3px 1px rgba(0, 0, 0, 0.45), 0px 2px 2px rgba(0, 0, 0, 0.25);
+	-moz-box-shadow: inset 0px -3px 1px rgba(0, 0, 0, 0.45), 0px 2px 2px rgba(0, 0, 0, 0.25);
+	box-shadow: inset 0px -3px 1px rgba(0, 0, 0, 0.45), 0px 2px 2px rgba(0, 0, 0, 0.25);
+	
+	padding: 8px 14px 10px;  
+	position: relative;
+	.rounded(3px);
+	text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.5);	
+	-webkit-user-select: none;
+	
+	&:hover{
+		color: @white;
+		text-decoration: none;		
+	}
+	
+	&:active { 
+		-webkit-box-shadow: inset 0px -3px 1px rgba(255, 255, 255, 1), inset 0 0px 3px rgba(0, 0, 0, 0.9);
+		-moz-box-shadow: inset 0px -3px 1px rgba(255, 255, 255, 1), inset 0 0px 3px rgba(0, 0, 0, 0.9);
+		box-shadow: inset 0px -3px 1px rgba(255, 255, 255, 1), inset 0 0px 3px rgba(0, 0, 0, 0.9);
+		
+		position: relative; 
+		top: 3px;
+	}
+	
+	&:active:after { 
+		content: ""; 
+		background: @white;
+		bottom: -1px; 
+		height: 3px;
+		left: 0;
+		position: absolute;
+		width: 100%; 		 
+	}	
+	
+}
+
+// CSS tags
+
+.tag li{
+	list-style: none;
+	margin-bottom: @line / 8px;
+}
+
+.tag a{
+	.border-box;
+	
+	-moz-border-radius-bottomright: 4px;
+	-webkit-border-bottom-right-radius: 4px;	
+	border-bottom-right-radius: 4px;
+	-moz-border-radius-topright: 4px;
+	-webkit-border-top-right-radius: 4px;	
+	border-top-right-radius: 4px;
+	
+	color: @black;
+	background-color: lighten(@link, 50%);
+	display: block;
+	margin-left: 20px;
+	padding: 0 10px 0 12px;
+	position: relative;
+	.small;
+		
+	&:hover{
+		background-color: lighten(@link, 30%);
+		text-decoration:none;		
+	}
+	
+	&:before{
+		content: "";
+		border-color: transparent lighten(@link, 50%) transparent transparent;
+		border-style: solid;
+		border-width: 12px 12px 12px 0;
+		float: left;
+		height: 0;
+		left: -12px;
+		position: absolute;
+		top: 0;
+		width: 0;	
+	}
+	
+	&:after{
+		content: "";
+		background: @white;
+		.box-shadow(-1px -1px 2px darken(@link, 50%));
+		float: left;
+		height: 4px;
+		left: 0;
+		position: absolute;
+		.rounded(2px);
+		top: 10px;
+		width: 4px;
+	}
+	
+	&:hover:before {
+		border-color: transparent lighten(@link, 30%) transparent transparent;
+	}
+}
+
+// Tagcloud
+.tag-1 a{width: 100%;}
+.tag-2 a{width: 90%;}
+.tag-3 a{width: 80%;}
+.tag-4 a{width: 70%;}
+.tag-5 a{width: 60%;}
+.tag-6 a{width: 50%;}
+.tag-7 a{width: 40%;}
+.tag-8 a{width: 30%;}
+
+// Header
+
+header{
+	.border-image(0 0 2px, 0 0 2, '../images/2px.png', repeat); // It's a very small detail, delete this line if you want different colors and don't want to edit the image file
+	.gradient(@color, darken(@color, 6%));
+	margin-bottom: (@line * 2px);
+	padding: (@line * 1px) @column;
+		
+	h1{
+		margin: 0;
+	}
+	
+	a{
+		color: fade(@white, 80%);
+		text-decoration: none;
+		// The 3d effect is kind of silly, so go ahead and delete the following lines xD		
+		text-shadow: 
+			0 1px 0 lighten(@black, 70%), 
+			0 2px 0 lighten(@black, 60%), 
+			0 3px 0 lighten(@black, 50%), 
+			0 4px 0 lighten(@black, 40%), 
+			0 5px 0 lighten(@black, 30%), 
+			0 6px 0 lighten(@black, 20%), 
+			0px 7px 0 lighten(@black, 10%), 
+			0 8px 7px lighten(@black, 5%);
+				
+				&:hover{
+					color: @white;
+					text-decoration:none;
+				}			
+	}
+}
+
+// Footer
+
+footer{
+	.border-image(20px 0 0, 20 0 0, '../images/pages.png', repeat); // Again, it's a detail. I used border-image to be able to use a gradient or background color for the footer, but now it's white
+	color: fade(@black, 60%);
+	margin-top: (@line * 4px);
+	padding: (@line * 2px) @column (@line * 1px);	
+}
+
+.nav{
+	margin-bottom: (@line * 1px);
+	
+		li{
+			list-style: none;
+			display: inline;
+			padding-right: 10px;
+		}
+		
+		a{
+			.transition();
+		}
+}
+
+p[role="contentinfo"]{
+	.small;
+}
+
+.social{
+	margin-bottom: @line * 1px;
+	
+		li{
+			list-style: none;
+			display: inline;
+			padding-right: @line / 2px;
+		}	
+}
+
+.icon{
+	margin-right: 2px; 
+	vertical-align: -3px;
+}
+
+.social a[href*='behance.net']:before       {content: url('../images/icons/behance.png'); .icon;}
+.social a[href*='delicious.com']:before     {content: url('../images/icons/delicious.png'); .icon;}
+.social a[href*='facebook.com']:before      {content: url('../images/icons/facebook.png'); .icon;}
+.social a[href*='flickr.com']:before        {content: url('../images/icons/flickr.png'); .icon;}
+.social a[href*='forrst.com']:before        {content: url('../images/icons/forrst.png'); .icon;}
+.social a[href*='github.com']:before        {content: url('../images/icons/github.png'); .icon;}
+.social a[href*='plus.google.com']:before   {content: url('../images/icons/google_plus.png'); .icon;}
+.social a[href*='last.fm']:before           {content: url('../images/icons/lastfm.png'); .icon;}
+.social a[href*='linkedin.com']:before      {content: url('../images/icons/linkedin.png'); .icon;}
+.social a[href*='quora.com']:before         {content: url('../images/icons/quora.png'); .icon;}
+.social a[href*='rss.xml']:before           {content: url('../images/icons/rss.png'); .icon;}
+.social a[href*='stackoverflow.com']:before {content: url('../images/icons/stackoverflow.png'); .icon;}
+.social a[href*='twitter.com']:before       {content: url('../images/icons/twitter.png'); .icon;}
+.social a[href*='youtube.com']:before       {content: url('../images/icons/youtube.png'); .icon;}
+
+
+
+// Four-column grid active
+// ----------------------------------------
+// Margin   | #  1   2   3   4   |   Margin
+// 5.55555% | %  25  50  75  100 | 5.55555%
+
+.wrapper {
+	.border-box;
+	padding: 0 (@line/2)/@em;	
+}
+
+.content{
+	margin:0 @column;
+}
+
+.meta{
+	background: lighten(@black, 98%);
+	margin-top: @line * 2px;
+	padding-bottom: (@line * 1px);
+	padding-top: (@line * 1px);	
+	.rounded();
+	
+		time{
+			font-weight: 700;
+			margin-left: 20px;
+			margin-bottom: @line * 1px;
+		}
+}
+
+.tag li{
+	display: block;
+	float: left;
+	width: 50%;
+}
+
+blockquote, code, .codehilite, .post ul, .post ol, p, .archive{
+	margin: 0 0 (@line * 1px) 0;
+}
+
+.main + .main{
+	margin-top: (@line * 4px);
+}
+
+
+// Eight-column grid active
+// ----------------------------------------------------------------------
+// Margin   | #  1     2     3     4     5     6     7     8   |   Margin
+// 5.55555% | %  12.5  25.0  37.5  50.0  62.5  75.0  87.5  100 | 5.55555%
+
+
+// @media screen and (min-width: 720px)
+@media screen and (min-width: 45em) {
+	
+	
+	header .wrapper{
+		float: right;
+		width: 75%;		
+	}
+	
+	.meta, .pages{
+		float: left;
+		text-align: right;
+		width: 25%;		
+	}
+	
+	.meta{
+		background: @white;
+		margin-top: 0;
+		padding-top: 24px + (@line * 1.5px); // h1 font-size + margin-bottom
+		
+			time{
+				margin-bottom: (@line * 1px);
+				margin-left: 0;
+				font-weight: 400;
+			}
+	}
+	
+	.post, .copy, .main{
+		float: right;
+		width: 75%;		
+	}
+	
+	.tag li{
+		float: none;
+		width: 100%;
+	}
+	
+	.nav a:hover{
+		padding-right: (@line / 4px); // If prefer your links to remain still, delete this nonsense
+	}
+	
+	.nav a:hover:after{
+		content:  "\2192 ";
+	}
+	
+	.nav li{
+		display: block;
+		padding-right: 0;
+	}
+	
+	.archive time{
+		.border-box;
+		display: block;
+		float: left;
+		width: 100/4%; // target 1 columns, context 4 columns
+	}
+}
+
+
+// @media screen and (min-width: 888px)
+@media screen and (min-width: 55.5em) {
+	
+	.post > p, .post blockquote, .post ul, .post ol{
+		width: 400/6%; // target 4 columns, context 6 columns
+	}
+	
+	.main{
+		float: none;
+		margin-left: 25%;
+		width: 50%;	
+	}
+}
+
+
+// @media screen and (min-width: 984px)
+@media screen and (min-width: 61.5em) {
+
+	.meta, .pages{
+		width: 12.5%;
+	}
+	
+	.pages{
+		padding-top: 0;
+	}
+
+	.meta{
+		padding-top: 24px + (@line * 1.5px);
+	}
+
+
+}
+
+
+// Sixteen-column grid active
+// ----------------------------------------------------------------------------------------------------------------------
+// Margin   | #  1     2     3     4     5     6     7     8     9     10    11    12    13    14    15    16  |   Margin
+// 5.55555% | %  6.25  12.5  18.75 25.0  31.25 37.5  43.75 50.0  56.25 62.5  68.75 75.0  81.25 87.5  93.75 100 | 5.55555%
+
+
+// @media screen and (min-width: 1872px)
+@media screen and (min-width: 117em) {
+
+	body{
+		.large;
+	}
+	
+	header{
+		margin-bottom: (@line * 4px);
+	}
+	
+	footer{
+		margin-top: (@line * 6px);
+	}
+	
+	h1{
+		.gigantic;
+		margin-bottom: (@line * 2px);
+	}
+	
+	h2, header .huge{
+		.massive;
+	}
+	
+	h2{
+		margin-top: (@line * 3px);
+	}
+	
+	h3{
+		.huge;
+		margin-top: (@line * 3px);
+	}
+	
+	h4, h5, h6{
+		.large;
+		margin-top: (@line * 2px);
+	}
+	
+	.meta, .pages{
+		padding-left: 6.25%;
+		width: 18.75%;		
+	}
+
+	.meta{
+		padding-top: 48 * 2px;
+	}
+	
+	.post, .copy{
+		width: 75%;
+	}
+	
+	.post{
+		padding-right: 12.5%;
+	}
+	
+	.post ul{
+		margin-bottom: 0;
+	}
+	.post li{
+		margin-bottom: (@line * 1px);
+	}
+	
+	code, .codehilite{
+		line-height: 1.5;
+		.massive;		
+	}
+	
+	.post > p, .post blockquote, .post ul, .post ol{
+		width: 600/10%; // target 4 columns, context 6 columns
+	}
+	
+}
+
+// @media screen and (min-width: 2080px)
+@media screen and (min-width: 130em) {
+
+	body {
+		max-width: 2560/@em;
+	}
+	
+}
+
+@media print{
+	@import "print.less";
+}
+
+@import "codehilite.less";
\ No newline at end of file
diff --git a/Just-Read/less/mixins.less b/Just-Read/less/mixins.less
new file mode 100644
index 0000000..9d5658d
--- /dev/null
+++ b/Just-Read/less/mixins.less
@@ -0,0 +1,78 @@
+// Credits: [LESS Elements](http://lesselements.com)
+//          [Twitter Bootstrap](https://github.com/twitter/bootstrap) licensed under [Apache License](http://www.apache.org/licenses/LICENSE-2.0)
+
+.box-shadow(@arguments) {
+	-webkit-box-shadow: @arguments;
+	-moz-box-shadow: @arguments;
+	box-shadow: @arguments;
+}
+
+.gradient(@startColor: #555, @endColor: #333) {
+	background-color: @endColor;
+	background-repeat: repeat-x;
+	background-image: -khtml-gradient(linear, left top, left bottom, from(@startColor), to(@endColor)); // Konqueror
+	background-image: -moz-linear-gradient(top, @startColor, @endColor); // FF 3.6+
+	background-image: -ms-linear-gradient(top, @startColor, @endColor); // IE10
+	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, @startColor), color-stop(100%, @endColor)); // Safari 4+, Chrome 2+
+	background-image: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+
+	background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10
+	background-image: linear-gradient(top, @startColor, @endColor); // The standard
+	filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); // IE9 and down
+}
+
+.rounded(@radius: 4px) {
+	-webkit-border-radius: @radius;
+	-moz-border-radius: @radius;
+	border-radius: @radius;
+	
+	-moz-background-clip: padding; 
+	-webkit-background-clip: padding-box; 
+	background-clip: padding-box; 
+}
+
+.transition(@duration:0.25s, @ease:linear) {
+	-webkit-transition: all @duration @ease;
+	-moz-transition: all @duration @ease;
+	-o-transition: all @duration @ease;
+	transition: all @duration @ease;
+}
+
+.border-image(@width, @slice, @url, @repeat) {
+	border-width: @width;
+	-moz-border-image: url(@url) @slice @repeat;
+	-webkit-border-image: url(@url) @slice @repeat;
+	-o-border-image: url(@url) @slice @repeat;
+	border-image: url(@url) @slice @repeat;
+}
+
+.border-box{
+	-webkit-box-sizing: border-box;
+	   -moz-box-sizing: border-box;
+		 -o-box-sizing: border-box;
+			box-sizing: border-box;
+}
+
+
+// Typography mixins - Make the text bigger if you dare
+
+// If you modify the fonts, delete/modify the line 12 in base.html
+
+.sans, .fancy-font{
+	font-family: 'Droid Sans', sans-serif;
+}
+.mono{
+	font-family: 'Droid Sans Mono', monospace;
+}
+
+.small    {font-size: 12px;}
+.normal   {font-size: 14px;}
+.large    {font-size: 18px;}
+.huge     {font-size: 24px;}
+.massive  {font-size: 36px;}
+.gigantic {font-size: 48px;}
+
+.title{
+	line-height: 1;
+	.fancy-font;
+	font-weight: 700;
+}
\ No newline at end of file
diff --git a/Just-Read/less/print.less b/Just-Read/less/print.less
new file mode 100644
index 0000000..92d636b
--- /dev/null
+++ b/Just-Read/less/print.less
@@ -0,0 +1,76 @@
+// Credits: [HTML Boilerplate[(https://github.com/h5bp/html5-boilerplate)
+//          [Hartija - Css Print Framework](http://code.google.com/p/hartija/) licensed under [MIT](http://www.opensource.org/licenses/mit-license.php)
+
+* { 
+	background : transparent !important; 
+	box-shadow:none !important;
+	color : black !important; // Black prints faster: h5bp.com/s
+	filter : none !important; 
+	-ms-filter : none !important; 
+	text-shadow : none !important; 
+}
+
+@page { 
+	margin : 0.5cm; 
+}
+
+a, a:visited { 
+	color : @black !important; 
+	text-decoration : underline; 
+}
+
+a[href]:after { 
+	content : " (" attr(href) ")"; 
+}
+
+a[href^="javascript:"]:after, a[href^="#"]:after, .ir a:after { 
+	content : ""; 
+}
+
+abbr[title]:after { 
+	content : " (" attr(title) ")"; 
+}
+
+body{
+	font-size: 12pt;
+}
+
+blockquote, pre{
+	page-break-inside : avoid; 
+}
+
+blockquote, pre { 
+	margin-left: 0.5cm;
+	border-left : 0.2cm solid #999; 
+	padding-left: 0.2cm;
+}
+
+code, pre { 
+	font: 10pt Courier, monospace; 
+} 
+
+h1{
+	font-size: 18pt;
+}
+
+h2, h3 { 
+	page-break-after : avoid;
+	font-size: 16pt;
+}
+
+h2, h3, p { 
+	orphans : 3;  
+	widows : 3; 	
+}
+
+img { 
+	max-width : 100% !important;
+}
+
+img, tr { 
+	page-break-inside : avoid; 
+}
+
+thead { 
+	display : table-header-group; 
+}
\ No newline at end of file
diff --git a/Just-Read/less/var.less b/Just-Read/less/var.less
new file mode 100644
index 0000000..6d53ed7
--- /dev/null
+++ b/Just-Read/less/var.less
@@ -0,0 +1,6 @@
+// Color Variables
+
+@black: #000;
+@white: #fff;
+@color: #556270; // The color of the header.
+@link: #1d73bb; // The color of links, blockquote line and bullets. If you modify this color, edit static/images/bullet.png
\ No newline at end of file
diff --git a/Just-Read/license.md b/Just-Read/license.md
new file mode 100644
index 0000000..d82e48d
--- /dev/null
+++ b/Just-Read/license.md
@@ -0,0 +1,7 @@
+Copyright (c) 2012 Natalia Ventre
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
\ No newline at end of file
diff --git a/Just-Read/pelican.conf.py-sample.py b/Just-Read/pelican.conf.py-sample.py
new file mode 100644
index 0000000..93689d3
--- /dev/null
+++ b/Just-Read/pelican.conf.py-sample.py
@@ -0,0 +1,27 @@
+AUTHOR = 'Name Lastname'
+SITENAME = "The name of your website"
+SITEURL = 'http://example.com'
+TIMEZONE = ""
+
+DISQUS_SITENAME = ''
+
+DEFAULT_DATE_FORMAT = '%d/%m/%Y'
+REVERSE_ARCHIVE_ORDER = True
+TAG_CLOUD_STEPS = 8
+
+PATH = ''
+THEME = ''
+OUTPUT_PATH = ''
+
+MARKUP = 'md'
+MD_EXTENSIONS = 'extra'
+
+FEED_RSS = 'feeds/all.rss.xml'
+TAG_FEED_RSS = 'feeds/%s.rss.xml'
+
+GOOGLE_ANALYTICS = 'UA-XXXXX-X'
+HTML_LANG = 'es'
+TWITTER_USERNAME = ''
+
+SOCIAL = (('GitHub',  'http://github.com/yourusername'),
+          ('Twitter', 'http://twitter.com/yourusername'),)
\ No newline at end of file
diff --git a/Just-Read/psd/bullet.psd b/Just-Read/psd/bullet.psd
new file mode 100644
index 0000000..e55960f
--- /dev/null
+++ b/Just-Read/psd/bullet.psd
diff --git a/Just-Read/psd/bullet.pxm b/Just-Read/psd/bullet.pxm
new file mode 100644
index 0000000..ab97851
--- /dev/null
+++ b/Just-Read/psd/bullet.pxm
diff --git a/Just-Read/psd/line2px.psd b/Just-Read/psd/line2px.psd
new file mode 100644
index 0000000..5154b33
--- /dev/null
+++ b/Just-Read/psd/line2px.psd
diff --git a/Just-Read/psd/line2px.pxm b/Just-Read/psd/line2px.pxm
new file mode 100644
index 0000000..241b0a9
--- /dev/null
+++ b/Just-Read/psd/line2px.pxm
diff --git a/Just-Read/psd/pages.psd b/Just-Read/psd/pages.psd
new file mode 100644
index 0000000..0fd74b4
--- /dev/null
+++ b/Just-Read/psd/pages.psd
diff --git a/Just-Read/psd/pages.pxm b/Just-Read/psd/pages.pxm
new file mode 100644
index 0000000..f74ee8e
--- /dev/null
+++ b/Just-Read/psd/pages.pxm
diff --git a/Just-Read/readme.md b/Just-Read/readme.md
new file mode 100644
index 0000000..ebba988
--- /dev/null
+++ b/Just-Read/readme.md
@@ -0,0 +1,11 @@
+# Just Read
+
+"Just Read" is a theme for [Pelican](http://alexis.notmyidea.org/pelican/). The fluid-width layout is based based on the Golden Grid System by [Joni Korpi](http://jonikorpi.com/).
+
+## Worth mentioning files
+
+- **pelican.com.py-sample** contains the variables used in the theme, use it as reference to build your own configuration file. 
+- **var.less** defines the colors and fonts used. Much more easy to edit than the main.css file.
+- the **psd folder** contains the images used in the theme, handful if you want to change the color scheme.
+
+*Note: I tested the theme only in the latests version of Chrome, Firefox, Opera and Safari. *
\ No newline at end of file
diff --git a/Just-Read/screenshot.png b/Just-Read/screenshot.png
new file mode 100644
index 0000000..37308d3
--- /dev/null
+++ b/Just-Read/screenshot.png
diff --git a/Just-Read/static/css/main.css b/Just-Read/static/css/main.css
new file mode 100644
index 0000000..3537b3b
--- /dev/null
+++ b/Just-Read/static/css/main.css
@@ -0,0 +1,975 @@
+article,
+figcaption,
+figure,
+footer,
+header,
+nav,
+section,
+time {
+  display: block;
+}
+html {
+  font-size: 100%;
+  -ms-text-size-adjust: 100%;
+  -webkit-text-size-adjust: 100%;
+}
+body {
+  margin: 0;
+}
+::-moz-selection {
+  background: #fd7;
+  color: #000;
+  text-shadow: none;
+}
+::selection {
+  background: #fd7;
+  color: #000;
+  text-shadow: none;
+}
+a:hover, a:active {
+  outline: 0;
+}
+pre {
+  white-space: pre;
+  white-space: pre-wrap;
+  word-wrap: break-word;
+}
+ol, ul {
+  margin: 0;
+  padding: 0;
+}
+img {
+  border: 0;
+  -ms-interpolation-mode: bicubic;
+  vertical-align: middle;
+}
+.clearfix:before, .clearfix:after {
+  content: "";
+  display: table;
+}
+.clearfix:after {
+  clear: both;
+}
+.clearfix {
+  *zoom: 1;
+}
+figure {
+  margin: 0 0 24px 0;
+  position: relative;
+}
+figure img,
+figure object,
+figure embed,
+figure video {
+  display: block;
+  height: auto;
+  max-width: 100%;
+}
+figcaption {
+  color: #999999;
+  margin-top: 24px;
+}
+.video-container {
+  height: 0;
+  margin-bottom: 24px;
+  padding-bottom: 56.25%;
+  padding-top: 30px;
+  position: relative;
+  overflow: hidden;
+}
+.video-container iframe, .video-container object, .video-container embed {
+  height: 100%;
+  left: 0;
+  position: absolute;
+  top: 0;
+  width: 100%;
+}
+.border-box {
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  -o-box-sizing: border-box;
+  box-sizing: border-box;
+}
+.sans, .fancy-font {
+  font-family: 'Droid Sans', sans-serif;
+}
+.mono {
+  font-family: 'Droid Sans Mono', monospace;
+}
+.small {
+  font-size: 12px;
+}
+.normal {
+  font-size: 14px;
+}
+.large {
+  font-size: 18px;
+}
+.huge {
+  font-size: 24px;
+}
+.massive {
+  font-size: 36px;
+}
+.gigantic {
+  font-size: 48px;
+}
+.title {
+  line-height: 1;
+  font-family: 'Droid Sans', sans-serif;
+  font-weight: 700;
+}
+body {
+  background: #ffffff;
+  color: #404040;
+  line-height: 24px;
+  font-size: 14px;
+  font-family: 'Droid Sans', sans-serif;
+}
+a {
+  color: #1d73bb;
+  text-decoration: none;
+}
+a:hover {
+  color: #02060a;
+  text-decoration: underline;
+}
+h1 {
+  font-size: 24px;
+  margin: 0 0 36px 0;
+  line-height: 1;
+  font-family: 'Droid Sans', sans-serif;
+  font-weight: 700;
+}
+h2 {
+  font-size: 18px;
+  margin: 48px 0 24px;
+  line-height: 1;
+  font-family: 'Droid Sans', sans-serif;
+  font-weight: 700;
+}
+h3 {
+  color: #999999;
+  margin: 36px 0 24px;
+  font-size: 14px;
+  text-transform: uppercase;
+  line-height: 1;
+  font-family: 'Droid Sans', sans-serif;
+  font-weight: 700;
+}
+h4, h5, h6 {
+  font-weight: 400;
+  margin: 24px 0;
+  font-size: 14px;
+  line-height: 1;
+  font-family: 'Droid Sans', sans-serif;
+  font-weight: 700;
+}
+b, strong {
+  font-weight: 700;
+}
+blockquote {
+  border-left: 6px solid #1d73bb;
+  margin-left: -12px;
+  padding-left: 6px;
+}
+code, .codehilite {
+  background: #262626;
+  -webkit-box-shadow: inset 0 0 10px #000000;
+  -moz-box-shadow: inset 0 0 10px #000000;
+  box-shadow: inset 0 0 10px #000000;
+  color: #ffffff;
+  display: block;
+  margin-left: -24px;
+  font-family: 'Droid Sans Mono', monospace;
+  padding: 24px;
+  -webkit-border-radius: 4px;
+  -moz-border-radius: 4px;
+  border-radius: 4px;
+  -moz-background-clip: padding;
+  -webkit-background-clip: padding-box;
+  background-clip: padding-box;
+}
+time {
+  font-size: 12px;
+  text-transform: uppercase;
+}
+.post ul li {
+  list-style-image: url('../images/bullet.png');
+}
+.archive li {
+  list-style: none;
+}
+.archive a {
+  border-bottom: 1px dotted #cccccc;
+  display: block;
+  padding: 12px 0;
+  -webkit-transition: all 0.25s linear;
+  -moz-transition: all 0.25s linear;
+  -o-transition: all 0.25s linear;
+  transition: all 0.25s linear;
+}
+.archive a:hover {
+  background-color: #f2f2f2;
+  text-decoration: none;
+}
+.archive time {
+  color: #666666;
+  display: inline;
+  padding-left: 12px;
+}
+.tabmenu li {
+  list-style-type: none;
+}
+.tabmenu li a {
+  border: 1px solid #1d73bb;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  -o-box-sizing: border-box;
+  box-sizing: border-box;
+  display: block;
+  float: left;
+  padding: 12px 0;
+  text-align: center;
+  width: 50%;
+}
+.tabmenu li a:hover {
+  text-decoration: none;
+}
+.tabmenu li:last-child a {
+  border-left: none;
+}
+.ui-tabs-hide {
+  display: none;
+}
+.tabmenu li a:hover, .ui-tabs-selected a, .ui-tabs-selected a {
+  background-color: #f2f2f2;
+}
+.btn {
+  color: #ffffff;
+  background-color: #556270;
+  border: none;
+  -webkit-box-shadow: inset 0px -3px 1px rgba(0, 0, 0, 0.45), 0px 2px 2px rgba(0, 0, 0, 0.25);
+  -moz-box-shadow: inset 0px -3px 1px rgba(0, 0, 0, 0.45), 0px 2px 2px rgba(0, 0, 0, 0.25);
+  box-shadow: inset 0px -3px 1px rgba(0, 0, 0, 0.45), 0px 2px 2px rgba(0, 0, 0, 0.25);
+  padding: 8px 14px 10px;
+  position: relative;
+  -webkit-border-radius: 3px;
+  -moz-border-radius: 3px;
+  border-radius: 3px;
+  -moz-background-clip: padding;
+  -webkit-background-clip: padding-box;
+  background-clip: padding-box;
+  text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.5);
+  -webkit-user-select: none;
+}
+.btn:hover {
+  color: #ffffff;
+  text-decoration: none;
+}
+.btn:active {
+  -webkit-box-shadow: inset 0px -3px 1px #ffffff, inset 0 0px 3px rgba(0, 0, 0, 0.9);
+  -moz-box-shadow: inset 0px -3px 1px #ffffff, inset 0 0px 3px rgba(0, 0, 0, 0.9);
+  box-shadow: inset 0px -3px 1px #ffffff, inset 0 0px 3px rgba(0, 0, 0, 0.9);
+  position: relative;
+  top: 3px;
+}
+.btn:active:after {
+  content: "";
+  background: #ffffff;
+  bottom: -1px;
+  height: 3px;
+  left: 0;
+  position: absolute;
+  width: 100%;
+}
+.tag li {
+  list-style: none;
+  margin-bottom: 3px;
+}
+.tag a {
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  -o-box-sizing: border-box;
+  box-sizing: border-box;
+  -moz-border-radius-bottomright: 4px;
+  -webkit-border-bottom-right-radius: 4px;
+  border-bottom-right-radius: 4px;
+  -moz-border-radius-topright: 4px;
+  -webkit-border-top-right-radius: 4px;
+  border-top-right-radius: 4px;
+  color: #000000;
+  background-color: #ddedfa;
+  display: block;
+  margin-left: 20px;
+  padding: 0 10px 0 12px;
+  position: relative;
+  font-size: 12px;
+}
+.tag a:hover {
+  background-color: #85bdec;
+  text-decoration: none;
+}
+.tag a:before {
+  content: "";
+  border-color: transparent #ddedfa transparent transparent;
+  border-style: solid;
+  border-width: 12px 12px 12px 0;
+  float: left;
+  height: 0;
+  left: -12px;
+  position: absolute;
+  top: 0;
+  width: 0;
+}
+.tag a:after {
+  content: "";
+  background: #ffffff;
+  -webkit-box-shadow: -1px -1px 2px #000000;
+  -moz-box-shadow: -1px -1px 2px #000000;
+  box-shadow: -1px -1px 2px #000000;
+  float: left;
+  height: 4px;
+  left: 0;
+  position: absolute;
+  -webkit-border-radius: 2px;
+  -moz-border-radius: 2px;
+  border-radius: 2px;
+  -moz-background-clip: padding;
+  -webkit-background-clip: padding-box;
+  background-clip: padding-box;
+  top: 10px;
+  width: 4px;
+}
+.tag a:hover:before {
+  border-color: transparent #85bdec transparent transparent;
+}
+.tag-1 a {
+  width: 100%;
+}
+.tag-2 a {
+  width: 90%;
+}
+.tag-3 a {
+  width: 80%;
+}
+.tag-4 a {
+  width: 70%;
+}
+.tag-5 a {
+  width: 60%;
+}
+.tag-6 a {
+  width: 50%;
+}
+.tag-7 a {
+  width: 40%;
+}
+.tag-8 a {
+  width: 30%;
+}
+header {
+  border-width: 0 0 2px;
+  -moz-border-image: url('../images/2px.png') 0 0 2 repeat;
+  -webkit-border-image: url('../images/2px.png') 0 0 2 repeat;
+  -o-border-image: url('../images/2px.png') 0 0 2 repeat;
+  border-image: url('../images/2px.png') 0 0 2 repeat;
+  background-color: #48535f;
+  background-repeat: repeat-x;
+  background-image: -khtml-gradient(linear, left top, left bottom, from(#556270), to(#48535f));
+  background-image: -moz-linear-gradient(top, #556270, #48535f);
+  background-image: -ms-linear-gradient(top, #556270, #48535f);
+  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #556270), color-stop(100%, #48535f));
+  background-image: -webkit-linear-gradient(top, #556270, #48535f);
+  background-image: -o-linear-gradient(top, #556270, #48535f);
+  background-image: linear-gradient(top, #556270, #48535f);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#556270', endColorstr='#48535f', GradientType=0);
+  margin-bottom: 48px;
+  padding: 24px 5.555555555555555%;
+}
+header h1 {
+  margin: 0;
+}
+header a {
+  color: rgba(255, 255, 255, 0.8);
+  text-decoration: none;
+  text-shadow: 0 1px 0 #b3b3b3, 0 2px 0 #999999, 0 3px 0 #808080, 0 4px 0 #666666, 0 5px 0 #4d4d4d, 0 6px 0 #333333, 0px 7px 0 #1a1a1a, 0 8px 7px #0d0d0d;
+}
+header a:hover {
+  color: #ffffff;
+  text-decoration: none;
+}
+footer {
+  border-width: 20px 0 0;
+  -moz-border-image: url('../images/pages.png') 20 0 0 repeat;
+  -webkit-border-image: url('../images/pages.png') 20 0 0 repeat;
+  -o-border-image: url('../images/pages.png') 20 0 0 repeat;
+  border-image: url('../images/pages.png') 20 0 0 repeat;
+  color: rgba(0, 0, 0, 0.6);
+  margin-top: 96px;
+  padding: 48px 5.555555555555555% 24px;
+}
+.nav {
+  margin-bottom: 24px;
+}
+.nav li {
+  list-style: none;
+  display: inline;
+  padding-right: 10px;
+}
+.nav a {
+  -webkit-transition: all 0.25s linear;
+  -moz-transition: all 0.25s linear;
+  -o-transition: all 0.25s linear;
+  transition: all 0.25s linear;
+}
+p[role="contentinfo"] {
+  font-size: 12px;
+}
+.social {
+  margin-bottom: 24px;
+}
+.social li {
+  list-style: none;
+  display: inline;
+  padding-right: 12px;
+}
+.icon {
+  margin-right: 2px;
+  vertical-align: -3px;
+}
+.social a[href*='behance.net']:before {
+  content: url('../images/icons/behance.png');
+  margin-right: 2px;
+  vertical-align: -3px;
+}
+.social a[href*='delicious.com']:before {
+  content: url('../images/icons/delicious.png');
+  margin-right: 2px;
+  vertical-align: -3px;
+}
+.social a[href*='facebook.com']:before {
+  content: url('../images/icons/facebook.png');
+  margin-right: 2px;
+  vertical-align: -3px;
+}
+.social a[href*='flickr.com']:before {
+  content: url('../images/icons/flickr.png');
+  margin-right: 2px;
+  vertical-align: -3px;
+}
+.social a[href*='forrst.com']:before {
+  content: url('../images/icons/forrst.png');
+  margin-right: 2px;
+  vertical-align: -3px;
+}
+.social a[href*='github.com']:before {
+  content: url('../images/icons/github.png');
+  margin-right: 2px;
+  vertical-align: -3px;
+}
+.social a[href*='plus.google.com']:before {
+  content: url('../images/icons/google_plus.png');
+  margin-right: 2px;
+  vertical-align: -3px;
+}
+.social a[href*='last.fm']:before {
+  content: url('../images/icons/lastfm.png');
+  margin-right: 2px;
+  vertical-align: -3px;
+}
+.social a[href*='linkedin.com']:before {
+  content: url('../images/icons/linkedin.png');
+  margin-right: 2px;
+  vertical-align: -3px;
+}
+.social a[href*='quora.com']:before {
+  content: url('../images/icons/quora.png');
+  margin-right: 2px;
+  vertical-align: -3px;
+}
+.social a[href*='rss.xml']:before {
+  content: url('../images/icons/rss.png');
+  margin-right: 2px;
+  vertical-align: -3px;
+}
+.social a[href*='stackoverflow.com']:before {
+  content: url('../images/icons/stackoverflow.png');
+  margin-right: 2px;
+  vertical-align: -3px;
+}
+.social a[href*='twitter.com']:before {
+  content: url('../images/icons/twitter.png');
+  margin-right: 2px;
+  vertical-align: -3px;
+}
+.social a[href*='youtube.com']:before {
+  content: url('../images/icons/youtube.png');
+  margin-right: 2px;
+  vertical-align: -3px;
+}
+.wrapper {
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  -o-box-sizing: border-box;
+  box-sizing: border-box;
+  padding: 0 0.75em;
+}
+.content {
+  margin: 0 5.555555555555555%;
+}
+.meta {
+  background: #fafafa;
+  margin-top: 48px;
+  padding-bottom: 24px;
+  padding-top: 24px;
+  -webkit-border-radius: 4px;
+  -moz-border-radius: 4px;
+  border-radius: 4px;
+  -moz-background-clip: padding;
+  -webkit-background-clip: padding-box;
+  background-clip: padding-box;
+}
+.meta time {
+  font-weight: 700;
+  margin-left: 20px;
+  margin-bottom: 24px;
+}
+.tag li {
+  display: block;
+  float: left;
+  width: 50%;
+}
+blockquote,
+code,
+.codehilite,
+.post ul,
+.post ol,
+p,
+.archive {
+  margin: 0 0 24px 0;
+}
+.main + .main {
+  margin-top: 96px;
+}
+@media screen and (min-width: 45em) {
+  header .wrapper {
+    float: right;
+    width: 75%;
+  }
+  .meta, .pages {
+    float: left;
+    text-align: right;
+    width: 25%;
+  }
+  .meta {
+    background: #ffffff;
+    margin-top: 0;
+    padding-top: 60px;
+  }
+  .meta time {
+    margin-bottom: 24px;
+    margin-left: 0;
+    font-weight: 400;
+  }
+  .post, .copy, .main {
+    float: right;
+    width: 75%;
+  }
+  .tag li {
+    float: none;
+    width: 100%;
+  }
+  .nav a:hover {
+    padding-right: 6px;
+  }
+  .nav a:hover:after {
+    content: "\2192 ";
+  }
+  .nav li {
+    display: block;
+    padding-right: 0;
+  }
+  .archive time {
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    -o-box-sizing: border-box;
+    box-sizing: border-box;
+    display: block;
+    float: left;
+    width: 25%;
+  }
+}
+@media screen and (min-width: 55.5em) {
+  .post > p,
+  .post blockquote,
+  .post ul,
+  .post ol {
+    width: 66.66666666666667%;
+  }
+  .main {
+    float: none;
+    margin-left: 25%;
+    width: 50%;
+  }
+}
+@media screen and (min-width: 61.5em) {
+  .meta, .pages {
+    width: 12.5%;
+  }
+  .pages {
+    padding-top: 0;
+  }
+  .meta {
+    padding-top: 60px;
+  }
+}
+@media screen and (min-width: 117em) {
+  body {
+    font-size: 18px;
+  }
+  header {
+    margin-bottom: 96px;
+  }
+  footer {
+    margin-top: 144px;
+  }
+  h1 {
+    font-size: 48px;
+    margin-bottom: 48px;
+  }
+  h2, header .huge {
+    font-size: 36px;
+  }
+  h2 {
+    margin-top: 72px;
+  }
+  h3 {
+    font-size: 24px;
+    margin-top: 72px;
+  }
+  h4, h5, h6 {
+    font-size: 18px;
+    margin-top: 48px;
+  }
+  .meta, .pages {
+    padding-left: 6.25%;
+    width: 18.75%;
+  }
+  .meta {
+    padding-top: 96px;
+  }
+  .post, .copy {
+    width: 75%;
+  }
+  .post {
+    padding-right: 12.5%;
+  }
+  .post ul {
+    margin-bottom: 0;
+  }
+  .post li {
+    margin-bottom: 24px;
+  }
+  code, .codehilite {
+    line-height: 1.5;
+    font-size: 36px;
+  }
+  .post > p,
+  .post blockquote,
+  .post ul,
+  .post ol {
+    width: 60%;
+  }
+}
+@media screen and (min-width: 130em) {
+  body {
+    max-width: 160em;
+  }
+}
+@media print {
+  * {
+    background: transparent !important;
+    box-shadow: none !important;
+    color: black !important;
+    filter: none !important;
+    -ms-filter: none !important;
+    text-shadow: none !important;
+  }
+  @page  {
+    margin: 0.5cm;
+  }
+  a, a:visited {
+    color: #000000 !important;
+    text-decoration: underline;
+  }
+  a[href]:after {
+    content: " (" attr(href) ")";
+  }
+  a[href^="javascript:"]:after, a[href^="#"]:after, .ir a:after {
+    content: "";
+  }
+  abbr[title]:after {
+    content: " (" attr(title) ")";
+  }
+  body {
+    font-size: 12pt;
+  }
+  blockquote, pre {
+    page-break-inside: avoid;
+  }
+  blockquote, pre {
+    margin-left: 0.5cm;
+    border-left: 0.2cm solid #999;
+    padding-left: 0.2cm;
+  }
+  code, pre {
+    font: 10pt Courier, monospace;
+  }
+  h1 {
+    font-size: 18pt;
+  }
+  h2, h3 {
+    page-break-after: avoid;
+    font-size: 16pt;
+  }
+  h2, h3, p {
+    orphans: 3;
+    widows: 3;
+  }
+  img {
+    max-width: 100% !important;
+  }
+  img, tr {
+    page-break-inside: avoid;
+  }
+  thead {
+    display: table-header-group;
+  }
+}
+.c {
+  color: #757575;
+}
+/* Comment */
+.err {
+  color: #fa4753;
+}
+/* Error */
+.k {
+  color: #6bc5d9;
+}
+/* Keyword */
+.l {
+  color: #514986;
+}
+/* Literal */
+.n {
+  color: #f8f8f2;
+}
+/* Name */
+.o {
+  color: #f92672;
+}
+/* Operator */
+.p {
+  color: #f8f8f2;
+}
+/* Punctuation */
+.cm {
+  color: #757575;
+}
+/* Comment.Multiline */
+.cp {
+  color: #757575;
+}
+/* Comment.Preproc */
+.c1 {
+  color: #757575;
+}
+/* Comment.Single */
+.cs {
+  color: #757575;
+}
+/* Comment.Special */
+/* Generic.Emph */
+/* Generic.Strong */
+.kc {
+  color: #6bc5d9;
+}
+/* Keyword.Constant */
+.kd {
+  color: #6bc5d9;
+}
+/* Keyword.Declaration */
+.kn {
+  color: #f92672;
+}
+/* Keyword.Namespace */
+.kp {
+  color: #6bc5d9;
+}
+/* Keyword.Pseudo */
+.kr {
+  color: #6bc5d9;
+}
+/* Keyword.Reserved */
+.kt {
+  color: #6bc5d9;
+}
+/* Keyword.Type */
+.ld {
+  color: #f4e07c;
+}
+/* Literal.Date */
+.m {
+  color: #514986;
+}
+/* Literal.Number */
+.s {
+  color: #f4e07c;
+}
+/* Literal.String */
+.na {
+  color: #9cc52c;
+}
+/* Name.Attribute */
+.nb {
+  color: #f8f8f2;
+}
+/* Name.Builtin */
+.nc {
+  color: #9cc52c;
+}
+/* Name.Class */
+.no {
+  color: #6bc5d9;
+}
+/* Name.Constant */
+.nd {
+  color: #9cc52c;
+}
+/* Name.Decorator */
+.ni {
+  color: #f8f8f2;
+}
+/* Name.Entity */
+.ne {
+  color: #9cc52c;
+}
+/* Name.Exception */
+.nf {
+  color: #9cc52c;
+}
+/* Name.Function */
+.nl {
+  color: #f8f8f2;
+}
+/* Name.Label */
+.nn {
+  color: #f8f8f2;
+}
+/* Name.Namespace */
+.nx {
+  color: #9cc52c;
+}
+/* Name.Other */
+.py {
+  color: #f8f8f2;
+}
+/* Name.Property */
+.nt {
+  color: #f92672;
+}
+/* Name.Tag */
+.nv {
+  color: #f8f8f2;
+}
+/* Name.Variable */
+.ow {
+  color: #f92672;
+}
+/* Operator.Word */
+.w {
+  color: #f8f8f2;
+}
+/* Text.Whitespace */
+.mf {
+  color: #514986;
+}
+/* Literal.Number.Float */
+.mh {
+  color: #514986;
+}
+/* Literal.Number.Hex */
+.mi {
+  color: #514986;
+}
+/* Literal.Number.Integer */
+.mo {
+  color: #514986;
+}
+/* Literal.Number.Oct */
+.sb {
+  color: #f4e07c;
+}
+/* Literal.String.Backtick */
+.sc {
+  color: #f4e07c;
+}
+/* Literal.String.Char */
+.sd {
+  color: #f4e07c;
+}
+/* Literal.String.Doc */
+.s2 {
+  color: #f4e07c;
+}
+/* Literal.String.Double */
+.se {
+  color: #514986;
+}
+/* Literal.String.Escape */
+.sh {
+  color: #f4e07c;
+}
+/* Literal.String.Heredoc */
+.si {
+  color: #f4e07c;
+}
+/* Literal.String.Interpol */
+.sx {
+  color: #f4e07c;
+}
+/* Literal.String.Other */
+.sr {
+  color: #f4e07c;
+}
+/* Literal.String.Regex */
+.s1 {
+  color: #f4e07c;
+}
+/* Literal.String.Single */
+.ss {
+  color: #f4e07c;
+}
+/* Literal.String.Symbol */
+.bp {
+  color: #f8f8f2;
+}
+/* Name.Builtin.Pseudo */
+.vc {
+  color: #f8f8f2;
+}
+/* Name.Variable.Class */
+.vg {
+  color: #f8f8f2;
+}
+/* Name.Variable.Global */
+.vi {
+  color: #f8f8f2;
+}
+/* Name.Variable.Instance */
+.il {
+  color: #514986;
+}
+/* Literal.Number.Integer.Long */
\ No newline at end of file
diff --git a/Just-Read/static/images/2px.png b/Just-Read/static/images/2px.png
new file mode 100644
index 0000000..31b24fc
--- /dev/null
+++ b/Just-Read/static/images/2px.png
diff --git a/Just-Read/static/images/bullet.png b/Just-Read/static/images/bullet.png
new file mode 100644
index 0000000..96210f1
--- /dev/null
+++ b/Just-Read/static/images/bullet.png
diff --git a/Just-Read/static/images/pages.png b/Just-Read/static/images/pages.png
new file mode 100644
index 0000000..93ed30e
--- /dev/null
+++ b/Just-Read/static/images/pages.png
diff --git a/Just-Read/templates/archives.html b/Just-Read/templates/archives.html
new file mode 100644
index 0000000..72fd2a5
--- /dev/null
+++ b/Just-Read/templates/archives.html
@@ -0,0 +1,46 @@
+{% extends "base.html" %}
+{% block title %}Archivo - {{ SITENAME }}{% endblock %}
+
+{% block scripts %}
+	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
+	<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
+{% endblock %}
+
+
+{% block content %}
+<div role="main" class="content clearfix">
+<div id="jquerytabs" class="wrapper main">
+	<ul class="tabmenu clearfix">
+		<li><a href="#fecha">By date</a></li>
+		<li><a href="#etiqueta">By topic</a></li>
+	</ul>
+	
+	<div id="fecha">	
+	{% for year, date_year in dates|groupby( 'date.year' )|sort(reverse=True) %}	
+		<h2>{{ year }}</h2>
+		<ol class="archive">
+			{% for article in date_year %}
+			<li class="clearfix"><a href="{{ article.url }}"><time datetime="{{ article.date.isoformat() }}" pubdate>{{ article.locale_date }}</time> {{ article.title }}</a></li>
+			{% endfor %}
+		</ol>
+	{% endfor %}
+	</div>
+	
+	<div id="etiqueta">
+		<h2>Tags</h2>
+		<ul class="tag">
+		{% for tag in tag_cloud|sort %}
+		    <li class="tag-{{ tag.1 }}"><a href="{{ SITEURL }}/tag/{{ tag.0 }}.html">{{ tag.0 }}</a></li>
+		{% endfor %}
+		</ul>
+	</div>
+		
+</div>
+</div>
+
+<script>
+	$(function() {
+		$("#jquerytabs").tabs();
+	});
+</script>
+{% endblock %}
\ No newline at end of file
diff --git a/Just-Read/templates/article.html b/Just-Read/templates/article.html
new file mode 100644
index 0000000..58df95f
--- /dev/null
+++ b/Just-Read/templates/article.html
@@ -0,0 +1,32 @@
+{% extends "base.html" %}
+{% block title %}{{ article.title }} - {{ SITENAME }}{% endblock %}
+{% block content %}
+<div role="main" class="content clearfix">	
+	<article>
+		<div class="post wrapper">
+			<h1>{{ article.title }}</h1>
+			{{ article.content }}
+			
+			<a href="https://twitter.com/share" class="twitter-share-button" data-via="{{ TWITTER_USERNAME }}" data-lang="en" data-size="large" data-related="{{ TWITTER_USERNAME }}">Tweet</a>
+			<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>
+						
+			{% if DISQUS_SITENAME %}
+			<div class="comments">
+			<h2>Comments !</h2>
+			    <div id="disqus_thread"></div>
+			    <script type="text/javascript">
+			       var disqus_identifier = "{{ article.url }}";
+			       (function() {
+			       var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
+			       dsq.src = 'http://{{ DISQUS_SITENAME }}.disqus.com/embed.js';
+			       (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
+			      })();
+			    </script>
+			</div>
+			{% endif %}			
+		</div>
+	
+	{% include 'metadata.html' %}
+	</article>	
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/Just-Read/templates/base.html b/Just-Read/templates/base.html
new file mode 100644
index 0000000..96511ad
--- /dev/null
+++ b/Just-Read/templates/base.html
@@ -0,0 +1,68 @@
+<!doctype html>
+<html lang="{{ HTML_LANG }}">	
+<head>
+	<meta charset="utf-8"/>
+	<title>{% block title %}{{ SITENAME }}{%endblock%}</title>	
+	<meta name="author" content="{{ AUTHOR }}">
+	
+	<meta name="HandheldFriendly" content="True">
+	<meta name="MobileOptimized" content="320">
+	<meta name="viewport" content="width=device-width, target-densitydpi=160dpi, initial-scale=1.0">
+	
+	<link href='http://fonts.googleapis.com/css?family=Droid+Sans:700,400|Droid+Sans+Mono' rel='stylesheet' type='text/css'>
+	<link rel="stylesheet" href="{{ SITEURL }}/theme/css/{{ CSS_FILE }}" type="text/css" />
+		
+	<!--[if lt IE 9]>
+		<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
+	<![endif]-->
+	
+	{% block scripts %}
+	{% endblock %}
+	
+	<link href="{{ SITEURL }}/{{ FEED }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} ATOM Feed" />
+	{% if FEED_RSS %}
+	<link href="{{ SITEURL }}/{{ FEED_RSS }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} RSS Feed" />
+	{% endif %}
+</head>
+	
+<body>		
+	<header class="clearfix" role="banner">
+		<div class="wrapper">
+			<h1 class="huge"><a href="{{ SITEURL }}">{{ SITENAME }}</a></h1>
+		</div>
+	</header>
+	
+	{% block content %}
+	{% endblock %}
+	
+		
+<footer class="clearfix">
+	<div class="wrapper pages">
+		<ul class="nav">
+		{% for p in PAGES %}
+			<li><a href="{{ SITEURL }}/pages/{{ p.url }}">{{ p.title }}</a></li>
+		{% endfor %}
+			<li><a href="{{ SITEURL }}/archives.html">Archive</a></li>
+		</ul>
+	</div>
+	
+	<div class="copy wrapper">
+		<ul class="social">
+			{% for name, link in SOCIAL %}
+			<li><a href="{{ link }}">{{ name }}</a></li>
+			{% endfor %}
+		</ul>
+	
+		<p role="contentinfo">© 2012 {{ AUTHOR }}<br>
+		Proudly powered by <a href="http://alexis.notmyidea.org/pelican/">Pelican</a>.</p>
+	</div>
+</footer>
+	
+	<script>
+	  var _gaq=[['_setAccount','{{ GOOGLE_ANALYTICS }}'],['_trackPageview']];
+	  (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
+	  g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
+	  s.parentNode.insertBefore(g,s)}(document,'script'));
+	</script>
+</body>
+</html>
\ No newline at end of file
diff --git a/Just-Read/templates/categories.html b/Just-Read/templates/categories.html
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/Just-Read/templates/categories.html
diff --git a/Just-Read/templates/category.html b/Just-Read/templates/category.html
new file mode 100644
index 0000000..20cdc17
--- /dev/null
+++ b/Just-Read/templates/category.html
@@ -0,0 +1,17 @@
+{% extends "base.html" %}
+{% block title %}{{ category }} - {{ SITENAME }}{% endblock %}
+
+{% block content %}
+<div role="main" class="content clearfix">
+<div class="wrapper main">		
+	<h2>Posts categorized under: {{ category }}</h2>
+	
+	<ol class="archive">
+		{% for article in articles %}
+		<li class="clearfix"><a href="{{ SITEURL }}/{{ article.url }}"><time datetime="{{ article.date.isoformat() }}" pubdate>{{ article.locale_date }}</time> {{ article.title }}</a></li>
+		{% endfor %}
+	</ol>
+
+</div>
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/Just-Read/templates/index.html b/Just-Read/templates/index.html
new file mode 100644
index 0000000..f1dab78
--- /dev/null
+++ b/Just-Read/templates/index.html
@@ -0,0 +1,28 @@
+{% extends "base.html" %}
+{% block content_title %}{% endblock %}
+
+{% block content %}
+<div role="main" class="content clearfix">
+{% for article in articles %}
+
+	{% if loop.index == 1 %}
+	<article class="wrapper main">
+		<h1><a href="{{ SITEURL }}/{{ article.url }}">{{ article.title }}</a></h1>
+		{{ article.summary }} <a class="btn" href="{{ SITEURL }}/{{ article.url }}">read more →</a>
+	</article>
+
+	{% if loop.length  > 1 %}
+	<div class="wrapper main">		
+		<h3>More posts</h3>
+		<ol class="archive">
+	{% endif %}
+	{% elif loop.index < 7 %}
+			<li class="clearfix"><a href="{{ SITEURL }}/{{ article.url }}" rel="bookmark" title="Permalink to {{ article.title}}"><time datetime="{{ article.date.isoformat() }}" pubdate>{{ article.locale_date }}</time> {{ article.title }}</a></li>
+	{% endif %}
+	{% endfor %}
+		</ol>
+		
+		<p>More posts in the <a href="{{ SITEURL }}/archives.html">archive</a>.</p>
+	</div>
+</div>
+{% endblock content %}
\ No newline at end of file
diff --git a/Just-Read/templates/metadata.html b/Just-Read/templates/metadata.html
new file mode 100644
index 0000000..c051c75
--- /dev/null
+++ b/Just-Read/templates/metadata.html
@@ -0,0 +1,12 @@
+<div class="meta wrapper">
+	<time datetime="{{ article.date.isoformat() }}" pubdate>{{ article.locale_date }}</time>
+	<ul class="tag clearfix">
+		<li><a href="{{ SITEURL }}/category/{{ article.category }}.html">{{ article.category }}</a></li>
+{% if article.tags %}
+	{% for tag in article.tags %}
+		<li><a href="{{ SITEURL }}/tag/{{ tag }}.html">{{ tag }}</a></li>
+	{% endfor %}
+{% endif %}
+	</ul>
+	{% if PDF_PROCESSOR %}<p><a href="{{ SITEURL }}/pdf/{{ article.slug }}.pdf">Download the .pdf</a></p>{% endif %}
+</div>
\ No newline at end of file
diff --git a/Just-Read/templates/page.html b/Just-Read/templates/page.html
new file mode 100644
index 0000000..bb23568
--- /dev/null
+++ b/Just-Read/templates/page.html
@@ -0,0 +1,10 @@
+{% extends "base.html" %}
+{% block title %}{{ page.title }}- {{ SITENAME }}{% endblock %}
+{% block content %}
+<div role="main" class="content clearfix">	
+	<div class="post wrapper">
+		<h1>{{ page.title }}</h1>
+		{{ page.content }}		
+	</div>
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/Just-Read/templates/tag.html b/Just-Read/templates/tag.html
new file mode 100644
index 0000000..f5ebd56
--- /dev/null
+++ b/Just-Read/templates/tag.html
@@ -0,0 +1,16 @@
+{% extends "base.html" %}
+{% block title %}{{ tag }} - {{ SITENAME }}{% endblock %}
+{% block content %}
+<div role="main" class="content clearfix">
+<div class="wrapper main">		
+	<h2>Post tagged: {{ tag }}</h2>
+	
+	<ol class="archive">
+		{% for article in articles %}
+		<li class="clearfix"><a href="{{ SITEURL }}/{{ article.url }}"><time datetime="{{ article.date.isoformat() }}" pubdate>{{ article.locale_date }}</time> {{ article.title }}</a></li>
+		{% endfor %}
+	</ol>
+
+</div>
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/Just-Read/templates/tags.html b/Just-Read/templates/tags.html
new file mode 100644
index 0000000..8ddbcd1
--- /dev/null
+++ b/Just-Read/templates/tags.html
@@ -0,0 +1,17 @@
+{% extends "base.html" %}
+{% block title %}{{ SITENAME }}{% endblock %}
+
+{% block content %}
+<div role="main" class="content clearfix">
+<div class="wrapper main">  	
+	<h2>Tags</h2>
+	
+	<ul class="tag">
+    {% for tag in tag_cloud %}
+        <li class="tag-{{ tag.1 }}"><a href="{{ SITEURL }}/tag/{{ tag.0 }}.html">{{ tag.0 }}</a></li>
+    {% endfor %}
+	</ul>
+
+</div>
+</div>
+{% endblock %}
\ No newline at end of file