1
+ @font-face {
2
+ font-family : 'icomoon' ;
3
+ src : url ('../fonts/icomoon.eot?rretjt' );
4
+ src : url ('../fonts/icomoon.eot?#iefixrretjt' ) format ('embedded-opentype' ),
5
+ url ('../fonts/icomoon.woff?rretjt' ) format ('woff' ),
6
+ url ('../fonts/icomoon.ttf?rretjt' ) format ('truetype' ),
7
+ url ('../fonts/icomoon.svg?rretjt#icomoon' ) format ('svg' );
8
+ font-weight : normal;
9
+ font-style : normal;
10
+ }
11
+
12
+ [class ^= "icon-" ], [class *= " icon-" ] {
13
+ font-family : 'icomoon' ;
14
+ speak : none;
15
+ font-style : normal;
16
+ font-weight : normal;
17
+ font-variant : normal;
18
+ text-transform : none;
19
+ line-height : 1 ;
20
+
21
+ /* Better Font Rendering =========== */
22
+ -webkit-font-smoothing : antialiased;
23
+ -moz-osx-font-smoothing : grayscale;
24
+ }
25
+
26
+ body , html { font-size : 100% ; padding : 0 ; margin : 0 ;}
27
+
28
+ /* Reset */
29
+ * ,
30
+ * : after ,
31
+ * : before {
32
+ -webkit-box-sizing : border-box;
33
+ -moz-box-sizing : border-box;
34
+ box-sizing : border-box;
35
+ }
36
+
37
+ /* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
38
+ .clearfix : before ,
39
+ .clearfix : after {
40
+ content : " " ;
41
+ display : table;
42
+ }
43
+
44
+ .clearfix : after {
45
+ clear : both;
46
+ }
47
+
48
+ body {
49
+ background : # 494A5F ;
50
+ color : # D5D6E2 ;
51
+ font-weight : 500 ;
52
+ font-size : 1.05em ;
53
+ font-family : "Microsoft YaHei" , "Segoe UI" , "Lucida Grande" , Helvetica, Arial, sans-serif;
54
+ }
55
+ .htmleaf-links a { color : rgba (255 , 255 , 255 , 0.6 );outline : none;text-decoration : none;-webkit-transition : 0.2s ;transition : 0.2s ;}
56
+ .htmleaf-links a : hover , .htmleaf-links a : focus {color : # 74777b ;text-decoration : none;}
57
+ .htmleaf-container {
58
+ margin : 0 auto;
59
+ }
60
+
61
+ .bgcolor-1 { background : # f0efee ; }
62
+ .bgcolor-2 { background : # f9f9f9 ; }
63
+ .bgcolor-3 { background : # e8e8e8 ; }/*light grey*/
64
+ .bgcolor-4 { background : # 2f3238 ; color : # fff ; }/*Dark grey*/
65
+ .bgcolor-5 { background : # df6659 ; color : # 521e18 ; }/*pink1*/
66
+ .bgcolor-6 { background : # 2fa8ec ; }/*sky blue*/
67
+ .bgcolor-7 { background : # d0d6d6 ; }/*White tea*/
68
+ .bgcolor-8 { background : # 3d4444 ; color : # fff ; }/*Dark grey2*/
69
+ .bgcolor-9 { background : # ef3f52 ; color : # fff ;}/*pink2*/
70
+ .bgcolor-10 { background : # 64448f ; color : # fff ;}/*Violet*/
71
+ .bgcolor-11 { background : # 3755ad ; color : # fff ;}/*dark blue*/
72
+ .bgcolor-12 { background : # 3498DB ; color : # fff ;}/*light blue*/
73
+ .bgcolor-20 { background : # 494A5F ;color : # D5D6E2 ;}
74
+ /* Header */
75
+ .htmleaf-header {
76
+ width : 100% ;
77
+ padding : 0 2em ;
78
+ letter-spacing : -1px ;
79
+ text-align : center;
80
+ }
81
+ .htmleaf-header h1 {
82
+ color : # D5D6E2 ;
83
+ font-weight : 600 ;
84
+ font-size : 1.5em ;
85
+ line-height : 1 ;
86
+ margin-bottom : 0 ;
87
+ }
88
+ .htmleaf-header h1 span {
89
+ display : block;
90
+ font-size : 60% ;
91
+ font-weight : 400 ;
92
+ padding : 0.8em 0 0.5em 0 ;
93
+ color : # c3c8cd ;
94
+ }
95
+ /*nav*/
96
+ .htmleaf-demo a {color : # fff ;text-decoration : none;}
97
+ .htmleaf-demo {width : 100% ;padding-bottom : 1.2em ;}
98
+ .htmleaf-demo a {display : inline-block;margin : 0.5em ;padding : 0.6em 1em ;border : 3px solid # fff ;font-weight : 700 ;}
99
+ .htmleaf-demo a : hover {opacity : 0.6 ;}
100
+ .htmleaf-demo a .current {background : # 1d7db1 ;color : # fff ; }
101
+ /* Top Navigation Style */
102
+ .htmleaf-links {
103
+ position : relative;
104
+ display : inline-block;
105
+ white-space : nowrap;
106
+ font-size : 1.5em ;
107
+ text-align : center;
108
+ }
109
+
110
+ .htmleaf-links ::after {
111
+ position : absolute;
112
+ top : 0 ;
113
+ left : 50% ;
114
+ margin-left : -1px ;
115
+ width : 2px ;
116
+ height : 100% ;
117
+ background : # dbdbdb ;
118
+ content : '' ;
119
+ -webkit-transform : rotate3d (0 , 0 , 1 , 22.5deg );
120
+ transform : rotate3d (0 , 0 , 1 , 22.5deg );
121
+ }
122
+
123
+ .htmleaf-icon {
124
+ display : inline-block;
125
+ margin : 0.5em ;
126
+ padding : 0em 0 ;
127
+ width : 1.5em ;
128
+ text-decoration : none;
129
+ }
130
+
131
+ .htmleaf-icon span {
132
+ display : none;
133
+ }
134
+
135
+ .htmleaf-icon : before {
136
+ margin : 0 5px ;
137
+ text-transform : none;
138
+ font-weight : normal;
139
+ font-style : normal;
140
+ font-variant : normal;
141
+ font-family : 'icomoon' ;
142
+ line-height : 1 ;
143
+ speak : none;
144
+ -webkit-font-smoothing : antialiased;
145
+ }
146
+ /* footer */
147
+ .htmleaf-footer {width : 100% ;padding-top : 10px ;}
148
+ .htmleaf-small {font-size : 0.8em ;}
149
+ .center {text-align : center;}
150
+ /****/
151
+ .related {
152
+ color : # fff ;
153
+ background : # 494A5F ;
154
+ text-align : center;
155
+ font-size : 1.25em ;
156
+ padding : 0.5em 0 ;
157
+ overflow : hidden;
158
+ }
159
+
160
+ .related > a {
161
+ vertical-align : top;
162
+ width : calc (100% - 20px );
163
+ max-width : 340px ;
164
+ display : inline-block;
165
+ text-align : center;
166
+ margin : 20px 10px ;
167
+ padding : 25px ;
168
+ font-family : "Microsoft YaHei" , "宋体" , "Segoe UI" , "Lucida Grande" , Helvetica, Arial, sans-serif, FreeSans, Arimo;
169
+ }
170
+ .related a {
171
+ display : inline-block;
172
+ text-align : left;
173
+ margin : 20px auto;
174
+ padding : 10px 20px ;
175
+ opacity : 0.8 ;
176
+ -webkit-transition : opacity 0.3s ;
177
+ transition : opacity 0.3s ;
178
+ -webkit-backface-visibility : hidden;
179
+ text-decoration : none;
180
+ }
181
+
182
+ .related a : hover ,
183
+ .related a : active {
184
+ opacity : 1 ;
185
+ }
186
+
187
+ .related a img {
188
+ max-width : 100% ;
189
+ opacity : 0.8 ;
190
+ border-radius : 4px ;
191
+ }
192
+ .related a : hover img ,
193
+ .related a : active img {
194
+ opacity : 1 ;
195
+ }
196
+ .related h3 {font-family : "Microsoft YaHei" , sans-serif;font-size : 1.2em }
197
+ .related a h3 {
198
+ font-size : 0.85em ;
199
+ font-weight : 300 ;
200
+ margin-top : 0.15em ;
201
+ color : # fff ;
202
+ }
203
+ /* icomoon */
204
+ .icon-htmleaf-home-outline : before {
205
+ content : "\e5000" ;
206
+ }
207
+
208
+ .icon-htmleaf-arrow-forward-outline : before {
209
+ content : "\e5001" ;
210
+ }
211
+
212
+ @media screen and (max-width : 1024px ) {
213
+ .htmleaf-header {
214
+ padding : 2em 10% 2em ;
215
+ }
216
+ .htmleaf-header h1 {
217
+ font-size : 1.4em ;
218
+ }
219
+ .htmleaf-links {font-size : 1.4em }
220
+ }
221
+
222
+ @media screen and (max-width : 960px ) {
223
+ .htmleaf-header {
224
+ padding : 2em 10% 2em ;
225
+ }
226
+ .htmleaf-header h1 {
227
+ font-size : 1.2em ;
228
+ }
229
+ .htmleaf-links {font-size : 1.2em }
230
+ .related h3 {font-size : 1em ;}
231
+ .related a h3 {
232
+ font-size : 0.8em ;
233
+ }
234
+ }
235
+
236
+ @media screen and (max-width : 766px ) {
237
+ .htmleaf-header h1 {
238
+ font-size : 1.3em ;
239
+ }
240
+ .htmleaf-links {font-size : 1.3em }
241
+ }
242
+
243
+ @media screen and (max-width : 640px ) {
244
+ .htmleaf-header {
245
+ padding : 2em 10% 2em ;
246
+ }
247
+ .htmleaf-header h1 {
248
+ font-size : 1em ;
249
+ }
250
+ .htmleaf-links {font-size : 1em }
251
+ .related h3 {font-size : 0.8em ;}
252
+ .related a h3 {
253
+ font-size : 0.6em ;
254
+ }
255
+ }
0 commit comments