You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
479 lines
8.5 KiB
479 lines
8.5 KiB
/* http://meyerweb.com/eric/tools/css/reset/ |
|
v2.0 | 20110126 |
|
License: none (public domain) |
|
*/ |
|
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-size: 100%; |
|
font: inherit; |
|
vertical-align: baseline; |
|
} |
|
/* HTML5 display-role reset for older browsers */ |
|
article, aside, details, figcaption, figure, |
|
footer, header, hgroup, menu, nav, section { |
|
display: block; |
|
} |
|
body { |
|
line-height: 1; |
|
} |
|
ol, ul { |
|
list-style: none; |
|
} |
|
blockquote, q { |
|
quotes: none; |
|
} |
|
blockquote:before, blockquote:after, |
|
q:before, q:after { |
|
content: ''; |
|
content: none; |
|
} |
|
table { |
|
border-collapse: collapse; |
|
border-spacing: 0; |
|
} |
|
|
|
/* LAYOUT STYLES */ |
|
body { |
|
font-size: 15px; |
|
line-height: 1.5; |
|
background: #fafafa url(../images/body-bg.jpg) 0 0 repeat; |
|
font-family: 'Helvetica Neue', Helvetica, Arial, serif; |
|
font-weight: 400; |
|
color: #666; |
|
} |
|
|
|
a { |
|
color: #2879d0; |
|
} |
|
a:hover { |
|
color: #2268b2; |
|
} |
|
|
|
header { |
|
padding-top: 40px; |
|
padding-bottom: 40px; |
|
font-family: 'Architects Daughter', 'Helvetica Neue', Helvetica, Arial, serif; |
|
background: #2e7bcf url(../images/header-bg.jpg) 0 0 repeat-x; |
|
border-bottom: solid 1px #275da1; |
|
} |
|
|
|
header h1 { |
|
letter-spacing: -1px; |
|
font-size: 72px; |
|
color: #fff; |
|
line-height: 1; |
|
margin-bottom: 0.2em; |
|
width: 540px; |
|
} |
|
|
|
header h2 { |
|
font-size: 26px; |
|
color: #9ddcff; |
|
font-weight: normal; |
|
line-height: 1.3; |
|
width: 540px; |
|
letter-spacing: 0; |
|
} |
|
|
|
.inner { |
|
position: relative; |
|
width: 940px; |
|
margin: 0 auto; |
|
} |
|
|
|
#content-wrapper { |
|
border-top: solid 1px #fff; |
|
padding-top: 30px; |
|
} |
|
|
|
#main-content { |
|
width: 690px; |
|
float: left; |
|
} |
|
|
|
#main-content img { |
|
max-width: 100%; |
|
} |
|
|
|
aside#sidebar { |
|
width: 200px; |
|
padding-left: 20px; |
|
min-height: 504px; |
|
float: right; |
|
background: transparent url(../images/sidebar-bg.jpg) 0 0 no-repeat; |
|
font-size: 12px; |
|
line-height: 1.3; |
|
} |
|
|
|
aside#sidebar p.repo-owner, |
|
aside#sidebar p.repo-owner a { |
|
font-weight: bold; |
|
} |
|
|
|
#downloads { |
|
margin-bottom: 40px; |
|
} |
|
|
|
a.button { |
|
width: 134px; |
|
height: 58px; |
|
line-height: 1.2; |
|
font-size: 23px; |
|
color: #fff; |
|
padding-left: 68px; |
|
padding-top: 22px; |
|
font-family: 'Architects Daughter', 'Helvetica Neue', Helvetica, Arial, serif; |
|
} |
|
a.button small { |
|
display: block; |
|
font-size: 11px; |
|
} |
|
header a.button { |
|
position: absolute; |
|
right: 0; |
|
top: 0; |
|
background: transparent url(../images/github-button.png) 0 0 no-repeat; |
|
} |
|
aside a.button { |
|
width: 138px; |
|
padding-left: 64px; |
|
display: block; |
|
background: transparent url(../images/download-button.png) 0 0 no-repeat; |
|
margin-bottom: 20px; |
|
font-size: 21px; |
|
} |
|
|
|
code, pre { |
|
font-family: Monaco, "Bitstream Vera Sans Mono", "Lucida Console", Terminal, monospace; |
|
color: #222; |
|
margin-bottom: 30px; |
|
font-size: 13px; |
|
} |
|
|
|
code { |
|
background-color: #f2f8fc; |
|
border: solid 1px #dbe7f3; |
|
padding: 0 3px; |
|
} |
|
|
|
pre { |
|
padding: 20px; |
|
background: #fff; |
|
text-shadow: none; |
|
overflow: auto; |
|
border: solid 1px #f2f2f2; |
|
} |
|
pre code { |
|
color: #2879d0; |
|
background-color: #fff; |
|
border: none; |
|
padding: 0; |
|
} |
|
|
|
ul, ol, dl { |
|
margin-bottom: 20px; |
|
} |
|
|
|
|
|
/* COMMON STYLES */ |
|
|
|
hr { |
|
height: 1px; |
|
line-height: 1px; |
|
margin-top: 1em; |
|
padding-bottom: 1em; |
|
border: none; |
|
background: transparent url('../images/hr.png') 0 0 no-repeat; |
|
} |
|
|
|
table { |
|
width: 100%; |
|
border: 1px solid #ebebeb; |
|
} |
|
|
|
th { |
|
font-weight: 500; |
|
} |
|
|
|
td { |
|
border: 1px solid #ebebeb; |
|
text-align: center; |
|
font-weight: 300; |
|
} |
|
|
|
form { |
|
background: #f2f2f2; |
|
padding: 20px; |
|
|
|
} |
|
|
|
|
|
/* GENERAL ELEMENT TYPE STYLES */ |
|
|
|
#main-content h1 { |
|
font-family: 'Architects Daughter', 'Helvetica Neue', Helvetica, Arial, serif; |
|
font-size: 2.8em; |
|
letter-spacing: -1px; |
|
color: #474747; |
|
} |
|
|
|
#main-content h1:before { |
|
content: "/"; |
|
color: #9ddcff; |
|
padding-right: 0.3em; |
|
margin-left: -0.9em; |
|
} |
|
|
|
#main-content h2 { |
|
font-family: 'Architects Daughter', 'Helvetica Neue', Helvetica, Arial, serif; |
|
font-size: 22px; |
|
font-weight: bold; |
|
margin-bottom: 8px; |
|
color: #474747; |
|
} |
|
#main-content h2:before { |
|
content: "//"; |
|
color: #9ddcff; |
|
padding-right: 0.3em; |
|
margin-left: -1.5em; |
|
} |
|
|
|
#main-content h3 { |
|
font-family: 'Architects Daughter', 'Helvetica Neue', Helvetica, Arial, serif; |
|
font-size: 18px; |
|
font-weight: bold; |
|
margin-top: 24px; |
|
margin-bottom: 8px; |
|
color: #474747; |
|
} |
|
|
|
#main-content h3:before { |
|
content: "///"; |
|
color: #9ddcff; |
|
padding-right: 0.3em; |
|
margin-left: -2em; |
|
} |
|
|
|
#main-content h4 { |
|
font-family: 'Architects Daughter', 'Helvetica Neue', Helvetica, Arial, serif; |
|
font-size: 15px; |
|
font-weight: bold; |
|
color: #474747; |
|
} |
|
|
|
h4:before { |
|
content: "////"; |
|
color: #9ddcff; |
|
padding-right: 0.3em; |
|
margin-left: -2.8em; |
|
} |
|
|
|
#main-content h5 { |
|
font-family: 'Architects Daughter', 'Helvetica Neue', Helvetica, Arial, serif; |
|
font-size: 14px; |
|
color: #474747; |
|
} |
|
h5:before { |
|
content: "/////"; |
|
color: #9ddcff; |
|
padding-right: 0.3em; |
|
margin-left: -3.2em; |
|
} |
|
|
|
#main-content h6 { |
|
font-family: 'Architects Daughter', 'Helvetica Neue', Helvetica, Arial, serif; |
|
font-size: .8em; |
|
color: #474747; |
|
} |
|
h6:before { |
|
content: "//////"; |
|
color: #9ddcff; |
|
padding-right: 0.3em; |
|
margin-left: -3.7em; |
|
} |
|
|
|
p { |
|
margin-bottom: 20px; |
|
} |
|
|
|
a { |
|
text-decoration: none; |
|
} |
|
|
|
p a { |
|
font-weight: 400; |
|
} |
|
|
|
blockquote { |
|
font-size: 1.6em; |
|
border-left: 10px solid #e9e9e9; |
|
margin-bottom: 20px; |
|
padding: 0 0 0 30px; |
|
} |
|
|
|
ul { |
|
list-style: disc inside; |
|
padding-left: 20px; |
|
} |
|
|
|
ol { |
|
list-style: decimal inside; |
|
padding-left: 3px; |
|
} |
|
|
|
dl dd { |
|
font-style: italic; |
|
font-weight: 100; |
|
} |
|
|
|
footer { |
|
background: transparent url('../images/hr.png') 0 0 no-repeat; |
|
margin-top: 40px; |
|
padding-top: 20px; |
|
padding-bottom: 30px; |
|
font-size: 13px; |
|
color: #aaa; |
|
} |
|
|
|
footer a { |
|
color: #666; |
|
} |
|
footer a:hover { |
|
color: #444; |
|
} |
|
|
|
/* MISC */ |
|
.clearfix:after { |
|
clear: both; |
|
content: '.'; |
|
display: block; |
|
visibility: hidden; |
|
height: 0; |
|
} |
|
|
|
.clearfix {display: inline-block;} |
|
* html .clearfix {height: 1%;} |
|
.clearfix {display: block;} |
|
|
|
/* #Media Queries |
|
================================================== */ |
|
|
|
/* Smaller than standard 960 (devices and browsers) */ |
|
@media only screen and (max-width: 959px) {} |
|
|
|
/* Tablet Portrait size to standard 960 (devices and browsers) */ |
|
@media only screen and (min-width: 768px) and (max-width: 959px) { |
|
.inner { |
|
width: 740px; |
|
} |
|
header h1, header h2 { |
|
width: 340px; |
|
} |
|
header h1 { |
|
font-size: 60px; |
|
} |
|
header h2 { |
|
font-size: 30px; |
|
} |
|
#main-content { |
|
width: 490px; |
|
} |
|
#main-content h1:before, |
|
#main-content h2:before, |
|
#main-content h3:before, |
|
#main-content h4:before, |
|
#main-content h5:before, |
|
#main-content h6:before { |
|
content: none; |
|
padding-right: 0; |
|
margin-left: 0; |
|
} |
|
} |
|
|
|
/* All Mobile Sizes (devices and browser) */ |
|
@media only screen and (max-width: 767px) { |
|
.inner { |
|
width: 93%; |
|
} |
|
header { |
|
padding: 20px 0; |
|
} |
|
header .inner { |
|
position: relative; |
|
} |
|
header h1, header h2 { |
|
width: 100%; |
|
} |
|
header h1 { |
|
font-size: 48px; |
|
} |
|
header h2 { |
|
font-size: 24px; |
|
} |
|
header a.button { |
|
background-image: none; |
|
width: auto; |
|
height: auto; |
|
display: inline-block; |
|
margin-top: 15px; |
|
padding: 5px 10px; |
|
position: relative; |
|
text-align: center; |
|
font-size: 13px; |
|
line-height: 1; |
|
background-color: #9ddcff; |
|
color: #2879d0; |
|
-moz-border-radius: 5px; |
|
-webkit-border-radius: 5px; |
|
border-radius: 5px; |
|
} |
|
header a.button small { |
|
font-size: 13px; |
|
display: inline; |
|
} |
|
#main-content, |
|
aside#sidebar { |
|
float: none; |
|
width: 100% ! important; |
|
} |
|
aside#sidebar { |
|
background-image: none; |
|
margin-top: 20px; |
|
border-top: solid 1px #ddd; |
|
padding: 20px 0; |
|
min-height: 0; |
|
} |
|
aside#sidebar a.button { |
|
display: none; |
|
} |
|
#main-content h1:before, |
|
#main-content h2:before, |
|
#main-content h3:before, |
|
#main-content h4:before, |
|
#main-content h5:before, |
|
#main-content h6:before { |
|
content: none; |
|
padding-right: 0; |
|
margin-left: 0; |
|
} |
|
} |
|
|
|
/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ |
|
@media only screen and (min-width: 480px) and (max-width: 767px) {} |
|
|
|
/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ |
|
@media only screen and (max-width: 479px) {}
|
|
|