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.
188 lines
2.7 KiB
188 lines
2.7 KiB
html, body { |
|
font-family: 'Roboto', sans-serif; |
|
font-size: 15px; |
|
} |
|
body { |
|
background-color: #f6f6f6; |
|
padding-bottom: 50px; |
|
padding-top: 80px; |
|
} |
|
|
|
header { |
|
min-height: 80px; |
|
color: #f6f6f6; |
|
position: fixed; |
|
top: 0; |
|
left: 0; |
|
width: 100%; |
|
z-index: 99; |
|
} |
|
header h1 { |
|
margin: 10px 0; |
|
font-size: 50px; |
|
line-height: 60px; |
|
font-weight: 100; |
|
text-rendering: auto; |
|
} |
|
header menu { |
|
margin: 20px 0 0; |
|
padding: 0; |
|
height: 40px; |
|
} |
|
header menu ul { |
|
margin: 0; |
|
padding: 0; |
|
float: right; |
|
} |
|
header menu li { |
|
list-style: none; |
|
float: left; |
|
margin: 0; |
|
padding: 0; |
|
} |
|
header menu li a { |
|
display: inline-block; |
|
height: 40px; |
|
font-size: 17px; |
|
line-height: 40px; |
|
padding: 0 20px; |
|
color: #f6f6f6; |
|
} |
|
header menu li a:hover { |
|
color: #f6f6f6; |
|
text-decoration: none; |
|
} |
|
header menu li a img { |
|
margin: 0; |
|
padding: 5px 0; |
|
vertical-align: bottom; |
|
width: 30px; |
|
height: 30px; |
|
} |
|
|
|
#subtitle { |
|
position: absolute; |
|
top: 80px; |
|
left: 0; |
|
width: 100%; |
|
} |
|
h2 { |
|
font-weight: 200; |
|
font-size: 26px; |
|
line-height: 30px; |
|
padding: 15px 0; |
|
margin: 0; |
|
color: #eee; |
|
} |
|
h2 strong { |
|
font-weight: 300; |
|
} |
|
|
|
a.dl { |
|
font-weight: 300; |
|
font-size: 30px; |
|
line-height: 40px; |
|
padding: 3px 10px; |
|
display: inline-block; |
|
border-radius: 6px; |
|
color: #f0f0f0; |
|
margin: 5px 0; |
|
} |
|
a.dl:hover { |
|
color: #f0f0f0; |
|
text-decoration: none; |
|
} |
|
|
|
.content-nav { |
|
margin-top: 130px; |
|
width: 220px; |
|
} |
|
.content-nav.affix { |
|
top: 0; |
|
} |
|
.content-nav li.active a, .content-nav li.active a:hover { |
|
background-color: transparent; |
|
color: #555; |
|
border-left-width: 2px; |
|
} |
|
.content-nav .secondary a { |
|
color: #aaa; |
|
} |
|
.content-nav .secondary a:hover { |
|
color: #888; |
|
} |
|
|
|
h3 { |
|
font-weight: 300; |
|
font-style: italic; |
|
color: #888; |
|
font-size: 20px; |
|
padding-top: 115px; |
|
margin-top: 0; |
|
} |
|
|
|
h4 { |
|
font-weight: 400; |
|
text-transform: uppercase; |
|
color: #888; |
|
font-size: 15px; |
|
padding-top: 20px; |
|
} |
|
|
|
p.license { |
|
font-family: fixed-width; |
|
} |
|
|
|
.row .logo { |
|
text-align: center; |
|
margin-top: 150px; |
|
} |
|
.row .logo img { |
|
height: 30px; |
|
} |
|
|
|
pre, code { |
|
color: #666; |
|
} |
|
code { |
|
border: 0; |
|
background-color: transparent; |
|
} |
|
|
|
/* Widescreen desktop. */ |
|
@media (min-width: 1200px) { |
|
.content-nav { |
|
width: 270px; |
|
} |
|
} |
|
|
|
/* Smaller width browser, tablets. */ |
|
@media (max-width: 979px) { |
|
.content-nav { |
|
width: 166px; |
|
} |
|
} |
|
|
|
/* One-column mobile display. */ |
|
@media (max-width: 767px) { |
|
header { |
|
position: absolute; |
|
top: 0; |
|
left: 0; |
|
width: 100%; |
|
padding-left: 20px; |
|
} |
|
header menu { |
|
display: none; |
|
} |
|
#subtitle { |
|
position: absolute; |
|
top: 80px; |
|
left: 0; |
|
width: 100%; |
|
padding-left: 20px; |
|
} |
|
.content-nav { |
|
display: none; |
|
} |
|
} |