html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {
margin:0;
padding:0;
border:0;
font:inherit;
font-size:100%;
vertical-align:baseline;
}
html {
line-height:1;
}
ol,ul {
list-style:none;
}
table {
border-collapse:collapse;
border-spacing:0;
}
caption,th,td {
text-align:left;
font-weight:400;
vertical-align:middle;
}
q,blockquote {
quotes:none;
}
q:before,q:after,blockquote:before,blockquote:after {
content:"";
content:none;
}
a img {
border:none;
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary {
display:block;
}
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {
margin:0;
padding:0;
border:0;
font:inherit;
font-size:100%;
vertical-align:baseline;
}
html {
line-height:1;
}
ol,ul {
list-style:none;
}
table {
border-collapse:collapse;
border-spacing:0;
}
caption,th,td {
text-align:left;
font-weight:400;
vertical-align:middle;
}
q,blockquote {
quotes:none;
}
q:before,q:after,blockquote:before,blockquote:after {
content:"";
content:none;
}
a img {
border:none;
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary {
display:block;
}
.hljs {
display:block;
padding:.5em;
color:#333;
background:#f8f8f8;
}
.hljs-comment,.hljs-template_comment,.diff .hljs-header,.hljs-javadoc {
color:#998;
font-style:italic;
}
.hljs-keyword,.css .rule .hljs-keyword,.hljs-winutils,.javascript .hljs-title,.nginx .hljs-title,.hljs-subst,.hljs-request,.hljs-status {
color:#333;
font-weight:700;
}
.hljs-number,.hljs-hexcolor,.ruby .hljs-constant {
color:#099;
}
.hljs-string,.hljs-tag .hljs-value,.hljs-phpdoc,.tex .hljs-formula {
color:#d14;
}
.hljs-title,.hljs-id,.coffeescript .hljs-params,.scss .hljs-preprocessor {
color:#900;
font-weight:700;
}
.javascript .hljs-title,.lisp .hljs-title,.clojure .hljs-title,.hljs-subst {
font-weight:400;
}
.hljs-class .hljs-title,.haskell .hljs-type,.vhdl .hljs-literal,.tex .hljs-command {
color:#458;
font-weight:700;
}
.hljs-tag {
color:navy;
font-weight:400;
}
.hljs-tag .hljs-title {
color:navy;
font-weight:400;
}
.hljs-rules .hljs-property,.django .hljs-tag .hljs-keyword {
color:navy;
font-weight:400;
}
.hljs-attribute,.hljs-variable,.lisp .hljs-body {
color:teal;
}
.hljs-regexp {
color:#009926;
}
.hljs-symbol,.ruby .hljs-symbol .hljs-string,.lisp .hljs-keyword,.tex .hljs-special,.hljs-prompt {
color:#990073;
}
.hljs-built_in,.lisp .hljs-title,.clojure .hljs-built_in {
color:#0086b3;
}
.hljs-preprocessor,.hljs-pragma,.hljs-pi,.hljs-doctype,.hljs-shebang,.hljs-cdata {
color:#999;
font-weight:700;
}
.hljs-deletion {
background:#fdd;
}
.hljs-addition {
background:#dfd;
}
.diff .hljs-change {
background:#0086b3;
}
.hljs-chunk {
color:#aaa;
}
body {
font-family:Open Sans,Helvetica,sans-serif;
line-height:150%;
font-size:16px;
}
h1 {
font-family:Rambla,sans-serif;
font-size:32px;
font-size:2rem;
line-height:1.2em;
font-weight:700;
text-align:center;
}
h2 {
font-family:Rambla,sans-serif;
margin:1em 0;
font-size:32px;
font-size:2rem;
}
h3 {
margin:1em 0;
font-size:24px;
font-size:1.5rem;
font-weight:600;
}
h4 {
margin:1em 0;
font-size:16px;
font-size:1rem;
font-weight:700;
}
h5 {
margin:1em 0;
font-size:12px;
font-size:.75rem;
font-weight:400;
text-transform:uppercase;
}
a {
text-decoration:none;
color:#4183c4;
font-weight:700;
-webkit-transition:200ms;
-moz-transition:200ms;
-o-transition:200ms;
transition:200ms;
}
a:hover {
text-decoration:underline;
color:#4183c4;
}
p {
line-height:150%;
margin:1.5em 0;
}
code {
border-radius:3px;
padding:0 5px;
background-color:#f7f7f7;
border:1px solid #d3d3d3;
font-size:13px;
font-family:Source Code Pro, monospace;
white-space: pre-wrap; /* CSS 3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
}
pre {
margin:1.5em 0;
background-color:#f7f7f7;
border:1px solid #d3d3d3;
font-size:13px;
line-height:19px;
overflow:auto;
padding:6px 10px;
border-radius:3px;
}
pre code {
border-radius:0;
padding:0;
border:none;
white-space:inherit;
}
img {
display:block;
max-width:100%;
height:auto;
margin-left:auto;
margin-right:auto;
}
ol {
list-style:decimal;
margin-left:24px;
}
ol li {
margin:.5em 0;
}
ul {
margin-left:18px;
list-style:square;
line-height:1.5em;
}
ul li {
margin:.5em 0;
}
em {
font-style:italic;
}
strong {
font-weight:700;
}
blockquote {
margin:1.5em 0;
padding-left:20px;
border-left:4px solid #d3d3d3;
color:#777;
}
blockquote p {
font-style:italic;
}
q {
display:block;
width:100%;
margin-left:0;
margin-top:1.5em;
margin-bottom:1.5em;
margin-right:0;
font-weight:300;
font-size:1.5rem;
line-height:130%;
text-align:center;
font-style:italic;
}
q::before {
content:"\201C";
}
q::after {
content:"\201D";
}
@media screen and min-width 25em{
h1 {
font-size:40px;
font-size:2.5rem;
}
q {
width:110%;
margin-left:-5%;
margin-top:1.5em;
margin-bottom:1.5em;
margin-right:0;
}
}
@media screen and min-width 40em{
blockquote {
margin-left:-24px;
}
q {
width:120%;
margin-left:-10%;
margin-top:1.5em;
margin-bottom:1.5em;
margin-right:0;
}
ul,ol {
margin-left:0;
}
h1 {
font-size:48px;
font-size:3rem;
}
}
@media screen and min-width 65em{
h1 {
font-size:64px;
font-size:4rem;
}
}
html {
height:100%;
max-height:100%;
}
body {
height:100%;
max-height:100%;
}
header.site-header.cover {
display:0;
display:0;
display:0;
display:0;
display:flex;
width:100%;
height:24.5em;
text-align:center;
color:#fff;
background:#333 no-repeat center center;
background-size:cover;
}
header.site-header.cover section.header-content {
margin:auto;
display:0;
display:0;
display:0;
display:0;
display:flex;
-webkit-box-direction:normal;
-webkit-box-orient:vertical;
-webkit-flex-direction:column;
-moz-flex-direction:column;
-ms-flex-direction:column;
flex-direction:column;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}
header.site-header.cover section.header-content a.blog-title {
display:block;
font-family:Rambla,sans-serif;
font-size:32px;
font-size:7rem;
line-height:1.2em;
color:#FFF;
}
header.site-header.cover section.header-content a.blog-title:hover {
text-decoration:none;
}
header.site-header.cover section.header-content span.blog-description {
font-size:34px;
font-size:1.5rem;
line-height:1.3em;
margin-top:0;
display:block;
}
header.site-header.cover nav.links {
margin-top:0;
font-size:24px;
font-size:1.5rem;
}
header.site-header.cover nav.links li {
margin:0;
}
header.site-header.cover nav.links li a {
color:#FFF;
}
header.site-header.cover nav.links li a:hover {
color:#4183c4;
}
header.site-header.compact {
border-bottom:2px solid #f7f7f7;
}
header.site-header.compact section.header-content {
max-width:700px;
padding:0 1.5em;
margin:0 auto;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
display:0;
display:0;
display:0;
display:0;
display:flex;
-webkit-box-direction:normal;
-webkit-box-orient:vertical;
-webkit-flex-direction:column;
-moz-flex-direction:column;
-ms-flex-direction:column;
flex-direction:column;
overflow:auto;
line-height:4em;
}
header.site-header.compact section.header-content a.blog-title {
float:left;
-webkit-box-flex:1;
-moz-box-flex:1;
-webkit-flex:1;
-ms-flex:1;
flex:1;
margin:auto;
color:#333;
font-family:Rambla,sans-serif;
font-weight:700;
font-size:1.3em;
text-decoration:none;
}
header.site-header.compact section.header-content a.blog-title:hover {
color:#4183c4;
}
header.site-header.compact section.header-content span.blog-description {
display:none;
}
header.site-header.compact section.header-content nav.links {
text-align:right;
}
header.site-header nav.links {
margin:auto;
-webkit-box-flex:1;
-moz-box-flex:1;
-webkit-flex:1;
-ms-flex:1;
flex:1;
font-size:19.2px;
font-size:1.2rem;
list-style:none;
}
header.site-header nav.links li {
display:inline-block;
}
header.site-header nav.links ul {
line-height:64px;
margin:0;
}
header.site-header nav.links ul li {
margin:0;
}
header.site-header nav.links a {
text-decoration:none;
color:#333;
-webkit-transition:200ms;
-moz-transition:200ms;
-o-transition:200ms;
transition:200ms;
}
header.site-header nav.links a:hover {
color:#4183c4;
}
header.site-header nav.links .rss a:hover {
color:#ff7e00!important;
}
header.site-header nav.links .gplus a:hover {
color:#dd4b39!important;
}
header.site-header nav.links .twitter a:hover {
color:#55acee!important;
}
header.site-header nav.links .flickr a:hover {
color:#ff0084!important;
}
main {
max-width:700px;
width:100%;
margin:0 auto;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
padding:1.5em;
}
main.index .post-title a,main.index .pagination a {
color:#333;
text-decoration:none;
font-weight:400;
}
main.index .post-title a:hover,main.index .pagination a:hover {
color:#4183c4;
}
main.index article.post {
margin:2em 0;
border-bottom:2px solid #f7f7f7;
padding-bottom:2em;
}
main.index article.post:first-child {
margin-top:0;
}
main.index article.post:last-child {
margin-bottom:0;
}
main.index article.post header.meta .date {
display:block;
margin:1em 0;
color:#a2a2a2;
text-align:center;
}
main.post article.content header.meta .date,main.page article.content header.meta .date {
display:block;
margin:1em 0;
color:#a2a2a2;
text-align:center;
}
main.post article.content section.byline span.author,main.page article.content section.byline span.author {
color:#a2a2a2;
font-weight:300;
}
main.post article.content section.byline span.author a,main.page article.content section.byline span.author a {
color:#a2a2a2;
font-weight:300;
font-style:italic;
text-decoration:none;
}
main.post article.content section.byline span.author a:hover,main.page article.content section.byline span.author a:hover {
text-decoration:none;
}
main.post article.content section.comments,main.page article.content section.comments {
margin-top:3em;
}
main .pagination {
width:100%;
position:relative;
text-align:center;
color:#d3d3d3;
}
main .pagination i {
color:#d3d3d3;
}
main .pagination .newer-posts {
position:absolute;
left:0;
}
main .pagination .older-posts {
position:absolute;
right:0;
}
main .pagination .pagination-text {
display:none;
}
footer {
border-top:2px solid #f7f7f7;
color:#d3d3d3;
}
footer a {
color:#d3d3d3;
text-decoration:none;
font-weight:400;
}
footer section.colophon {
display:block;
max-width:700px;
padding:2em;
margin:0 auto;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
text-align:center;
}
footer section.colophon section {
margin-bottom:.5em;
}
footer section.colophon section:last-child {
margin-bottom:0;
}
@media screen and min-height 375em{
header.site-header.cover {
height:15em;
}
header.site-header.cover section.header-content span.blog-description {
margin-top:1em;
}
header.site-header.cover nav.links {
margin-top:1em;
}
}
@media screen and min-width 25em{
header.site-header.compact section.header-content {
padding:0 2em;
-webkit-box-direction:normal;
-webkit-box-orient:horizontal;
-webkit-flex-direction:row;
-moz-flex-direction:row;
-ms-flex-direction:row;
flex-direction:row;
}
header.site-header.cover section.header-content a.blog-title {
font-size:40px;
font-size:2.5rem;
}
main {
padding:2em;
}
main h1.post-title,main h1.page-title {
width:110%;
margin-left:-5%;
}
main.index article.post {
margin:2em 0;
}
.pagination span.pagination-text {
display:inline;
}
}
@media screen and min-height 45em{
header.site-header.cover {
height:31.25em;
}
}
@media screen and min-width 40em{
header.site-header.compact section.header-content {
padding:0 2.5em;
}
header.site-header.cover section.header-content a.blog-title {
font-size:48px;
font-size:3rem;
}
header.site-header.cover nav.links {
font-size:32px;
font-size:2rem;
}
main {
padding:2.5em;
}
main.index article.post {
margin:2.5em 0;
}
}
@media screen and min-height 60em{
header.site-header.cover {
height:37.5em;
}
}
@media screen and min-width 65em{
header.site-header.compact section.header-content {
padding:0 3em;
}
header.site-header.cover section.header-content a.blog-title {
font-size:64px;
font-size:4rem;
}
main {
padding:3em;
}
main.index article.post {
margin:3em 0;
}
main h1.post-title,main h1.page-title {
width:150%;
margin-left:-25%;
}
}
ul, ol { margin-left: 1em; }