Basic styles for a Camel.js blog

site.css

body{background-color:#FFF;color:#303030;line-height:1.6;font-size:16pt;font-weight:300}
a{text-decoration:none;color:#0083ff}
time{color:#ababab}
.super{vertical-align:super;font-size:50%}
.content{text-align:left;max-width:775px;margin:0 auto 2em}
.content ul{padding-left:2.5em}
.content ol{padding-left:2.5em}
.container{margin-bottom:3em;margin-left:1em;margin-right:1em}
.content .header{text-align:center;border-bottom-style:solid;border-bottom-color:#e4e4e4;border-bottom-width:.3em}
.content .header .siteTitle{font-size:3.5em;font-weight:700;margin-top:-.25em}
.content .header .siteTitle a{text-decoration:none;color:#000}
.content .header .siteTitle a:visited{color:#000}
.content .header .siteByline{font-size:.7em;margin-bottom:1.2em;margin-top:-1em}
.content .header nav{text-transform:uppercase;font-size:.85em;color:#e4e4e4;margin-bottom:1em}
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
  .center img.wide{width:115%!important;max-width:115%!important}
}
@media all and (max-width: 568px) {
  .container{margin-left:auto;margin-right:auto}
  .content{max-width:90%}
  .content .main{font-size:18px}
  .content .header .siteTitle{font-size:40px}
  .content .header .siteByline{font-size:10px}
  .content .header nav{font-size:14px}
  .content .header{margin-bottom:1em}
  .content .header nav{margin-bottom:1em}
  .content .header nav a{margin:0 .2em;font-size:12px}
  .content ol{margin-left:.25em}
  .homepage h1 a{font-size:2em!important}
  .center img.wide{width:120%!important;max-width:120%!important}
}
.content pre{font-size:.9em}
.copyright{font-size:.6em;text-align:center}
.center{display:block;margin-left:auto;margin-right:auto;text-align:center}
.center img.left{margin-right:2em}
.center img.right{margin-left:2em}
.center img.wide{width:140%;max-width:140%;margin:0 -20%}
.content img{max-width:100%}
.header .dot{font-weight:700;margin-left:.25em}
table.sortable thead{cursor:default}
blockquote{border-left:4px solid #e4e4e4;margin-left:1em;padding-left:1em}
.homepage .day .daybreak{margin-top:3em;border:0;color:#e4e4e4;background-color:#e4e4e4;height:.15em}
.homepage .postHeader{margin-top:3em;margin-bottom:2em}
.homepage .postHeader:nth-of-type(1){margin-top:2em}
.homepage .postHeader h1{font-size:2.2em;font-weight:500;line-height:1.2;margin:0}
.postHeader h1 img{width:1.5em;height:1.5em;top:.4em;position:relative}
a.postTitle{display:block}
body pre{line-height:1}
.homepage .postHeader .postDate{font-size:.9em;display:block}
.homepage .day .article{margin-bottom:2em}
.homepage .copyright{margin-top:-2em}
.homepage .article hr{width:35%;margin-top:2em;margin-bottom:2em;border-top:1px dashed #000}
.homepage .article th{padding:0 .5em}
.homepage .article td{padding:0 .5em}
.homepage .paginationFooter{width:100%;margin-top:1em}
.homepage .paginationFooterPrevious{display:inline}
.homepage .paginationFooterNext{display:inline;float:right}
.post .postHeader{text-align:left;margin-bottom:1em}
.post .postHeader h1{margin:0;margin-top:1em;font-size:2em;text-decoration:none}
a.linked,a.linked:active,a.linked:visited{color:#b5190e;text-decoration:underline}
.postHeader .postPermalink img{width:1.5em;height:1.5em;top:5px;position:relative}
.post .postHeader .postDate{display:block;font-size:.9em}
figure{display:inline;float:right}
figure.figleft{display:inline;float:left}
figcaption{text-align:center;font-style:italic}
section.footnotes{font-size:.8em}
.post .postHeader h1 a:visited{color:#000}
.post hr{width:35%;margin-top:2em;margin-bottom:2em;border-top:1px dashed #000}
.homepage .article hr.footnotes-sep{width:50%;border-top:1px solid #555}
.post hr.footnotes-sep{width:70%;border-top:1px solid #555}
.post th{padding:0 .5em}
.post td{padding:0 .5em}
.headshot{float:left;display:inline;width:250px;margin-right:1em}
p.taggedIn{padding:12px 10px;background:#eee;border:1px solid #ccc;margin-top:25px;font-size:14px}
p.taggedIn a{font-size:14px}