html, body { width: 100%; height: 100%; } h1, h2, h3, h4, h5, h6 { font-weight: 300; line-height: 1.1; } h1 { font-size: 2.4em; } h2 { font-size: 2em; } h3 { font-size: 1.6em; } h4 { font-size: 1.2em; } h5 { font-size: 0.9em; } h6 { font-size: 0.8em; } body { margin: 0; padding: 0; background-color: #ffffff; color: #242121; font-family: 'Source Sans Pro', sans-serif; font-size: 1.02em; line-height: 1.2em; } a { color: #d9411e; text-decoration: none; } a:hover { color: #ff5a09; } hr { color: #eeeeee; background-color: #eeeeee; height: 1px; border: none; margin-top: 40px; margin-bottom: 40px; } img { max-width: 100%; } aside { background-color: #333333; color: #ffffff; text-align: center; } aside a { color: #ffffff; } aside a:hover { color: #eeeeee; } aside .profile { padding: 18px; margin: 0; } aside .profile img { border-radius: 50%; max-width: 140px; } aside .profile h1 { margin: 15px 0 5px 0; } aside .profile p { margin: 0 0 15px 0; font-size: .85em; } aside nav ul li { padding: 0 8px 0 8px; display: inline; line-height: 1.6em; font-size: 1.2em; text-transform: lowercase; } main nav { text-align: center; text-transform: uppercase; font-size: .7em; padding: 14px 0 14px 0; border-bottom: #eeeeee 1px solid; } main nav a { padding: 0 4px 0 4px; border-right: #eeeeee 1px solid; } main nav :first-child { border-left: #eeeeee 1px solid; } main .pagination { margin: 4% 8% 2% 8%; } main article { margin: 0 8% 2% 8%; } main article header h2 { margin-bottom: 0; } main article header p { color: #999999; font-size: 11px; } main article code, main article kbd, main article samp, main article pre { font-family: 'Source Code Pro', monospace; } main article blockquote, main article pre { background-color: rgba(128, 128, 128, 0.05); border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-left: 8px solid rgba(128, 128, 128, 0.075); border-left-width: 10px; } main article blockquote { padding: 10px 20px; font-weight: 300; font-size: 1.1em; } main article pre { padding: 4px; overflow-x: auto; font-size: .9em; } main article kbd { padding: .1em .6em; border: 1px solid rgba(63, 63, 63, 0.25); box-shadow: 0 1px 0 rgba(63, 63, 63, 0.25); background-color: #fff; color: #333; border-radius: 3px; display: inline-block; margin: 0 .1em; white-space: nowrap; font-size: .78em; } main article code { font-size: .72rem; line-height: .72rem; white-space: normal; color: #c25; padding: 1px 3px; background-color: #f7f7f9; border: 1px solid #e1e1e8; border-radius: 3px; } main article .comment-count { font-size: .8em; } main article table { border-collapse: collapse; border-spacing: 0; } main article table thead:first-child tr:first-child th { border-top: 0; } main article table th, main article table td { padding: 8px; line-height: 20px; vertical-align: top; border-top: 1px solid #ddd; } main footer { padding-top: 4px; border-top: #eeeeee 1px solid; } main footer p { margin: 2px; text-align: center; padding: 0 40px 0 40px; color: #999999; font-size: 11px; } @media screen and (min-width: 768px) { aside { width: 25%; height: 100%; position: fixed; top: 0; left: 0; overflow-y: auto; } aside .profile { padding: 36px 18px; } aside nav ul li { display: block; } main { width: 75%; position: absolute; top: 0; left: 25%; overflow-x: hidden; overflow-y: hidden; } } .tag-cloud a { background-color: #d9411e; padding: .2em .6em .2em; font-size: .74em; line-height: 1; color: #ffffff; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: .25em; } .tag-cloud a:hover { background-color: #ff5a09; } a.btn { background-color: #d9411e; padding: .4em .6em; font-size: .9em; line-height: 1; color: #ffffff; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: .25em; } a.btn:hover { background-color: #ff5a09; } .float-right { float: right; } ul.list, ul.social { list-style-type: none; margin: 0; padding: 0; } ul.social { padding-top: 32px; font-size: 1.8em; } ul.social li { display: inline; } ul.social a:hover { z-index: 2; -webkit-transform: translateY(-5px); transform: translateY(-5px); } ul.social a { display: inline-block; width: 36px; height: 36px; border-radius: 100%; text-align: center; font-size: .8em; line-height: 36px; } ul.social a.sc-facebook { background-color: #3e5b98; } ul.social a.sc-google { background-color: #d93e2d; } ul.social a.sc-pinterest { background-color: #c92619; } ul.social a.sc-linkedin { background-color: #3371b7; } ul.social a.sc-rss { background-color: #f26109; } ul.social a.sc-twitter { background-color: #4da7de; } ul.social a.sc-youtube { background-color: #e02a20; } ul.social a.sc-github, ul.social a.sc-github-alt { background-color: #111010; } ul.social a.sc-email { background-color: #578AD6; }