add client side social integration, use webassets

1 files changed, 1413 insertions, 0 deletions

diff --git a/syte/static/css/styles.css b/syte/static/css/styles.css
new file mode 100644
index 0000000..09b7be3
--- /dev/null
+++ b/syte/static/css/styles.css
@@ -0,0 +1,1413 @@
+html,body {
+margin:0;
+padding:0;
+}
+
+h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,cite,code,del,dfn,em,img,q,s,samp,small,strike,strong,sub,sup,tt,var,dd,dl,dt,li,ol,ul,fieldset,form,label,legend,button,table,caption,tbody,tfoot,thead,tr,th,td {
+border:0;
+font-weight:400;
+font-style:normal;
+font-size:100%;
+font-family:inherit;
+margin:0;
+padding:0;
+}
+
+em,i {
+font-style:italic;
+}
+
+body {
+line-height:1;
+font-family:Helvetica Neue,Helvetica,Arial,sans-serif;
+font-size:15px;
+color:#404040;
+}
+
+table {
+border-collapse:collapse;
+border-spacing:0;
+}
+
+q:before,q:after,blockquote:before,blockquote:after {
+content:"";
+}
+
+html {
+overflow-y:scroll;
+font-size:100%;
+-webkit-text-size-adjust:100%;
+-ms-text-size-adjust:100%;
+}
+
+a:focus {
+outline:thin dotted;
+}
+
+article,aside,details,figcaption,figure,footer,header,hgroup,nav,section {
+display:block;
+}
+
+hgroup {
+margin-top:0px;
+}
+
+audio,canvas,video {
+display:inline;
+zoom:1;
+}
+
+sub,sup {
+font-size:75%;
+line-height:0;
+position:relative;
+vertical-align:baseline;
+}
+
+sup {
+top:-.5em;
+}
+
+sub {
+bottom:-.25em;
+}
+
+img {
+border:0;
+-ms-interpolation-mode:bicubic;
+}
+
+button,input,select,textarea {
+font-size:100%;
+vertical-align:middle;
+margin:0;
+}
+
+button,input {
+line-height:normal;
+overflow:visible;
+}
+
+button::-moz-focus-inner,input::-moz-focus-inner {
+border:0;
+padding:0;
+}
+
+button,input[type="button"],input[type="reset"],input[type="submit"] {
+cursor:pointer;
+-webkit-appearance:button;
+}
+
+input[type="search"] {
+-webkit-appearance:textfield;
+-webkit-box-sizing:content-box;
+-moz-box-sizing:content-box;
+box-sizing:content-box;
+}
+
+input[type="search"]::-webkit-search-decoration {
+-webkit-appearance:none;
+}
+
+textarea {
+overflow:auto;
+vertical-align:top;
+}
+
+.fade {
+-webkit-transition:opacity .15s linear;
+-moz-transition:opacity .15s linear;
+-o-transition:opacity .15s linear;
+transition:opacity .15s linear;
+opacity:0;
+}
+
+.fade.in {
+opacity:1;
+}
+
+::selection,::-moz-selection {
+background:#D75701;
+color:#fff;
+text-shadow:none;
+}
+
+h1,.h1 {
+font-size:30px;
+line-height:35px;
+font-weight:500;
+}
+
+h2,.h2 {
+font-size:24px;
+line-height:30px;
+font-weight:500;
+}
+
+h3,.h3 {
+font-size:18px;
+line-height:25px;
+font-weight:500;
+}
+
+h6,.h6 {
+font-size:14px;
+line-height:20px;
+font-weight:500;
+}
+
+ul {
+margin:0 0 15px 15px;
+}
+
+ol {
+margin:0 0 15px 20px;
+}
+
+li {
+margin-bottom:5px;
+}
+
+dl {
+margin-bottom:10px;
+}
+
+dl dd {
+margin:0 0 5px 10px;
+}
+
+p {
+line-height:25px;
+margin-top:20px;
+margin-bottom:20px;
+}
+
+a {
+color:black;
+text-decoration:none;
+border-bottom: 1px solid #404040;
+}
+
+a:hover {
+color: #D75701;
+border-bottom: 1px solid #D75701;
+}
+
+blockquote {
+margin-top:20px 0;
+border-left:5px solid #D75701;
+padding:0 0 0 20px;
+}
+
+blockquote p:first-child {
+margin-top:5px;
+}
+
+.descr {
+display:block;
+font-size:12px;
+line-height:20px;
+color:#7f7e7e;
+}
+
+.btn {
+display:inline-block;
+font-size:13px;
+line-height:18px;
+color:#333;
+text-align:center;
+text-shadow:0 1px 1px rgba(255,255,255,0.75);
+vertical-align:middle;
+cursor:pointer;
+background-color:#e6e6e6;
+background-repeat:repeat-x;
+background-image:linear-gradient(top,#fff,#e6e6e6);
+filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#e6e6e6',GradientType=0);
+border:1px solid #ccc;
+border-bottom-color:#b3b3b3;
+-webkit-border-radius:4px;
+-moz-border-radius:4px;
+border-radius:4px;
+-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 1px 2px rgba(0,0,0,.05);
+-moz-box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 1px 2px rgba(0,0,0,.05);
+box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 1px 2px rgba(0,0,0,.05);
+padding:4px 10px;
+}
+
+.btn:hover {
+color:#333;
+text-decoration:none;
+background-color:#e6e6e6;
+background-position:0 -15px;
+border-bottom-color:#b3b3b3;
+-webkit-transition:background-position .1s linear;
+-moz-transition:background-position .1s linear;
+-o-transition:background-position .1s linear;
+transition:background-position .1s linear;
+}
+
+.modal-backdrop {
+position:fixed;
+z-index:1000;
+top:0;
+right:0;
+bottom:0;
+left:0;
+background:#000;
+}
+
+.modal-backdrop.fade,.modal-backdrop.fade-large {
+-webkit-transition:opacity .2s linear;
+-moz-transition:opacity .2s linear;
+-o-transition:opacity .2s linear;
+transition:opacity .2s linear;
+filter:alpha(opacity=0);
+-khtml-opacity:0;
+-moz-opacity:0;
+opacity:0;
+}
+
+.modal-backdrop,.modal-backdrop.fade.in {
+filter:alpha(opacity=50);
+-khtml-opacity:.5;
+-moz-opacity:.5;
+opacity:.5;
+}
+
+.modal {
+position:fixed;
+top:0;
+left:240px;
+z-index:1050;
+overflow:auto;
+width:400px;
+height:100%;
+background-color:#fff;
+border-right:1px solid #404040;
+-webkit-box-shadow:0 0 7px rgba(0,0,0,0.5);
+-moz-box-shadow:0 0 7px rgba(0,0,0,0.5);
+box-shadow:0 0 7px rgba(0,0,0,0.5);
+}
+
+.modal.fade-large {
+width:700px;
+-webkit-transition:left .4s ease-out;
+-moz-transition:left .4s ease-out;
+-o-transition:left .4s ease-out;
+transition:left .4s ease-out;
+left:-1100px;
+}
+
+.modal.fade {
+-webkit-transition:left .4s ease-out;
+-moz-transition:left .4s ease-out;
+-o-transition:left .4s ease-out;
+transition:left .4s ease-out;
+left:-700px;
+}
+
+.modal.fade.in,.modal.fade-large.in {
+left:247px;
+width:347px;
+}
+
+.close {
+float:right;
+font-size:26px;
+line-height:30px;
+font-weight:700;
+color:#000;
+background-color:#fff;
+text-shadow:0 1px 0 #fff;
+filter:alpha(opacity=20);
+-khtml-opacity:.2;
+-moz-opacity:.2;
+opacity:.2;
+}
+
+.close:hover {
+color:#000;
+text-decoration:none;
+cursor:pointer;
+filter:alpha(opacity=40);
+-khtml-opacity:.4;
+-moz-opacity:.4;
+opacity:.4;
+}
+
+.profile {
+background:#e9e9e9 url(../imgs/b.png);
+}
+
+.profile-info {
+position:relative;
+background:#fff;
+padding:15px;
+}
+
+.profile-info .close {
+line-height:20px;
+}
+
+.profile-info .btn {
+position:absolute;
+right:17px;
+bottom:20px;
+}
+
+.profile-avatar {
+display:inline-block;
+float:left;
+border-bottom:0;
+}
+
+.profile-avatar img {
+height:52px;
+width:52px;
+border:2px solid #D75701;
+}
+
+.profile-name {
+display:block;
+float:left;
+margin:0 0 10px 10px;
+}
+
+.profile-name h2 {
+font-size:22px;
+line-height:30px;
+}
+
+.profile-name h2 a {
+font-weight:500;
+color:#404040;
+border-bottom:0;
+}
+
+.profile-name h3 {
+font-size:16px;
+line-height:20px;
+}
+
+.profile-name h3 a {
+color:#777;
+border-bottom:0;
+}
+
+.profile-description {
+clear:left;
+font-size:13px;
+line-height:18px;
+font-style:italic;
+color:#777;
+margin:0;
+padding:5px 0;
+}
+
+.profile-location-url {
+clear:left;
+margin:0;
+}
+
+.profile-location-url span {
+display:inline-block;
+font-size:13px;
+line-height:18px;
+color:#777;
+}
+
+.profile-location-url .divider {
+color:#ccc;
+padding:0 4px;
+}
+
+.profile-stats {
+list-style:none;
+overflow:hidden;
+border-top:1px solid #c2c2c2;
+border-bottom:1px solid #c2c2c2;
+background:#fff;
+margin:0;
+}
+
+.profile-stats li {
+display:inline;
+}
+
+.profile-stats li a,.profile-stats li span {
+float:left;
+color:#777;
+font-size:10px;
+line-height:16px;
+text-transform:uppercase;
+border-left:1px solid #c2c2c2;
+border-bottom:0;
+padding:7px 15px;
+}
+
+.profile-stats li strong {
+display:block;
+color:#404040;
+font-size:14px;
+}
+
+.profile-stats li:first-child span {
+border-left:0;
+}
+
+.profile-watchers {
+display:inline-block;
+background:url(/theme/imgs/ico-watchers.png) no-repeat;
+margin-left:10px;
+padding-left:20px;
+}
+
+.profile-forks {
+display:inline-block;
+background:url(/theme/imgs/ico-forks.png) no-repeat;
+margin-left:10px;
+padding-left:20px;
+}
+
+.profile-comments {
+display:inline-block;
+background:url(/theme/imgs/ico-comments.png) no-repeat;
+margin-left:10px;
+padding-left:20px;
+}
+
+.profile-likes {
+display:inline-block;
+background:url(/theme/imgs/ico-likes.png) no-repeat;
+margin-left:10px;
+padding-left:20px;
+}
+
+.profile-resharers {
+display:inline-block;
+background:url(/theme/imgs/ico-resharers.png) no-repeat;
+margin-left:10px;
+padding-left:20px;
+}
+
+.profile-plusoners {
+display:inline-block;
+background:url(/theme/imgs/ico-plusoners.png) no-repeat;
+margin-left:10px;
+padding-left:20px;
+}
+
+.profile.twitter {
+overflow:hidden;
+}
+
+.tweet-title {
+border-bottom:0;
+position:relative;
+padding-left:45px;
+}
+
+.tweet-title img {
+position:absolute;
+left:0;
+width:32px;
+height:32px;
+border:2px solid #D75701;
+}
+
+.tweet-title span {
+color:#777;
+font-size:13px;
+padding-left:3px;
+}
+
+.tweet-text {
+color:#777;
+font-size:12px;
+line-height:18px;
+margin:0 0 0 45px;
+padding:3px 0;
+}
+
+.tweet-date {
+font-size:12px;
+line-height:18px;
+color:#999;
+margin:0 0 0 45px;
+}
+
+.profile-repo-text {
+color:#777;
+font-size:13px;
+line-height:18px;
+margin:0;
+padding:5px 0;
+}
+
+.profile-repo-stats li {
+border:0;
+zoom:1;
+display:inline;
+padding:0;
+}
+
+.profile-shots {
+list-style:none;
+margin:0;
+padding:15px 0;
+}
+
+.profile-shots>li {
+float:left;
+width:300px;
+background:#fff;
+-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.25);
+-moz-box-shadow:0 1px 3px rgba(0,0,0,0.25);
+box-shadow:0 1px 3px rgba(0,0,0,0.25);
+margin:0 0 20px 20px;
+padding:10px;
+}
+
+.profile-shot {
+border-bottom:0;
+display:block;
+}
+
+.profile-shot img {
+width:300px;
+height:225px;
+}
+
+.profile-shot-title {
+display:block;
+font-size:13px;
+line-height:18px;
+color:#4b4b4b;
+overflow:hidden;
+text-overflow:ellipsis;
+white-space:nowrap;
+padding:5px 0;
+}
+
+.profile-shot-stats li {
+margin-bottom:0;
+border:0;
+zoom:1;
+display:inline;
+padding:0;
+}
+
+.profile-shot-stats li:first-child a,.profile-shot-stats li:first-child span {
+margin-left:0;
+}
+
+.profile-shot-date {
+float:right;
+color:#999;
+}
+
+.instagram .profile-shot img {
+width:300px;
+height:300px;
+}
+
+code,pre {
+color:#333;
+font-family:Monaco,Courier New,monospace;
+font-size:12px;
+font-weight:400;
+line-height:20px;
+-webkit-border-radius:3px;
+-moz-border-radius:3px;
+border-radius:3px;
+padding:0 3px 2px;
+}
+
+code {
+color:#D75701;
+background-color:#f7f7f9;
+border:1px solid #e1e1e8;
+padding:2px 4px;
+}
+
+pre {
+display:block;
+word-break:break-all;
+word-wrap:break-word;
+white-space:pre-wrap;
+background-color:#f5f5f5;
+border:1px solid rgba(0,0,0,0.15);
+-webkit-border-radius:4px;
+-moz-border-radius:4px;
+border-radius:4px;
+margin:0 0 9px;
+padding:8px;
+}
+
+pre.prettyprint {
+margin-bottom:20px;
+}
+
+.pre-scrollable {
+max-height:340px;
+overflow-y:scroll;
+}
+
+.lit {
+color:#195f91;
+}
+
+.fun {
+color:#dc322f;
+}
+
+.str,.atv {
+color:#da3f47;
+}
+
+.kwd,.linenums .tag {
+color:#1e347b;
+}
+
+.typ,.atn,.dec,.var {
+color:teal;
+}
+
+.pln {
+color:#48484c;
+}
+
+.prettyprint {
+background-color:#f7f7f9;
+border:1px solid #e1e1e8;
+padding:8px;
+}
+
+.prettyprint.linenums {
+-webkit-box-shadow:inset 40px 0 0 #fbfbfc,inset 41px 0 0 #ececf0;
+-moz-box-shadow:inset 40px 0 0 #fbfbfc,inset 41px 0 0 #ececf0;
+box-shadow:inset 40px 0 0 #fbfbfc,inset 41px 0 0 #ececf0;
+}
+
+ol.linenums {
+margin:0 0 0 33px;
+}
+
+ol.linenums li {
+padding-left:12px;
+color:#bebec5;
+line-height:18px;
+text-shadow:0 1px 0 #fff;
+}
+
+.main-header {
+width:247px;
+position:absolute;
+z-index:1100;
+float:left;
+border-right:1px solid #c2c2c2;
+background:#e9e9e9 url(../imgs/b.png);
+}
+
+.main-header hgroup .picture a {
+display:inline-block;
+height:84px;
+width:84px;
+border:3px solid #D75701;
+background:#000 0 url(https://twimg0-a.akamaihd.net/profile_images/1149409097/20101018060848_samrat94_6HR8FZ5V2JQDPU34ENIKCWBL0STAMO91XG7Y.jpg);
+-webkit-box-shadow:0 1px 1px #f9f9f9,inset 0 0 6px #000;
+-moz-box-shadow:0 1px 1px #f9f9f9,inset 0 0 6px #000;
+box-shadow:0 1px 1px #f9f9f9,inset 0 0 6px #000;
+margin:60px 35px 20px;
+}
+
+.main-header hgroup h1 {
+font-size:24px;
+text-shadow:0 1px 1px #f9f9f9;
+margin:0 35px;
+}
+
+.main-header hgroup h2 {
+font-size:14px;
+font-weight:400;
+line-height:25px;
+color:#4b4b4b;
+margin:10px 35px;
+}
+
+.main-header nav {
+margin:40px 0;
+}
+
+.main-header nav ul {
+border-top:1px solid #d2d2d2;
+list-style:none;
+margin-left:0;
+}
+
+.main-header nav a,.main-header nav a:hover {
+border-bottom:1px solid #d2d2d2;
+}
+
+.main-header nav a {
+position:relative;
+color:#404040;
+display:block;
+font-weight:500;
+text-shadow:0 1px 1px #f9f9f9;
+padding:15px 30px;
+}
+
+.main-header nav a:hover {
+color:#fff;
+background:#D75701;
+border-right:0;
+text-shadow:none;
+}
+
+.main-header nav .sel {
+border-right:6px solid #D75701;
+}
+
+.main-header .spinner {
+position:absolute!important;
+right:30px;
+top:23px;
+}
+
+.main-header .fork-me {
+margin-left:30px;
+font-size:13px;
+color:#4b4b4b;
+border-bottom:0;
+}
+
+.main-section {
+font-size:14px;
+position:relative;
+overflow:hidden;
+margin-left:247px;
+padding:35px 0px 0px 35px;
+}
+
+.main-section h3.date {
+width:100%;
+display:block;
+margin-left:-34px;
+border-bottom:1px solid #c2c2c2;
+border-top:1px solid #c2c2c2;
+font-size:16px;
+font-weight:700;
+background-color:rgba(255,255,255,0.8);
+color:#D75701;
+padding:20px 35px 30px 75px;
+}
+
+a.button_accent {
+display:inline-block;
+border:3px solid #D75701;
+border-radius:70px;
+-moz-border-radius:70px;
+-webkit-border-radius:70px;
+text-transform:uppercase;
+color:#D75701;
+font-size:17px;
+font-weight:400;
+margin:40px 50px;
+padding:10px 20px;
+}
+
+a.button_accent:link {
+color:#0e94ec;
+}
+
+a.button_accent:hover {
+color:#fff;
+background-color:#D75701;
+outline:0;
+}
+
+a.button_accent:active {
+color:#fff;
+background-color:#339;
+outline:0;
+}
+
+.blog-section {
+padding:0;
+}
+
+.blog-section hgroup h2,.blog-section hgroup h1 {
+font-size:30px;
+font-weight:500;
+line-height:40px;
+margin:50px 0 25px;
+}
+
+.blog-section hgroup h3 a.active {
+position:fixed;
+top:0;
+bottom:auto;
+margin-top:0;
+}
+
+.blog-section article {
+width:700px;
+overflow:hidden;
+line-height:25px;
+padding:5px 35px 50px 34px;
+}
+
+.blog-section article img {
+margin:0 15px 5px 0;
+padding:2px;
+}
+
+.blog-section article a.img-link:hover img {
+border-color:#D75701;
+}
+
+.blog-section footer {
+padding-top:10px;
+}
+
+.blog-section footer h4 {
+float:left;
+text-transform:uppercase;
+font-size:13px;
+line-height:28px;
+padding:0 15px 0 0;
+}
+
+.tags {
+list-style:none;
+margin:0;
+}
+
+.tags li {
+zoom:1;
+display:inline;
+}
+
+.tags a {
+font-size:13px;
+text-shadow:0 1px 1px #f9f9f9;
+background:#e9e9e9;
+border:1px solid #c2c2c2;
+padding:3px 10px;
+}
+
+.tags a:hover {
+background:#D75701;
+color:#fff;
+text-shadow:none;
+border:1px solid #D75701;
+}
+
+.load-more-button {
+display:inline-block;
+background-color:#D75701;
+color:#fff;
+margin:0 20px 50px;
+padding:10px 30px;
+}
+
+.load-more-button:hover {
+border:1px solid #D75701;
+background:#fff;
+color:#D75701;
+}
+
+.load-more-button .spinner {
+left:140px;
+top:-8px;
+}
+
+strong,b,dl dt {
+font-weight:700;
+}
+
+audio:not([controls]),.blog-section hgroup h3 a,.mobile-nav {
+display:none;
+}
+
+h4,.h4,h5,.h5 {
+font-size:16px;
+line-height:20px;
+font-weight:500;
+}
+
+li ul,li ol,.main-header nav li {
+margin-bottom:0;
+}
+
+a.no-border,.profile-avatar:hover,.profile-description a,.profile-location-url a,.tweet-title:hover,.tweet-text a,.profile-repo-name:hover,.profile-repo-stats a,.profile-shot:hover,.profile-shot-stats a,.blog-section article a.img-link {
+border-bottom:0;
+}
+
+.profile-name h2 a:hover,.profile-name h3 a:hover,.profile-stats li a:hover,.profile-stats li a:hover strong,.main-header .fork-me:hover {
+color:#D75701;
+}
+
+.profile-info-footer,.profile-tweets li,.profile-repos li {
+border-bottom:1px solid #c2c2c2;
+padding:10px 15px;
+}
+
+.profile-tweets,.profile-repos {
+font-size:13px;
+list-style:none;
+background:#fff;
+margin:0;
+}
+
+.profile-repo-name,.blog-section hgroup h2 a {
+border-bottom:0;
+font-weight:500;
+}
+
+.profile-repo-stats,.profile-shot-stats {
+list-style:none;
+font-size:13px;
+line-height:18px;
+margin:0;
+}
+
+.profile-repo-stats li {
+border-bottom: none;
+}
+
+.profile-repo-stats a:hover,.profile-shot-stats a:hover {
+border-bottom:0;
+color:#D75701;
+}
+
+pre code,blockquote code {
+color:inherit;
+background-color:transparent;
+border:0;
+padding:0;
+}
+
+.com,.pun,.opn,.clo {
+color:#93a1a1;
+}
+
+.blog-section article img {
+max-width:400px;
+}
+}
+
+.blog-section article img {
+max-width:400px;
+}
+}
+
+.mobile-nav {
+display:block;
+position:fixed;
+top:0;
+height:45px;
+width:100%;
+z-index:3000;
+background:#e9e9e9 url(../imgs/b.png);
+border-top:3px solid #D75701;
+-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.25);
+-moz-box-shadow:0 1px 3px rgba(0,0,0,0.25);
+box-shadow:0 1px 3px rgba(0,0,0,0.25);
+}
+
+.mobile-nav h3 {
+float:right;
+padding:10px;
+}
+
+.mobile-nav h3 a {
+border-bottom:0;
+font-weight:700;
+color:#404040;
+text-shadow:0 1px 1px #f9f9f9;
+}
+
+.mobile-nav .nav-btn {
+float:left;
+background-color:#333;
+background-repeat:repeat-x;
+background-image:linear-gradient(top,#404040,#333);
+filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#404040',endColorstr='#333333',GradientType=0);
+-webkit-border-radius:4px;
+-moz-border-radius:4px;
+border-radius:4px;
+-webkit-box-shadow:0 1px 1px #f9f9f9;
+-moz-box-shadow:0 1px 1px #f9f9f9;
+box-shadow:0 1px 1px #f9f9f9;
+margin:8px 10px;
+padding:7px 10px 4px;
+}
+
+.mobile-nav .nav-btn-bar {
+display:block;
+width:18px;
+height:2px;
+margin-bottom:3px;
+background-color:#f9f9f9;
+-webkit-border-radius:1px;
+-moz-border-radius:1px;
+border-radius:1px;
+-webkit-box-shadow:0 1px 0 rgba(0,0,0,0.25);
+-moz-box-shadow:0 1px 0 rgba(0,0,0,0.25);
+box-shadow:0 1px 0 rgba(0,0,0,0.25);
+}
+
+header.main-header {
+position:absolute;
+}
+
+header.main-header hgroup .picture a {
+margin:60px 0 10px 10px;
+}
+
+header.main-header nav {
+margin:20px 0;
+}
+
+.main-section {
+position:relative;
+min-height:500px;
+left:0;
+z-index:2000;
+background-color:#fff;
+-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.25);
+-moz-box-shadow:0 1px 3px rgba(0,0,0,0.25);
+box-shadow:0 1px 3px rgba(0,0,0,0.25);
+-webkit-transition:left .3s ease-out;
+-moz-transition:left .3s ease-out;
+-o-transition:left .3s ease-out;
+transition:left .3s ease-out;
+}
+
+.main-section.nav-opened {
+left:247px;
+}
+
+.blog-section hgroup h2,.blog-section hgroup h1 {
+font-size:24px;
+line-height:30px;
+font-weight:500;
+margin:10px 0 5px;
+}
+
+.blog-section hgroup h3 a {
+position:static;
+border:0;
+font-weight:300;
+margin:0;
+padding:5px 0;
+}
+
+.blog-section article {
+width:95%;
+border-bottom:1px solid #c2c2c2;
+padding:10px 10px 30px;
+}
+
+.blog-section article img {
+max-width:300px;
+}
+
+.blog-section .loading {
+padding:15px;
+}
+
+.modal-backdrop {
+z-index:3500;
+}
+
+.modal {
+position:absolute;
+width:100%;
+height:1500px;
+z-index:4000;
+}
+
+.modal.fade-large {
+width:100%;
+}
+
+.modal.fade.in,.modal.fade-large.in {
+left:247px;
+}
+
+.profile.twitter,.profile.github,.profile.dribbble,.profile.instagram {
+overflow:scroll;
+}
+
+.profile-info .btn {
+position:static;
+margin-top:5px;
+}
+
+.profile-shots {
+padding:10px 0;
+}
+
+.profile-shots>li {
+width:280px;
+margin:0 0 20px 10px;
+}
+
+.profile-shots img {
+width:280px;
+height:210px;
+}
+
+.instagram .profile-shot img {
+width:280px;
+height:280px;
+}
+
+header.main-header .fork-me,.shots-likes-received,.shots-likes-given {
+display:none;
+}
+
+@media (max-width:1024px), (max-height:800px) {
+header.main-header hgroup .picture a,header.main-header nav {
+margin-top:30px;
+}
+}
+
+@media (max-height:700px) and (min-width:800px) {
+header.main-header h1 {
+padding-top:15px;
+}
+
+header.main-header nav {
+margin-top:15px;
+}
+
+header.main-header hgroup .picture a {
+margin:15px 35px 0;
+}
+}
+
+@media (max-height:600px) and (min-width:800px) {
+header.main-header .picture {
+display:none;
+}
+}
+
+@media (max-height:500px) and (min-width:800px) {
+header.main-header hgroup h2 {
+display:none;
+}
+}
+
+@media (max-width:800px) {
+.blog-section article {
+width:400px;
+}
+
+.blog-section article img {
+max-width:400px;
+}
+}
+
+@media (min-width:801px) and (max-width:1024px) {
+.blog-section article {
+width:500px;
+}
+
+.blog-section article img {
+max-width:400px;
+}
+}
+
+@media (max-width:799px) {
+body {
+background:#e9e9e9 url(/static/imgs/b.png);
+overflow-x:hidden;
+}
+
+.mobile-nav {
+display:block;
+position:fixed;
+top:0;
+height:45px;
+width:100%;
+z-index:3000;
+background:#e9e9e9 url(/static/imgs/b.png);
+border-top:3px solid #d75701;
+-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.25);
+-moz-box-shadow:0 1px 3px rgba(0,0,0,0.25);
+box-shadow:0 1px 3px rgba(0,0,0,0.25);
+}
+
+.mobile-nav h3 {
+float:right;
+padding:10px;
+}
+
+.mobile-nav h3 a {
+border-bottom:0;
+font-weight:700;
+color:#404040;
+text-shadow:0 1px 1px #f9f9f9;
+}
+
+.mobile-nav .nav-btn {
+float:left;
+background-color:#333;
+background-repeat:repeat-x;
+background-image:linear-gradient(top,#404040,#333);
+filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#404040',endColorstr='#333333',GradientType=0);
+-webkit-border-radius:4px;
+-moz-border-radius:4px;
+border-radius:4px;
+-webkit-box-shadow:0 1px 1px #f9f9f9;
+-moz-box-shadow:0 1px 1px #f9f9f9;
+box-shadow:0 1px 1px #f9f9f9;
+margin:8px 10px;
+padding:7px 10px 4px;
+}
+
+.mobile-nav .nav-btn-bar {
+display:block;
+width:18px;
+height:2px;
+margin-bottom:3px;
+background-color:#f9f9f9;
+-webkit-border-radius:1px;
+-moz-border-radius:1px;
+border-radius:1px;
+-webkit-box-shadow:0 1px 0 rgba(0,0,0,0.25);
+-moz-box-shadow:0 1px 0 rgba(0,0,0,0.25);
+box-shadow:0 1px 0 rgba(0,0,0,0.25);
+}
+
+header.main-header {
+position:absolute;
+margin-top: 49px;
+}
+
+header.main-header hgroup .picture a {
+margin:60px 0 10px 10px;
+}
+
+header.main-header hgroup h1 {
+font-size:18px;
+margin:0 10px;
+}
+
+header.main-header hgroup h2 {
+margin:0 10px 10px;
+}
+
+header.main-header nav {
+margin:20px 0;
+}
+
+.main-section {
+position:relative;
+min-height:500px;
+left:0;
+z-index:2000;
+background-color:#fff;
+-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.25);
+-moz-box-shadow:0 1px 3px rgba(0,0,0,0.25);
+box-shadow:0 1px 3px rgba(0,0,0,0.25);
+-webkit-transition:left .3s ease-out;
+-moz-transition:left .3s ease-out;
+-o-transition:left .3s ease-out;
+transition:left .3s ease-out;
+margin:45px 0 0;
+}
+
+.main-section.nav-opened {
+left:240px;
+}
+
+.blog-section hgroup h2,.blog-section hgroup h1 {
+font-size:24px;
+line-height:30px;
+font-weight:500;
+margin:10px 0 5px;
+}
+
+.blog-section hgroup h3 a {
+position:static;
+border:0;
+font-weight:300;
+display:block;
+margin:0;
+padding:5px 0;
+}
+
+.blog-section article {
+width:95%;
+border-bottom:1px solid #c2c2c2;
+padding:10px 10px 30px;
+}
+
+.blog-section article img {
+max-width:300px;
+}
+
+.blog-section .loading {
+padding:15px;
+}
+
+.modal-backdrop {
+z-index:3500;
+}
+
+.modal {
+position:absolute;
+width:100%;
+z-index:4000;
+top:45px;
+}
+
+.modal.fade-large {
+width:100%;
+}
+
+.modal.fade.in,.modal.fade-large.in {
+left:0;
+}
+
+.profile.twitter,.profile.github,.profile.bitbucket,.profile.dribbble,.profile.instagram {
+overflow:scroll;
+}
+
+.apps a {
+width:90%;
+}
+
+.profile-info .btn {
+position:static;
+margin-top:5px;
+}
+
+.profile-shots {
+padding:10px 0;
+}
+
+.profile-shots>li {
+width:280px;
+margin:0 0 20px 10px;
+}
+
+.profile-shots img {
+width:280px;
+height:210px;
+}
+
+.instagram .profile-shot img {
+width:280px;
+height:280px;
+}
+
+header.main-header .fork-me,.shots-likes-received,.shots-likes-given {
+display:none;
+}
+}