better-staridc-MNBT
1@font-face {
2 font-family: 'Source Sans Pro';
3 font-style: normal;
4 font-weight: 400;
5 src: local('Source Sans Pro'), local('SourceSansPro-Regular'), url(source_sans.woff) format('woff');
6}
7
8body, html { margin: 0; padding: 0; height: 100%; }
9section, article { display: block; padding: 0; }
10
11body {
12 background: #f8f8f8;
13 font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif;
14 line-height: 1.5;
15}
16
17p { margin-top: 0; }
18
19h2, h3, h1 {
20 font-weight: normal;
21 margin-bottom: .7em;
22}
23h1 { font-size: 140%; }
24h2 { font-size: 120%; }
25h3 { font-size: 110%; }
26article > h2:first-child, section:first-child > h2 { margin-top: 0; }
27
28#nav h1 {
29 margin-right: 12px;
30 margin-top: 0;
31 margin-bottom: 2px;
32 color: #d30707;
33 letter-spacing: .5px;
34}
35
36a, a:visited, a:link, .quasilink {
37 color: #A21313;
38}
39
40em {
41 padding-right: 2px;
42}
43
44.quasilink {
45 cursor: pointer;
46}
47
48article {
49 max-width: 700px;
50 margin: 0 0 0 160px;
51 border-left: 2px solid #E30808;
52 border-right: 1px solid #ddd;
53 padding: 30px 50px 100px 50px;
54 background: white;
55 z-index: 2;
56 position: relative;
57 min-height: 100%;
58 box-sizing: border-box;
59 -moz-box-sizing: border-box;
60}
61
62#nav {
63 position: fixed;
64 padding-top: 30px;
65 max-height: 100%;
66 box-sizing: -moz-border-box;
67 box-sizing: border-box;
68 overflow-y: auto;
69 left: 0; right: none;
70 width: 160px;
71 text-align: right;
72 z-index: 1;
73}
74
75@media screen and (min-width: 1000px) {
76 article {
77 margin: 0 auto;
78 }
79 #nav {
80 right: 50%;
81 width: auto;
82 border-right: 349px solid transparent;
83 }
84}
85
86#nav ul {
87 display: block;
88 margin: 0; padding: 0;
89 margin-bottom: 32px;
90}
91
92#nav a {
93 text-decoration: none;
94}
95
96#nav li {
97 display: block;
98 margin-bottom: 4px;
99}
100
101#nav li ul {
102 font-size: 80%;
103 margin-bottom: 0;
104 display: none;
105}
106
107#nav li.active ul {
108 display: block;
109}
110
111#nav li li a {
112 padding-right: 20px;
113 display: inline-block;
114}
115
116#nav ul a {
117 color: black;
118 padding: 0 7px 1px 11px;
119}
120
121#nav ul a.active, #nav ul a:hover {
122 border-bottom: 1px solid #E30808;
123 margin-bottom: -1px;
124 color: #E30808;
125}
126
127#logo {
128 border: 0;
129 margin-right: 12px;
130 margin-bottom: 25px;
131}
132
133section {
134 border-top: 1px solid #E30808;
135 margin: 1.5em 0;
136}
137
138section.first {
139 border: none;
140 margin-top: 0;
141}
142
143#demo {
144 position: relative;
145}
146
147#demolist {
148 position: absolute;
149 right: 5px;
150 top: 5px;
151 z-index: 25;
152}
153
154.yinyang {
155 position: absolute;
156 top: -10px;
157 left: 0; right: 0;
158 margin: auto;
159 display: block;
160 height: 120px;
161}
162
163.actions {
164 margin: 1em 0 0;
165 min-height: 100px;
166 position: relative;
167}
168
169@media screen and (max-width: 800px) {
170 .actions {
171 padding-top: 120px;
172 }
173 .actionsleft, .actionsright {
174 float: none;
175 text-align: left;
176 margin-bottom: 1em;
177 }
178}
179
180th {
181 text-decoration: underline;
182 font-weight: normal;
183 text-align: left;
184}
185
186#features ul {
187 list-style: none;
188 margin: 0 0 1em;
189 padding: 0 0 0 1.2em;
190}
191
192#features li:before {
193 content: "-";
194 width: 1em;
195 display: inline-block;
196 padding: 0;
197 margin: 0;
198 margin-left: -1em;
199}
200
201.rel {
202 margin-bottom: 0;
203}
204.rel-note {
205 margin-top: 0;
206 color: #555;
207}
208
209pre {
210 padding-left: 15px;
211 border-left: 2px solid #ddd;
212}
213
214code {
215 padding: 0 2px;
216}
217
218strong {
219 text-decoration: underline;
220 font-weight: normal;
221}
222
223.field {
224 border: 1px solid #A21313;
225}