1
- body {
2
- color : black; background-color : white;
3
- font-size : 100.01% ;
4
- font-family : Helvetica, Arial, sans-serif;
5
- margin : 0 ; padding : 1em ;
6
- min-width : 41em ; /* Mindestbreite verhindert Umbruch und Anzeigefehler in modernen Browsern */
7
- }
8
-
9
- h1 {
10
- font-size : 1.5em ;
11
- margin : 0 0 0.7em ; padding : 0.3em ;
12
- text-align : center;
13
- background-color : # D8DFEA ;
14
- border : 2px ridge silver;
15
- }
16
-
17
- div # navigation {
18
- font-size : 0.83em ;
19
- float : left; width : 18em ;
20
- margin : 0 0 1.2em ; padding : 0 ;
21
- border : 1px dashed silver;
22
- }
23
- ul # navigation li {
24
- list-style : none;
25
- margin : 0 ; padding : 0.5em ;
26
- }
27
- ul # navigation a {
28
- display : block;
29
- padding : 0.2em ;
30
- font-weight : bold;
31
- }
32
- ul # navigation a : link {
33
- color : black; background-color : # eee ;
34
- }
35
- ul # navigation a : visited {
36
- color : # 666 ; background-color : # eee ;
37
- }
38
- ul # navigation a : hover {
39
- color : black; background-color : white;
40
- }
41
- ul # navigation a : active {
42
- color : white; background-color : gray;
43
- }
44
-
45
-
46
- div # content {
47
- margin : 0 0 1em 16em ;
48
- padding : 0 1em ;
49
- border : 1px dashed silver;
50
- }
51
-
52
- div # content h2 {
53
- font-size : 1.2em ;
54
- margin : 0.2em 0 ;
55
- }
56
- div # content p {
57
- font-size : 1em ;
58
- margin : 1em 0 ;
59
- }
60
-
61
- p # content {
62
- clear : both;
63
- font-size : 0.9em ;
64
- margin : 0 ; padding : 0.1em ;
65
- text-align : center;
66
- background-color : # D8DFEA ; border : 1px solid silver;
67
- }
1
+
2
+ /* ==== Scroll down to find where to put your styles :) ==== */
3
+
4
+ /* HTML5 ✰ Boilerplate */
5
+
6
+ html , body , div , span , object , iframe ,
7
+ h1 , h2 , h3 , h4 , h5 , h6 , p , blockquote , pre ,
8
+ abbr , address , cite , code , del , dfn , em , img , ins , kbd , q , samp ,
9
+ small , strong , sub , sup , var , b , i , dl , dt , dd , ol , ul , li ,
10
+ fieldset , form , label , legend ,
11
+ table , caption , tbody , tfoot , thead , tr , th , td ,
12
+ article , aside , canvas , details , figcaption , figure ,
13
+ footer , header , hgroup , menu , nav , section , summary ,
14
+ time , mark , audio , video {
15
+ margin : 0 ;
16
+ padding : 0 ;
17
+ border : 0 ;
18
+ font-size : 100% ;
19
+ font : inherit;
20
+ vertical-align : baseline;
21
+ }
22
+
23
+ article , aside , details , figcaption , figure ,
24
+ footer , header , hgroup , menu , nav , section {
25
+ display : block;
26
+ }
27
+
28
+ blockquote , q { quotes : none; }
29
+ blockquote : before , blockquote : after ,
30
+ q : before , q : after { content : '' ; content : none; }
31
+ ins { background-color : # ff9 ; color : # 000 ; text-decoration : none; }
32
+ mark { background-color : # ff9 ; color : # 000 ; font-style : italic; font-weight : bold; }
33
+ del { text-decoration : line-through; }
34
+ abbr [title ], dfn [title ] { border-bottom : 1px dotted; cursor : help; }
35
+ table { border-collapse : collapse; border-spacing : 0 ; }
36
+ hr { display : block; height : 1px ; border : 0 ; border-top : 1px solid # ccc ; margin : 1em 0 ; padding : 0 ; }
37
+ input , select { vertical-align : middle; }
38
+
39
+ body { font : 13 px/1.231 sans-serif; * font-size : small; }
40
+ select , input , textarea , button { font : 99% sans-serif; }
41
+ pre , code , kbd , samp { font-family : monospace, sans-serif; }
42
+
43
+ html { overflow-y : scroll; }
44
+ a : hover , a : active { outline : none; }
45
+ ul , ol { margin-left : 2em ; }
46
+ ol { list-style-type : decimal; }
47
+ nav ul , nav li { margin : 0 ; list-style : none; list-style-image : none; }
48
+ small { font-size : 85% ; }
49
+ strong , th { font-weight : bold; }
50
+ td { vertical-align : top; }
51
+
52
+ sub , sup { font-size : 75% ; line-height : 0 ; position : relative; }
53
+ sup { top : -0.5em ; }
54
+ sub { bottom : -0.25em ; }
55
+
56
+ pre { white-space : pre; white-space : pre-wrap; word-wrap : break-word; padding : 15px ; }
57
+ textarea { overflow : auto; }
58
+ .ie6 legend , .ie7 legend { margin-left : -7px ; }
59
+ input [type = "radio" ] { vertical-align : text-bottom; }
60
+ input [type = "checkbox" ] { vertical-align : bottom; }
61
+ .ie7 input [type = "checkbox" ] { vertical-align : baseline; }
62
+ .ie6 input { vertical-align : text-bottom; }
63
+ label , input [type = "button" ], input [type = "submit" ], input [type = "image" ], button { cursor : pointer; }
64
+ button , input , select , textarea { margin : 0 ; }
65
+ input : valid , textarea : valid { }
66
+ input : invalid , textarea : invalid { border-radius : 1px ; -moz-box-shadow : 0px 0px 5px red; -webkit-box-shadow : 0px 0px 5px red; box-shadow : 0px 0px 5px red; }
67
+ .no-boxshadow input : invalid , .no-boxshadow textarea : invalid { background-color : # f0dddd ; }
68
+
69
+ ::-moz-selection { background : # FF5E99 ; color : # fff ; text-shadow : none; }
70
+ ::selection { background : # FF5E99 ; color : # fff ; text-shadow : none; }
71
+ a : link { -webkit-tap-highlight-color : # FF5E99 ; }
72
+
73
+ button { width : auto; overflow : visible; }
74
+ .ie7 img { -ms-interpolation-mode : bicubic; }
75
+
76
+ body , select , input , textarea { color : # 444 ; }
77
+ h1 , h2 , h3 , h4 , h5 , h6 { font-weight : bold; }
78
+ a , a : active , a : visited { color : # 607890 ; }
79
+ a : hover { color : # 036 ; }
80
+
81
+ /*
82
+ // ========================================== \\
83
+ || ||
84
+ || Your styles ! ||
85
+ || ||
86
+ \\ ========================================== //
87
+ */
88
+
89
+ body {
90
+ font-family : Helvetica, Helvetica Neue, Arial, sans-serif;
91
+ }
92
+
93
+ .wrapper {
94
+ margin : auto;
95
+ width : 960px ;
96
+ }
97
+
98
+ # header-container {
99
+ background-color : # f16529 ;
100
+ height : 130px ;
101
+ border-bottom : 20px solid # e44d26 ;
102
+ margin-bottom : 50px ;
103
+ -webkit-box-shadow : 0 40px 40px -40px # AAA ;
104
+ -moz-box-shadow : 0 40px 40px -40px # AAA ;
105
+ box-shadow : 0 40px 40px -40px # AAA ;
106
+ }
107
+
108
+ h2 , h3 {
109
+ margin : 30px 0 ;
110
+ }
111
+
112
+ # title , h2 , h3 {
113
+ font-weight : normal;
114
+ }
115
+
116
+ # title {
117
+ font-size : 80px ;
118
+ color : white;
119
+ padding-top : 35px ;
120
+ float : left;
121
+ }
122
+
123
+ h2 {
124
+ font-size : 55px ;
125
+ }
126
+
127
+ h3 {
128
+ font-size : 40px ;
129
+ }
130
+
131
+ nav {
132
+ float : right;
133
+ margin-top : 100px ;
134
+ }
135
+
136
+ nav ul , nav ul li {
137
+ display : inline;
138
+ }
139
+
140
+ nav a {
141
+ padding : 20px ;
142
+ color : white;
143
+ text-decoration : none;
144
+ background-color : # e44d26 ;
145
+ }
146
+
147
+ aside {
148
+ color : white;
149
+ padding : 20px ;
150
+ float : right;
151
+ height : 500px ;
152
+ width : 200px ;
153
+ background-color : # f16529 ;
154
+ border-bottom : 20px solid # e44d26 ;
155
+ margin-bottom : 50px ;
156
+ -webkit-box-shadow : 0 0px 40px -10px # AAA ;
157
+ -moz-box-shadow : 0 0px 40px -10px # AAA ;
158
+ box-shadow : 0 0px 40px -10px # AAA ;
159
+ }
160
+
161
+ # main p {
162
+ font : 16 px/26px Helvetica, Helvetica Neue, Arial;
163
+ width : 620px ;
164
+ text-shadow : none;
165
+ }
166
+
167
+ # main header h2 {
168
+ padding-bottom : 30px ;
169
+ }
170
+
171
+ article header {
172
+ margin-bottom : 50px ;
173
+ padding-bottom : 30px ;
174
+ width : 700px ;
175
+ -webkit-box-shadow : 0 45px 60px -60px # AAA ;
176
+ -moz-box-shadow : 0 45px 60px -60px # AAA ;
177
+ box-shadow : 0 45px 60px -60px # AAA ;
178
+ }
179
+
180
+ # footer-container {
181
+ background-color : # f16529 ;
182
+ height : 240px ;
183
+ border-top : 20px solid # e44d26 ;
184
+ margin-top : 50px ;
185
+ -webkit-box-shadow : 0 -40px 40px -40px # AAA ;
186
+ -moz-box-shadow : 0 -40px 40px -40px # AAA ;
187
+ box-shadow : 0 -40px 40px -40px # AAA ;
188
+ }
189
+
190
+ # footer-container footer {
191
+ color : white;
192
+ }
193
+
194
+ .info {
195
+ position : absolute;
196
+ top : 5px ;
197
+ background-color : white;
198
+ padding : 10px ;
199
+ }
200
+
201
+ # jquery-test {
202
+ top : 45px ;
203
+ }
204
+
205
+
206
+
207
+
208
+
209
+
210
+
211
+
212
+
213
+
214
+
215
+
216
+
217
+
218
+ .ir { display : block; text-indent : -999em ; overflow : hidden; background-repeat : no-repeat; text-align : left; direction : ltr; }
219
+ .hidden { display : none; visibility : hidden; }
220
+ .visuallyhidden { border : 0 ; clip : rect (0 0 0 0 ); height : 1px ; margin : -1px ; overflow : hidden; padding : 0 ; position : absolute; width : 1px ; }
221
+ .visuallyhidden .focusable : active ,
222
+ .visuallyhidden .focusable : focus { clip : auto; height : auto; margin : 0 ; overflow : visible; position : static; width : auto; }
223
+ .invisible { visibility : hidden; }
224
+ .clearfix : before , .clearfix : after { content : "\0020" ; display : block; height : 0 ; overflow : hidden; }
225
+ .clearfix : after { clear : both; }
226
+ .clearfix { zoom : 1 ; }
227
+
228
+
229
+ @media all and (orientation : portrait) {
230
+
231
+ }
232
+
233
+ @media all and (orientation : landscape) {
234
+
235
+ }
236
+
237
+ @media screen and (max-device-width : 480px ) {
238
+
239
+ /* html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; } */
240
+ }
241
+
242
+
243
+ @media print {
244
+ * { background : transparent !important ; color : black !important ; text-shadow : none !important ; filter : none !important ;
245
+ -ms-filter : none !important ; }
246
+ a , a : visited { color : # 444 !important ; text-decoration : underline; }
247
+ a [href ]: after { content : " (" attr (href) ")" ; }
248
+ abbr [title ]: after { content : " (" attr (title) ")" ; }
249
+ .ir a : after , a [href ^= "javascript:" ]: after , a [href ^= "#" ]: after { content : "" ; }
250
+ pre , blockquote { border : 1px solid # 999 ; page-break-inside : avoid; }
251
+ thead { display : table-header-group; }
252
+ tr , img { page-break-inside : avoid; }
253
+ @page { margin : 0.5cm ; }
254
+ p , h2 , h3 { orphans : 3 ; widows : 3 ; }
255
+ h2 , h3 { page-break-after : avoid; }
256
+ }
0 commit comments