Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
S
solo
Project overview
Project overview
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Administrator
solo
Commits
017f9fda
Commit
017f9fda
authored
Nov 07, 2015
by
Liang Ding
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
.
parent
1bf30dcf
Changes
2
Hide whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
2 additions
and
2 deletions
+2
-2
src/main/webapp/skins/finding/css/finding.min.css
src/main/webapp/skins/finding/css/finding.min.css
+1
-1
src/main/webapp/skins/yilia/css/yilia.min.css
src/main/webapp/skins/yilia/css/yilia.min.css
+1
-1
No files found.
src/main/webapp/skins/finding/css/finding.min.css
View file @
017f9fda
@charset
"utf-8"
;
body
,
html
{
height
:
100%
;
max-height
:
100%
}
body
,
dl
,
h1
,
h2
,
h3
,
h4
,
h5
,
h6
,
ol
,
p
,
ul
{
text-rendering
:
geometricPrecision
}
.nav
li
a
,
dl
dt
{
text-overflow
:
ellipsis
}
dl
dd
,
dl
dt
{
margin-bottom
:
1em
}
body
,
li
li
{
margin
:
0
}
blockquote
cite
,
dl
dt
{
font-weight
:
700
}
dl
,
ol
,
p
,
pre
,
ul
{
margin
:
0
0
1.75em
}
.fn-left
,
dl
dt
{
float
:
left
}
#emotions
span
,
.icon-gotop
,
.share
.icon
{
cursor
:
pointer
}
#tags
li
,
.nav
ul
,
ul
.comments
{
list-style
:
none
}
html
{
font-size
:
62.5%
;
-webkit-tap-highlight-color
:
transparent
}
body
{
font-family
:
Merriweather
,
"Microsoft Yahei"
,
Helvetica
;
letter-spacing
:
.01rem
;
font-size
:
1.8rem
;
line-height
:
1.75em
;
color
:
#3A4145
;
-webkit-font-feature-settings
:
'kern'
1
;
-moz-font-feature-settings
:
'kern'
1
;
-o-font-feature-settings
:
'kern'
1
}
::-moz-selection
{
background
:
#D6EDFF
}
::selection
{
background
:
#D6EDFF
}
a
{
color
:
#4A4A4A
;
transition
:
color
.3s
ease
}
a
:hover
{
color
:
#111
}
h1
,
h2
,
h3
,
h4
,
h5
,
h6
{
-webkit-font-feature-settings
:
'dlig'
1
,
'liga'
1
,
'lnum'
1
,
'kern'
1
;
-moz-font-feature-settings
:
'dlig'
1
,
'liga'
1
,
'lnum'
1
,
'kern'
1
;
-o-font-feature-settings
:
'dlig'
1
,
'liga'
1
,
'lnum'
1
,
'kern'
1
;
color
:
#2E2E2E
;
line-height
:
1.15em
;
font-family
:
"Open Sans"
,
"Microsoft Yahei"
,
Helvetica
}
code
,
pre
,
tt
{
font-family
:
Inconsolata
,
monospace
,
"Microsoft Yahei"
,
Helvetica
;
background
:
#F7FAFB
}
h1
{
font-size
:
5rem
;
letter-spacing
:
-2px
;
text-indent
:
-3px
}
.page-title
a
,
h2
{
letter-spacing
:
-1px
}
h2
{
font-size
:
3.6rem
}
h3
{
font-size
:
3rem
}
h4
{
font-size
:
2.5rem
}
h5
,
h6
{
font-size
:
2rem
}
img
{
max-width
:
100%
}
dl
,
ol
,
p
,
ul
{
-webkit-font-feature-settings
:
'liga'
1
,
'onum'
1
,
'kern'
1
;
-moz-font-feature-settings
:
'liga'
1
,
'onum'
1
,
'kern'
1
;
-o-font-feature-settings
:
'liga'
1
,
'onum'
1
,
'kern'
1
}
ol
,
ul
{
padding-left
:
3rem
}
ol
ol
,
ol
ul
,
ul
ol
,
ul
ul
{
padding-left
:
2em
}
dl
dt
{
width
:
180px
;
overflow
:
hidden
;
clear
:
left
;
text-align
:
right
;
white-space
:
nowrap
}
dl
dd
{
margin-left
:
200px
}
hr
{
display
:
block
;
height
:
1px
;
border
:
0
;
border-top
:
#EFEFEF
1px
solid
;
margin
:
3.2em
0
;
padding
:
0
}
blockquote
{
-moz-box-sizing
:
border-box
;
box-sizing
:
border-box
;
margin
:
1.75em
0
1.75em
-2.2em
;
padding
:
0
0
0
1.75em
;
border-left
:
#4A4A4A
.4em
solid
}
.menu-button
,
pre
{
-moz-box-sizing
:
border-box
}
blockquote
p
{
margin
:
.8em
0
;
font-style
:
italic
}
blockquote
small
{
display
:
inline-block
;
margin
:
.8em
0
.8em
1.5em
;
font-size
:
.9em
;
color
:
#CCC
}
blockquote
small
:before
{
content
:
"\2014 \00A0"
}
blockquote
cite
a
{
font-weight
:
400
}
mark
{
background-color
:
#fdffb6
}
code
,
tt
{
padding
:
1px
3px
;
font-size
:
.85em
;
white-space
:
pre-wrap
;
border
:
1px
solid
#E3EDF3
;
border-radius
:
2px
}
pre
{
box-sizing
:
border-box
;
border
:
1px
solid
#E3EDF3
;
width
:
100%
;
padding
:
10px
;
font-size
:
.9em
;
white-space
:
pre
;
overflow
:
auto
;
border-radius
:
3px
}
pre
code
,
pre
tt
{
font-size
:
inherit
;
white-space
:
pre-wrap
;
background
:
0
0
;
border
:
none
;
padding
:
0
}
.menu-button
,
.nav
.count
,
.nav
li
a
{
white-space
:
nowrap
}
.fn-clear
:after
,
.fn-clear
:before
{
display
:
table
;
content
:
""
}
.fn-clear
:after
{
clear
:
both
}
.fn-right
{
float
:
right
}
.fn-none
{
display
:
none
}
.fn-vertical
{
display
:
table-cell
;
vertical-align
:
middle
}
.comments
li
img
,
.icon-menu
:before
{
vertical-align
:
sub
}
.fn-wrap
{
width
:
80%
;
max-width
:
768px
;
margin
:
0
auto
}
@-webkit-keyframes
fade-in-down
{
0
%
{
opacity
:
0
;
-webkit-transform
:
translateY
(
-10px
);
transform
:
translateY
(
-10px
)}
100
%
{
opacity
:
1
;
-webkit-transform
:
translateY
(
0
);
transform
:
translateY
(
0
)}}
@keyframes
fade-in-down
{
0
%
{
opacity
:
0
;
-webkit-transform
:
translateY
(
-10px
);
transform
:
translateY
(
-10px
)}
100
%
{
opacity
:
1
;
-webkit-transform
:
translateY
(
0
);
transform
:
translateY
(
0
)}}
@-webkit-keyframes
bounce
{
0
%,
10
%,
25
%,
40
%,
50
%
{
-webkit-transform
:
translateY
(
0
);
transform
:
translateY
(
0
)}
20
%
{
-webkit-transform
:
translateY
(
-10px
);
transform
:
translateY
(
-10px
)}
30
%
{
-webkit-transform
:
translateY
(
-5px
);
transform
:
translateY
(
-5px
)}}
@keyframes
bounce
{
0
%,
100
%,
20
%,
50
%,
80
%
{
-webkit-transform
:
translateY
(
0
);
transform
:
translateY
(
0
)}
40
%
{
-webkit-transform
:
translateY
(
-10px
);
transform
:
translateY
(
-10px
)}
60
%
{
-webkit-transform
:
translateY
(
-5px
);
transform
:
translateY
(
-5px
)}}
@-webkit-keyframes
upbounce
{
0
%,
10
%,
25
%,
40
%,
50
%
{
-webkit-transform
:
translateY
(
0
);
transform
:
translateY
(
0
)}
20
%
{
-webkit-transform
:
translateY
(
-10px
);
transform
:
translateY
(
-10px
)}
30
%
{
-webkit-transform
:
translateY
(
-5px
);
transform
:
translateY
(
-5px
)}}
@keyframes
upbounce
{
0
%,
100
%,
20
%,
50
%,
80
%
{
-webkit-transform
:
translateY
(
0
);
transform
:
translateY
(
0
)}
40
%
{
-webkit-transform
:
translateY
(
-10px
);
transform
:
translateY
(
-10px
)}
60
%
{
-webkit-transform
:
translateY
(
-5px
);
transform
:
translateY
(
-5px
)}}
@font-face
{
font-family
:
icomoon
;
src
:
url(fonts/icomoon.eot?v=1)
;
src
:
url(fonts/icomoon.eot?v=1#iefix)
format
(
"embedded-opentype"
),
url(fonts/icomoon.woff?v=1)
format
(
"woff"
),
url(fonts/icomoon.ttf?v=1)
format
(
"truetype"
),
url(fonts/icomoon.svg?v=1#icons)
format
(
"svg"
);
font-weight
:
400
;
font-style
:
normal
}
[
class
*=
" icon-"
]
:before
,[
class
^=
icon-
]
:before
{
font-size
:
2rem
;
font-family
:
icomoon
,
"Open Sans"
,
"Microsoft Yahei"
,
Helvetica
;
speak
:
none
;
font-style
:
normal
;
font-weight
:
400
;
font-variant
:
normal
;
text-transform
:
none
;
line-height
:
1
;
text-decoration
:
none
!important
;
-webkit-font-smoothing
:
antialiased
;
-moz-osx-font-smoothing
:
grayscale
}
.icon-arrow-left
:before
{
content
:
"\f605"
;
font-size
:
3.5rem
}
.icon-menu
:before
{
content
:
"\f609"
}
.icon-login
:before
{
content
:
"\e611"
}
.icon-logout
:before
{
content
:
"\e601"
}
.icon-setting
:before
{
content
:
"\e602"
}
.icon-register
:before
{
content
:
"\e600"
}
.avatar
{
border-radius
:
100%
;
float
:
left
;
height
:
24px
;
margin-right
:
9px
;
width
:
24px
}
.avatar-warp
{
width
:
10%
;
padding-right
:
10px
;
box-sizing
:
border-box
}
.avatar-48
{
box-shadow
:
0
0
2px
#ddd
;
height
:
auto
;
width
:
48px
;
margin-right
:
10px
;
border-radius
:
24px
}
.form
{
width
:
100%
;
margin-top
:
50px
}
.form
button
,
.form
input
,
.form
textarea
{
border
:
1px
solid
#CCC
;
background-color
:
#FAFAFA
;
border-radius
:
3px
;
box-shadow
:
0
1px
2px
rgba
(
0
,
0
,
0
,
.075
)
inset
;
padding
:
7px
8px
;
width
:
100%
;
box-sizing
:
border-box
;
-moz-box-sizing
:
border-box
;
-webkit-box-sizing
:
border-box
;
font-family
:
Merriweather
,
"Microsoft Yahei"
,
Helvetica
;
outline
:
0
}
.form
button
{
width
:
auto
;
vertical-align
:
bottom
}
.form
input
:focus
,
.form
textarea
:focus
{
background-color
:
#FFF
;
box-shadow
:
0
1px
2px
rgba
(
0
,
0
,
0
,
.075
)
inset
,
0
0
5px
rgba
(
81
,
167
,
232
,
.5
);
border
:
1px
solid
#51A7E8
}
.error-msg
{
font-size
:
1.5rem
;
color
:
#9EABB3
}
.cmtFromSym
{
font-size
:
1rem
;
color
:
#9EABB3
}
.em00
,
.em01
,
.em02
,
.em03
,
.em04
,
.em05
,
.em06
,
.em07
,
.em08
,
.em09
,
.em10
,
.em11
,
.em12
,
.em13
,
.em14
{
background-image
:
url(../images/emotions/emotions-ease.png)
;
float
:
left
;
height
:
24px
;
margin-right
:
5px
;
width
:
24px
}
.em01
{
background-position
:
-24px
0
}
.em02
{
background-position
:
-48px
0
}
.em03
{
background-position
:
-72px
0
}
.em04
{
background-position
:
-96px
0
}
.em05
{
background-position
:
0
-24px
}
.em06
{
background-position
:
-24px
-24px
}
.em07
{
background-position
:
-48px
-24px
}
.em08
{
background-position
:
-72px
-24px
}
.em09
{
background-position
:
-96px
-24px
}
.em10
{
background-position
:
0
-48px
}
.em11
{
background-position
:
-24px
-48px
}
.em12
{
background-position
:
-48px
-48px
}
.em13
{
background-position
:
-72px
-48px
}
.em14
{
background-position
:
-96px
-48px
}
.main-header
{
position
:
relative
;
display
:
table
;
width
:
100%
;
height
:
100vh
;
margin-bottom
:
5rem
;
text-align
:
center
;
background
:
url(../images/header-bg.jpg)
center
center
no-repeat
#222
;
background-size
:
cover
;
overflow
:
hidden
;
min-height
:
50vh
}
.menu-button
:hover
,
.site-wrapper
{
background
:
#fff
}
.site-wrapper
{
position
:
relative
;
z-index
:
10
;
min-height
:
100%
;
-webkit-transition
:
-webkit-transform
.5s
ease
;
transition
:
transform
.5s
ease
}
.menu-button
,
.scroll-down
{
position
:
absolute
;
text-decoration
:
none
;
text-align
:
center
}
.nav-opened
.site-wrapper
{
overflow-x
:
hidden
;
-webkit-transform
:
translate3D
(
-240px
,
0
,
0
);
-ms-transform
:
translate3D
(
-240px
,
0
,
0
);
transform
:
translate3D
(
-240px
,
0
,
0
);
-webkit-transition
:
-webkit-transform
.3s
ease
;
transition
:
transform
.3s
ease
}
.page-title
a
{
-webkit-animation
:
fade-in-down
.6s
;
animation
:
fade-in-down
.6s
;
-webkit-animation-delay
:
.2s
;
animation-delay
:
.2s
;
margin
:
10px
0
;
font-size
:
5rem
;
font-weight
:
700
;
font-family
:
"Open Sans"
,
"Microsoft Yahei"
,
Helvetica
;
color
:
#fff
;
text-shadow
:
0
0
3px
rgba
(
0
,
0
,
0
,
.9
);
text-decoration
:
none
}
.page-description
,
.page-description
a
{
-webkit-animation
:
fade-in-down
.9s
;
animation
:
fade-in-down
.9s
;
-webkit-animation-delay
:
.1s
;
animation-delay
:
.1s
;
margin
:
0
;
font-size
:
2rem
;
line-height
:
1.5em
;
font-weight
:
400
;
letter-spacing
:
.01rem
;
color
:
rgba
(
255
,
255
,
255
,
.8
)}
.scroll-down
{
display
:
block
;
z-index
:
100
;
bottom
:
45px
;
left
:
50%
;
margin-left
:
-16px
;
width
:
34px
;
height
:
34px
;
font-size
:
34px
;
color
:
rgba
(
255
,
255
,
255
,
.7
);
-webkit-animation
:
bounce
4s
2s
infinite
;
animation
:
bounce
4s
2s
infinite
}
.scroll-down
:hover
{
color
:
#fff
;
-webkit-animation
:
none
;
animation
:
none
}
.menu-button
{
-webkit-box-sizing
:
border-box
;
box-sizing
:
border-box
;
display
:
inline-block
;
float
:
right
;
height
:
38px
;
padding
:
0
15px
;
border-style
:
solid
;
border-width
:
1px
;
opacity
:
1
;
font-size
:
12px
;
text-transform
:
uppercase
;
line-height
:
35px
;
border-radius
:
3px
;
transition
:
all
.5s
ease
;
right
:
20px
;
top
:
40px
;
font-family
:
'Open Sans'
,
"Microsoft Yahei"
,
Helvetica
;
z-index
:
30
}
.pagination
,
.post-meta
,
.read-next-story
.post
:before
,
.site-footer
{
font-family
:
"Open Sans"
,
"Microsoft Yahei"
,
Helvetica
}
.menu-button
:focus
{
outline
:
0
}
.nav-closed
.menu-button
{
color
:
#fff
;
border-color
:
rgba
(
255
,
255
,
255
,
.6
)}
.nav-closed
.menu-button
:hover
{
color
:
#222
}
.nav-opened
.menu-button
{
padding
:
0
12px
;
background
:
#111
;
border-color
:
#111
;
color
:
#fff
;
-webkit-transform
:
translate3D
(
50px
,
0
,
0
);
-ms-transform
:
translate3D
(
50px
,
0
,
0
);
transform
:
translate3D
(
50px
,
0
,
0
);
transition
:
all
.3s
ease
}
.nav-opened
.menu-button
.word
{
opacity
:
0
;
transition
:
all
.3s
ease
}
.nav
{
position
:
fixed
;
top
:
0
;
right
:
0
;
bottom
:
0
;
z-index
:
5
;
width
:
220px
;
padding
:
10px
10px
0
;
opacity
:
0
;
background
:
#111
;
margin-bottom
:
0
;
text-align
:
left
;
overflow-y
:
auto
;
color
:
#FFF
;
-webkit-transition
:
-webkit-transform
.5s
ease
,
opacity
.3s
ease
.7s
;
transition
:
transform
.5s
ease
,
opacity
.3s
ease
.7s
;
overflow-x
:
hidden
}
.nav
ul
{
margin
:
0
;
padding
:
0
0
5%
;
counter-reset
:
item
}
.nav
li
{
height
:
30px
;
line-height
:
1.4rem
}
.nav
li
:before
{
display
:
block
;
float
:
right
;
padding-right
:
4%
;
padding-left
:
5px
;
text-align
:
right
;
font-size
:
1.2rem
;
vertical-align
:
bottom
;
color
:
#B8B8B8
;
content
:
counter
(
item
,
lower-roman
);
counter-increment
:
item
;
line-height
:
2.5rem
}
.nav
a
{
color
:
#B8B8B8
;
text-decoration
:
none
;
line-height
:
1.4
;
font-size
:
1.4rem
}
.nav
a
:hover
{
color
:
#FFF
}
.nav
li
a
{
display
:
block
;
padding
:
.6rem
4%
;
overflow
:
hidden
}
.nav
li
a
:after
{
display
:
inline-block
;
content
:
" ......................................................."
;
color
:
rgba
(
255
,
255
,
255
,
.2
);
margin-left
:
5px
}
.nav
.count
{
position
:
absolute
;
bottom
:
10px
;
font-size
:
1rem
;
width
:
100%
;
word-wrap
:
normal
;
word-break
:
break-all
}
.nav
[
class
^=
icon-
]
{
color
:
#FFF
}
.nav
[
class
^=
icon-
]
:hover
{
color
:
#B8B8B8
}
body
.nav-closed
.nav
{
-webkit-transform
:
translate3D
(
97px
,
0
,
0
);
-ms-transform
:
translate3D
(
97px
,
0
,
0
);
transform
:
translate3D
(
97px
,
0
,
0
)}
body
.nav-opened
.nav
{
opacity
:
1
;
-webkit-transition
:
-webkit-transform
.3s
ease
,
opacity
0s
ease
0s
;
transition
:
transform
.3s
ease
,
opacity
0s
ease
0s
;
-webkit-transform
:
translate3D
(
0
,
0
,
0
);
-ms-transform
:
translate3D
(
0
,
0
,
0
);
transform
:
translate3D
(
0
,
0
,
0
)}
article
.post
{
position
:
relative
;
margin
:
4rem
auto
;
padding-bottom
:
4rem
;
border-bottom
:
#EBF2F6
1px
solid
;
word-wrap
:
break-word
;
width
:
80%
}
article
.post
:after
{
display
:
block
;
content
:
""
;
width
:
7px
;
height
:
7px
;
border
:
1px
solid
#E7EEF2
;
position
:
absolute
;
bottom
:
-5px
;
left
:
50%
;
margin-left
:
-5px
;
background
:
#FFF
;
border-radius
:
100%
;
box-shadow
:
#FFF
0
0
0
5px
}
.post-meta
time
,
.post-tip
{
display
:
inline-block
;
white-space
:
nowrap
;
text-transform
:
uppercase
}
.post-title
a
{
text-decoration
:
none
}
.post-tip
{
font-size
:
1.3rem
;
color
:
#9EABB3
}
.post-excerpt
p
{
margin
:
0
;
font-size
:
.9em
;
line-height
:
1.7em
}
.post-meta
{
color
:
#9eabb3
;
font-size
:
1.5rem
;
line-height
:
2.2rem
;
margin
:
1.75rem
0
0
}
.post-meta
a
{
color
:
#9EABB3
;
text-decoration
:
none
}
.post-meta
a
:hover
{
text-decoration
:
underline
}
#tags
li
a
,
.dynamic
a
,
.icon-gotop
,
.pagination
a
,
.read-next-story
,
.site-footer
a
{
text-decoration
:
none
}
.post-meta
time
{
border-left
:
1px
solid
#d5dbde
;
font-size
:
1.3rem
;
margin-left
:
8px
;
padding-left
:
12px
}
.post-author
{
box-sizing
:
border-box
;
display
:
block
;
position
:
absolute
;
bottom
:
-57px
;
left
:
50%
;
margin-left
:
-40px
;
width
:
80px
;
height
:
80px
;
border-radius
:
100%
;
overflow
:
hidden
;
padding
:
6px
;
background
:
#fff
;
z-index
:
2
;
box-shadow
:
#E7EEF2
0
0
0
1px
}
.post-author
a
{
background-size
:
cover
;
background-position
:
center
center
;
width
:
68px
;
height
:
68px
;
display
:
block
;
border-radius
:
35px
}
.share
.icon
{
transition
:
all
.2s
ease-out
0s
;
display
:
inline-block
;
font-size
:
16px
;
margin-top
:
15px
}
.share
.icon
:hover
{
transform
:
rotate
(
360deg
);
color
:
#9EABB3
}
.icon-weibo
:before
{
content
:
"\e605"
}
.icon-twitter
:before
{
content
:
"\e60b"
}
.icon-tencent
:before
{
content
:
"\e60d"
}
.icon-google
:before
{
content
:
"\e603"
}
.icon-gotop
:before
{
content
:
"\E60A"
;
font-weight
:
700
}
.icon-gotop
{
position
:
fixed
;
bottom
:
30px
;
right
:
30px
;
-webkit-animation
:
upbounce
4s
2s
infinite
;
animation
:
upbounce
4s
2s
infinite
;
z-index
:
10
}
.icon-gotop
:hover
{
color
:
#B8B8B8
;
-webkit-animation
:
none
;
animation
:
none
}
.pagination
{
font-size
:
1.3rem
;
color
:
#9eabb3
;
text-align
:
center
}
.pagination
a
{
color
:
#9EABB3
;
transition
:
all
.2s
ease
;
padding
:
0
15px
;
border
:
1px
solid
#bfc8cd
;
display
:
inline-block
;
border-radius
:
4px
}
.pagination
a
:hover
{
border-color
:
#98a0a4
;
color
:
#889093
}
ul
.comments
{
padding
:
0
;
margin-top
:
100px
;
position
:
relative
}
.comments
li
{
padding
:
10px
;
white-space
:
normal
;
word-wrap
:
break-word
;
position
:
relative
;
border-bottom
:
#EBF2F6
1px
solid
}
.comments
li
:hover
{
background-color
:
#F7F7F7
}
.comments
.comment-content
{
margin
:
8px
0
0
}
.comments
li
.comment-body-ref
{
position
:
absolute
;
z-index
:
10
;
background-color
:
#EBF2F6
;
border
:
1px
solid
#d5dbde
;
width
:
86%
;
left
:
69px
}
.comments
.post-meta
{
margin-top
:
0
}
#captcha
,
#captchaReply
{
height
:
27px
;
display
:
inline-block
;
vertical-align
:
inherit
}
.read-next
{
display
:
-webkit-box
;
display
:
-webkit-flex
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-align
:
stretch
;
-webkit-align-items
:
stretch
;
-ms-flex-align
:
stretch
;
align-items
:
stretch
;
margin-top
:
10rem
}
.read-next-story
{
display
:
-webkit-box
;
display
:
-webkit-flex
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-flex
:
1
;
-webkit-flex-grow
:
1
;
-ms-flex-positive
:
1
;
flex-grow
:
1
;
min-width
:
50%
;
position
:
relative
;
text-align
:
center
;
color
:
#fff
;
background
:
center
center
no-repeat
#222
;
background-size
:
cover
;
overflow
:
hidden
}
.read-next-story
a
{
color
:
#BBB
}
.read-next-story
a
:hover
{
color
:
#FFF
}
.read-next-story
:hover:before
{
background
:
rgba
(
0
,
0
,
0
,
.8
);
transition
:
all
.2s
ease
}
.read-next-story
:hover
.post
:before
{
color
:
#222
;
background
:
#fff
;
transition
:
all
.2s
ease
}
.read-next-story
:before
{
content
:
""
;
display
:
block
;
position
:
absolute
;
top
:
0
;
right
:
0
;
bottom
:
0
;
left
:
0
;
background
:
rgba
(
0
,
0
,
0
,
.7
);
transition
:
all
.5s
ease
}
.read-next-story
.post
{
padding-top
:
6rem
;
padding-bottom
:
6rem
;
width
:
80%
;
position
:
relative
;
margin
:
0
auto
}
.read-next-story
.post
:before
{
content
:
"Read This Next"
;
padding
:
4px
10px
5px
;
text-transform
:
uppercase
;
font-size
:
1.1rem
;
color
:
rgba
(
255
,
255
,
255
,
.8
);
border
:
1px
solid
rgba
(
255
,
255
,
255
,
.5
);
border-radius
:
4px
;
transition
:
all
.5s
ease
}
.read-next-story.prev
.post
:before
{
content
:
"Read This Before"
}
.read-next-story
h2
{
margin-top
:
1rem
;
color
:
#fff
}
.read-next-story
p
{
margin
:
0
;
color
:
rgba
(
255
,
255
,
255
,
.8
)}
.read-next
+
.site-footer
{
position
:
absolute
;
bottom
:
0
;
left
:
0
;
right
:
0
;
margin
:
0
}
#tags
{
padding
:
0
}
#tags
li
{
float
:
left
}
#tags
li
a
{
border
:
1px
solid
#4A4A4A
;
display
:
inline-block
;
padding
:
10px
;
margin
:
1rem
;
border-radius
:
5px
}
#tags
li
a
:hover
{
border
:
1px
solid
#FFF
;
color
:
#FFF
;
background-color
:
#4A4A4A
}
.dynamic
.read-next-story
>
div
{
position
:
relative
;
width
:
60%
;
margin
:
50px
auto
;
text-align
:
left
}
.dynamic
a
{
margin
:
0
;
color
:
rgba
(
255
,
255
,
255
,
.8
)}
.dynamic
a
:hover
{
color
:
rgba
(
255
,
255
,
255
,
.5
)}
.site-footer
{
position
:
relative
;
margin
:
8rem
0
0
;
padding
:
1rem
15px
;
font-size
:
1rem
;
line-height
:
1.75em
;
color
:
#BBC7CC
}
.site-footer
a
{
color
:
#BBC7CC
;
font-weight
:
700
}
.site-footer
a
:hover
{
text-decoration
:
underline
}
@media
only
screen
and
(
max-width
:
900px
){
blockquote
{
margin-left
:
0
}
.main-header
{
-webkit-box-sizing
:
border-box
;
-moz-box-sizing
:
border-box
;
box-sizing
:
border-box
;
min-height
:
240px
;
height
:
60vh
;
padding
:
15%
0
}
.scroll-down
{
display
:
none
}
.page-title
,
.page-title
a
{
font-size
:
4rem
;
letter-spacing
:
-1px
}
.page-description
,
.page-description
a
{
font-size
:
1.8rem
;
line-height
:
1.5em
}
.post
{
font-size
:
.95em
}
hr
{
margin
:
2.4em
0
}
ol
,
ul
{
padding-left
:
2em
}
h1
{
font-size
:
4.5rem
;
text-indent
:
-2px
}
h2
{
font-size
:
3.6rem
}
h3
{
font-size
:
3.1rem
}
h4
{
font-size
:
2.5rem
}
h5
{
font-size
:
2.2rem
}
h6
{
font-size
:
1.8rem
}
.read-next
{
-webkit-box-orient
:
vertical
;
-webkit-box-direction
:
normal
;
-webkit-flex-direction
:
column
;
-ms-flex-direction
:
column
;
flex-direction
:
column
;
margin-top
:
4rem
}}
@media
only
screen
and
(
max-width
:
500px
){
.main-header
{
margin-bottom
:
15px
;
height
:
40vh
}
.pagination
{
width
:
auto
;
margin
:
2rem
auto
}
.post
{
width
:
auto
;
padding-bottom
:
2rem
;
line-height
:
1.65em
;
margin
:
2rem
16px
}
hr
{
margin
:
1.75em
0
}
dl
,
ol
,
p
,
ul
{
font-size
:
.95em
;
margin
:
0
0
2.5rem
}
.page-title
,
.page-title
a
{
font-size
:
3rem
}
.post-excerpt
p
{
font-size
:
.85em
}
.page-description
,
.page-description
a
{
font-size
:
1.6rem
}
h1
,
h2
,
h3
,
h4
,
h5
,
h6
{
margin
:
0
0
.3em
}
h1
{
font-size
:
2.8rem
;
letter-spacing
:
-1px
}
h2
{
font-size
:
2.4rem
;
letter-spacing
:
0
}
h3
{
font-size
:
2.1rem
}
h4
{
font-size
:
1.9rem
}
h5
,
h6
{
font-size
:
1.8rem
}
.post-content
img
{
padding
:
0
;
width
:
calc
(
100%
+
32px
);
min-width
:
0
;
max-width
:
112%
}
.post-meta
{
font-size
:
1.3rem
;
margin-top
:
1rem
}
.site-footer
{
margin-top
:
3rem
}
.read-next
{
margin-top
:
2rem
;
margin-bottom
:
-37px
}
.read-next
.post
{
width
:
100%
}
.menu-button
{
border
:
0
;
top
:
0
;
right
:
0
}
.nav-closed
.menu-button
:hover
{
color
:
#FFF
;
background-color
:
transparent
}
.nav-opened
.menu-button
{
display
:
none
}
.post-author
{
width
:
40px
;
height
:
40px
;
bottom
:
-37px
;
padding
:
3px
;
margin-left
:
-20px
}
.post-author
a
{
width
:
34px
;
height
:
34px
;
display
:
block
;
border-radius
:
17px
}
.nav
.count
{
line-height
:
1.5rem
}
#tags
li
a
{
padding
:
0
5px
}}
\ No newline at end of file
@charset
"utf-8"
;
body
,
html
{
height
:
100%
;
max-height
:
100%
}
body
,
dl
,
h1
,
h2
,
h3
,
h4
,
h5
,
h6
,
ol
,
p
,
ul
{
text-rendering
:
geometricPrecision
}
.nav
li
a
,
dl
dt
{
text-overflow
:
ellipsis
}
dl
dd
,
dl
dt
{
margin-bottom
:
1em
}
body
,
li
li
{
margin
:
0
}
blockquote
cite
,
dl
dt
{
font-weight
:
700
}
dl
,
ol
,
p
,
pre
,
ul
{
margin
:
0
0
1.75em
}
.fn-left
,
dl
dt
{
float
:
left
}
#tags
li
,
.nav
ul
,
ul
.comments
{
list-style
:
none
}
html
{
font-size
:
62.5%
;
-webkit-tap-highlight-color
:
transparent
}
body
{
font-family
:
Merriweather
,
"Microsoft Yahei"
,
Helvetica
;
letter-spacing
:
.01rem
;
font-size
:
1.8rem
;
line-height
:
1.75em
;
color
:
#3A4145
;
-webkit-font-feature-settings
:
'kern'
1
;
-moz-font-feature-settings
:
'kern'
1
;
-o-font-feature-settings
:
'kern'
1
}
::-moz-selection
{
background
:
#D6EDFF
}
::selection
{
background
:
#D6EDFF
}
a
{
color
:
#4A4A4A
;
transition
:
color
.3s
ease
}
a
:hover
{
color
:
#111
}
h1
,
h2
,
h3
,
h4
,
h5
,
h6
{
-webkit-font-feature-settings
:
'dlig'
1
,
'liga'
1
,
'lnum'
1
,
'kern'
1
;
-moz-font-feature-settings
:
'dlig'
1
,
'liga'
1
,
'lnum'
1
,
'kern'
1
;
-o-font-feature-settings
:
'dlig'
1
,
'liga'
1
,
'lnum'
1
,
'kern'
1
;
color
:
#2E2E2E
;
line-height
:
1.15em
;
font-family
:
"Open Sans"
,
"Microsoft Yahei"
,
Helvetica
}
code
,
pre
,
tt
{
font-family
:
Inconsolata
,
monospace
,
"Microsoft Yahei"
,
Helvetica
;
background
:
#F7FAFB
}
h1
{
font-size
:
5rem
;
letter-spacing
:
-2px
;
text-indent
:
-3px
}
.page-title
a
,
h2
{
letter-spacing
:
-1px
}
h2
{
font-size
:
3.6rem
}
h3
{
font-size
:
3rem
}
h4
{
font-size
:
2.5rem
}
h5
,
h6
{
font-size
:
2rem
}
img
{
max-width
:
100%
}
dl
,
ol
,
p
,
ul
{
-webkit-font-feature-settings
:
'liga'
1
,
'onum'
1
,
'kern'
1
;
-moz-font-feature-settings
:
'liga'
1
,
'onum'
1
,
'kern'
1
;
-o-font-feature-settings
:
'liga'
1
,
'onum'
1
,
'kern'
1
}
ol
,
ul
{
padding-left
:
3rem
}
ol
ol
,
ol
ul
,
ul
ol
,
ul
ul
{
padding-left
:
2em
}
dl
dt
{
width
:
180px
;
overflow
:
hidden
;
clear
:
left
;
text-align
:
right
;
white-space
:
nowrap
}
dl
dd
{
margin-left
:
200px
}
hr
{
display
:
block
;
height
:
1px
;
border
:
0
;
border-top
:
#EFEFEF
1px
solid
;
margin
:
3.2em
0
;
padding
:
0
}
blockquote
{
-moz-box-sizing
:
border-box
;
box-sizing
:
border-box
;
margin
:
1.75em
0
1.75em
-2.2em
;
padding
:
0
0
0
1.75em
;
border-left
:
#4A4A4A
.4em
solid
}
.menu-button
,
pre
{
-moz-box-sizing
:
border-box
}
blockquote
p
{
margin
:
.8em
0
;
font-style
:
italic
}
blockquote
small
{
display
:
inline-block
;
margin
:
.8em
0
.8em
1.5em
;
font-size
:
.9em
;
color
:
#CCC
}
blockquote
small
:before
{
content
:
"\2014 \00A0"
}
blockquote
cite
a
{
font-weight
:
400
}
mark
{
background-color
:
#fdffb6
}
code
,
tt
{
padding
:
1px
3px
;
font-size
:
.85em
;
white-space
:
pre-wrap
;
border
:
1px
solid
#E3EDF3
;
border-radius
:
2px
}
pre
{
box-sizing
:
border-box
;
border
:
1px
solid
#E3EDF3
;
width
:
100%
;
padding
:
10px
;
font-size
:
.9em
;
white-space
:
pre
;
overflow
:
auto
;
border-radius
:
3px
}
pre
code
,
pre
tt
{
font-size
:
inherit
;
white-space
:
pre-wrap
;
background
:
0
0
;
border
:
none
;
padding
:
0
}
.menu-button
,
.nav
.count
,
.nav
li
a
{
white-space
:
nowrap
}
.fn-clear
:after
,
.fn-clear
:before
{
display
:
table
;
content
:
""
}
.fn-clear
:after
{
clear
:
both
}
.fn-right
{
float
:
right
}
.fn-none
{
display
:
none
}
.fn-vertical
{
display
:
table-cell
;
vertical-align
:
middle
}
.comments
li
img
,
.icon-menu
:before
{
vertical-align
:
sub
}
.fn-wrap
{
width
:
80%
;
max-width
:
768px
;
margin
:
0
auto
}
@-webkit-keyframes
fade-in-down
{
0
%
{
opacity
:
0
;
-webkit-transform
:
translateY
(
-10px
);
transform
:
translateY
(
-10px
)}
100
%
{
opacity
:
1
;
-webkit-transform
:
translateY
(
0
);
transform
:
translateY
(
0
)}}
@keyframes
fade-in-down
{
0
%
{
opacity
:
0
;
-webkit-transform
:
translateY
(
-10px
);
transform
:
translateY
(
-10px
)}
100
%
{
opacity
:
1
;
-webkit-transform
:
translateY
(
0
);
transform
:
translateY
(
0
)}}
@-webkit-keyframes
bounce
{
0
%,
10
%,
25
%,
40
%,
50
%
{
-webkit-transform
:
translateY
(
0
);
transform
:
translateY
(
0
)}
20
%
{
-webkit-transform
:
translateY
(
-10px
);
transform
:
translateY
(
-10px
)}
30
%
{
-webkit-transform
:
translateY
(
-5px
);
transform
:
translateY
(
-5px
)}}
@keyframes
bounce
{
0
%,
100
%,
20
%,
50
%,
80
%
{
-webkit-transform
:
translateY
(
0
);
transform
:
translateY
(
0
)}
40
%
{
-webkit-transform
:
translateY
(
-10px
);
transform
:
translateY
(
-10px
)}
60
%
{
-webkit-transform
:
translateY
(
-5px
);
transform
:
translateY
(
-5px
)}}
@-webkit-keyframes
upbounce
{
0
%,
10
%,
25
%,
40
%,
50
%
{
-webkit-transform
:
translateY
(
0
);
transform
:
translateY
(
0
)}
20
%
{
-webkit-transform
:
translateY
(
-10px
);
transform
:
translateY
(
-10px
)}
30
%
{
-webkit-transform
:
translateY
(
-5px
);
transform
:
translateY
(
-5px
)}}
@keyframes
upbounce
{
0
%,
100
%,
20
%,
50
%,
80
%
{
-webkit-transform
:
translateY
(
0
);
transform
:
translateY
(
0
)}
40
%
{
-webkit-transform
:
translateY
(
-10px
);
transform
:
translateY
(
-10px
)}
60
%
{
-webkit-transform
:
translateY
(
-5px
);
transform
:
translateY
(
-5px
)}}
@font-face
{
font-family
:
icomoon
;
src
:
url(fonts/icomoon.eot?v=1)
;
src
:
url(fonts/icomoon.eot?v=1#iefix)
format
(
"embedded-opentype"
),
url(fonts/icomoon.woff?v=1)
format
(
"woff"
),
url(fonts/icomoon.ttf?v=1)
format
(
"truetype"
),
url(fonts/icomoon.svg?v=1#icons)
format
(
"svg"
);
font-weight
:
400
;
font-style
:
normal
}
[
class
*=
" icon-"
]
:before
,[
class
^=
icon-
]
:before
{
font-size
:
2rem
;
font-family
:
icomoon
,
"Open Sans"
,
"Microsoft Yahei"
,
Helvetica
;
speak
:
none
;
font-style
:
normal
;
font-weight
:
400
;
font-variant
:
normal
;
text-transform
:
none
;
line-height
:
1
;
text-decoration
:
none
!important
;
-webkit-font-smoothing
:
antialiased
;
-moz-osx-font-smoothing
:
grayscale
}
.icon-arrow-left
:before
{
content
:
"\f605"
;
font-size
:
3.5rem
}
.icon-menu
:before
{
content
:
"\f609"
}
.icon-login
:before
{
content
:
"\e611"
}
.icon-logout
:before
{
content
:
"\e601"
}
.icon-setting
:before
{
content
:
"\e602"
}
.icon-register
:before
{
content
:
"\e600"
}
.avatar
{
border-radius
:
100%
;
float
:
left
;
height
:
24px
;
margin-right
:
9px
;
width
:
24px
}
.avatar-warp
{
width
:
10%
;
padding-right
:
10px
;
box-sizing
:
border-box
}
.avatar-48
{
box-shadow
:
0
0
2px
#ddd
;
height
:
auto
;
width
:
48px
;
margin-right
:
10px
;
border-radius
:
24px
}
.form
{
width
:
100%
;
margin-top
:
50px
}
.form
button
,
.form
input
,
.form
textarea
{
border
:
1px
solid
#CCC
;
background-color
:
#FAFAFA
;
border-radius
:
3px
;
box-shadow
:
0
1px
2px
rgba
(
0
,
0
,
0
,
.075
)
inset
;
padding
:
7px
8px
;
width
:
100%
;
box-sizing
:
border-box
;
-moz-box-sizing
:
border-box
;
-webkit-box-sizing
:
border-box
;
font-family
:
Merriweather
,
"Microsoft Yahei"
,
Helvetica
;
outline
:
0
}
.form
button
{
width
:
auto
;
vertical-align
:
bottom
}
.form
input
:focus
,
.form
textarea
:focus
{
background-color
:
#FFF
;
box-shadow
:
0
1px
2px
rgba
(
0
,
0
,
0
,
.075
)
inset
,
0
0
5px
rgba
(
81
,
167
,
232
,
.5
);
border
:
1px
solid
#51A7E8
}
.error-msg
{
font-size
:
1.5rem
;
color
:
#9EABB3
}
.cmtFromSym
{
font-size
:
1rem
;
color
:
#9EABB3
}
.em00
,
.em01
,
.em02
,
.em03
,
.em04
,
.em05
,
.em06
,
.em07
,
.em08
,
.em09
,
.em10
,
.em11
,
.em12
,
.em13
,
.em14
{
cursor
:
pointer
;
background-image
:
url(../images/emotions/emotions-ease.png)
;
float
:
left
;
height
:
24px
;
margin-right
:
5px
;
width
:
24px
;
transition
:
all
.2s
ease-out
;
-webkit-transition
:
all
.2s
ease-out
;
-moz-transition
:
all
.2s
ease-out
}
#emotions
span
:hover
{
transform
:
scale
(
1.2
)
rotate
(
360deg
);
-webkit-transform
:
scale
(
1.2
)
rotate
(
360deg
);
-moz-transform
:
scale
(
1.2
)
rotate
(
360deg
)}
.em01
{
background-position
:
-24px
0
}
.em02
{
background-position
:
-48px
0
}
.em03
{
background-position
:
-72px
0
}
.em04
{
background-position
:
-96px
0
}
.em05
{
background-position
:
0
-24px
}
.em06
{
background-position
:
-24px
-24px
}
.em07
{
background-position
:
-48px
-24px
}
.em08
{
background-position
:
-72px
-24px
}
.em09
{
background-position
:
-96px
-24px
}
.em10
{
background-position
:
0
-48px
}
.em11
{
background-position
:
-24px
-48px
}
.em12
{
background-position
:
-48px
-48px
}
.em13
{
background-position
:
-72px
-48px
}
.em14
{
background-position
:
-96px
-48px
}
.main-header
{
position
:
relative
;
display
:
table
;
width
:
100%
;
height
:
100vh
;
margin-bottom
:
5rem
;
text-align
:
center
;
background
:
url(../images/header-bg.jpg)
center
center
no-repeat
#222
;
background-size
:
cover
;
overflow
:
hidden
;
min-height
:
50vh
}
.menu-button
:hover
,
.site-wrapper
{
background
:
#fff
}
.site-wrapper
{
position
:
relative
;
z-index
:
10
;
min-height
:
100%
;
-webkit-transition
:
-webkit-transform
.5s
ease
;
transition
:
transform
.5s
ease
}
.menu-button
,
.scroll-down
{
position
:
absolute
;
text-decoration
:
none
;
text-align
:
center
}
.nav-opened
.site-wrapper
{
overflow-x
:
hidden
;
-webkit-transform
:
translate3D
(
-240px
,
0
,
0
);
-ms-transform
:
translate3D
(
-240px
,
0
,
0
);
transform
:
translate3D
(
-240px
,
0
,
0
);
-webkit-transition
:
-webkit-transform
.3s
ease
;
transition
:
transform
.3s
ease
}
.page-title
a
{
-webkit-animation
:
fade-in-down
.6s
;
animation
:
fade-in-down
.6s
;
-webkit-animation-delay
:
.2s
;
animation-delay
:
.2s
;
margin
:
10px
0
;
font-size
:
5rem
;
font-weight
:
700
;
font-family
:
"Open Sans"
,
"Microsoft Yahei"
,
Helvetica
;
color
:
#fff
;
text-shadow
:
0
0
3px
rgba
(
0
,
0
,
0
,
.9
);
text-decoration
:
none
}
.page-description
,
.page-description
a
{
-webkit-animation
:
fade-in-down
.9s
;
animation
:
fade-in-down
.9s
;
-webkit-animation-delay
:
.1s
;
animation-delay
:
.1s
;
margin
:
0
;
font-size
:
2rem
;
line-height
:
1.5em
;
font-weight
:
400
;
letter-spacing
:
.01rem
;
color
:
rgba
(
255
,
255
,
255
,
.8
)}
.scroll-down
{
display
:
block
;
z-index
:
100
;
bottom
:
45px
;
left
:
50%
;
margin-left
:
-16px
;
width
:
34px
;
height
:
34px
;
font-size
:
34px
;
color
:
rgba
(
255
,
255
,
255
,
.7
);
-webkit-animation
:
bounce
4s
2s
infinite
;
animation
:
bounce
4s
2s
infinite
}
.scroll-down
:hover
{
color
:
#fff
;
-webkit-animation
:
none
;
animation
:
none
}
.menu-button
{
-webkit-box-sizing
:
border-box
;
box-sizing
:
border-box
;
display
:
inline-block
;
float
:
right
;
height
:
38px
;
padding
:
0
15px
;
border-style
:
solid
;
border-width
:
1px
;
opacity
:
1
;
font-size
:
12px
;
text-transform
:
uppercase
;
line-height
:
35px
;
border-radius
:
3px
;
transition
:
all
.5s
ease
;
right
:
20px
;
top
:
40px
;
font-family
:
'Open Sans'
,
"Microsoft Yahei"
,
Helvetica
;
z-index
:
30
}
.pagination
,
.post-meta
,
.read-next-story
.post
:before
,
.site-footer
{
font-family
:
"Open Sans"
,
"Microsoft Yahei"
,
Helvetica
}
.menu-button
:focus
{
outline
:
0
}
.nav-closed
.menu-button
{
color
:
#fff
;
border-color
:
rgba
(
255
,
255
,
255
,
.6
)}
.nav-closed
.menu-button
:hover
{
color
:
#222
}
.nav-opened
.menu-button
{
padding
:
0
12px
;
background
:
#111
;
border-color
:
#111
;
color
:
#fff
;
-webkit-transform
:
translate3D
(
50px
,
0
,
0
);
-ms-transform
:
translate3D
(
50px
,
0
,
0
);
transform
:
translate3D
(
50px
,
0
,
0
);
transition
:
all
.3s
ease
}
.nav-opened
.menu-button
.word
{
opacity
:
0
;
transition
:
all
.3s
ease
}
.nav
{
position
:
fixed
;
top
:
0
;
right
:
0
;
bottom
:
0
;
z-index
:
5
;
width
:
220px
;
padding
:
10px
10px
0
;
opacity
:
0
;
background
:
#111
;
margin-bottom
:
0
;
text-align
:
left
;
overflow-y
:
auto
;
color
:
#FFF
;
-webkit-transition
:
-webkit-transform
.5s
ease
,
opacity
.3s
ease
.7s
;
transition
:
transform
.5s
ease
,
opacity
.3s
ease
.7s
;
overflow-x
:
hidden
}
.nav
ul
{
margin
:
0
;
padding
:
0
0
5%
;
counter-reset
:
item
}
.nav
li
{
height
:
30px
;
line-height
:
1.4rem
}
.nav
li
:before
{
display
:
block
;
float
:
right
;
padding-right
:
4%
;
padding-left
:
5px
;
text-align
:
right
;
font-size
:
1.2rem
;
vertical-align
:
bottom
;
color
:
#B8B8B8
;
content
:
counter
(
item
,
lower-roman
);
counter-increment
:
item
;
line-height
:
2.5rem
}
.nav
a
{
color
:
#B8B8B8
;
text-decoration
:
none
;
line-height
:
1.4
;
font-size
:
1.4rem
}
.nav
a
:hover
{
color
:
#FFF
}
.nav
li
a
{
display
:
block
;
padding
:
.6rem
4%
;
overflow
:
hidden
}
.nav
li
a
:after
{
display
:
inline-block
;
content
:
" ......................................................."
;
color
:
rgba
(
255
,
255
,
255
,
.2
);
margin-left
:
5px
}
.nav
.count
{
position
:
absolute
;
bottom
:
10px
;
font-size
:
1rem
;
width
:
100%
;
word-wrap
:
normal
;
word-break
:
break-all
}
.nav
[
class
^=
icon-
]
{
color
:
#FFF
}
.nav
[
class
^=
icon-
]
:hover
{
color
:
#B8B8B8
}
body
.nav-closed
.nav
{
-webkit-transform
:
translate3D
(
97px
,
0
,
0
);
-ms-transform
:
translate3D
(
97px
,
0
,
0
);
transform
:
translate3D
(
97px
,
0
,
0
)}
body
.nav-opened
.nav
{
opacity
:
1
;
-webkit-transition
:
-webkit-transform
.3s
ease
,
opacity
0s
ease
0s
;
transition
:
transform
.3s
ease
,
opacity
0s
ease
0s
;
-webkit-transform
:
translate3D
(
0
,
0
,
0
);
-ms-transform
:
translate3D
(
0
,
0
,
0
);
transform
:
translate3D
(
0
,
0
,
0
)}
article
.post
{
position
:
relative
;
margin
:
4rem
auto
;
padding-bottom
:
4rem
;
border-bottom
:
#EBF2F6
1px
solid
;
word-wrap
:
break-word
;
width
:
80%
}
article
.post
:after
{
display
:
block
;
content
:
""
;
width
:
7px
;
height
:
7px
;
border
:
1px
solid
#E7EEF2
;
position
:
absolute
;
bottom
:
-5px
;
left
:
50%
;
margin-left
:
-5px
;
background
:
#FFF
;
border-radius
:
100%
;
box-shadow
:
#FFF
0
0
0
5px
}
.post-meta
time
,
.post-tip
{
display
:
inline-block
;
white-space
:
nowrap
;
text-transform
:
uppercase
}
.post-title
a
{
text-decoration
:
none
}
.post-tip
{
font-size
:
1.3rem
;
color
:
#9EABB3
}
.post-excerpt
p
{
margin
:
0
;
font-size
:
.9em
;
line-height
:
1.7em
}
.post-meta
{
color
:
#9eabb3
;
font-size
:
1.5rem
;
line-height
:
2.2rem
;
margin
:
1.75rem
0
0
}
.post-meta
a
{
color
:
#9EABB3
;
text-decoration
:
none
}
.post-meta
a
:hover
{
text-decoration
:
underline
}
#tags
li
a
,
.dynamic
a
,
.icon-gotop
,
.pagination
a
,
.read-next-story
,
.site-footer
a
{
text-decoration
:
none
}
.post-meta
time
{
border-left
:
1px
solid
#d5dbde
;
font-size
:
1.3rem
;
margin-left
:
8px
;
padding-left
:
12px
}
.post-author
{
box-sizing
:
border-box
;
display
:
block
;
position
:
absolute
;
bottom
:
-57px
;
left
:
50%
;
margin-left
:
-40px
;
width
:
80px
;
height
:
80px
;
border-radius
:
100%
;
overflow
:
hidden
;
padding
:
6px
;
background
:
#fff
;
z-index
:
2
;
box-shadow
:
#E7EEF2
0
0
0
1px
}
.post-author
a
{
background-size
:
cover
;
background-position
:
center
center
;
width
:
68px
;
height
:
68px
;
display
:
block
;
border-radius
:
35px
}
.share
.icon
{
cursor
:
pointer
;
transition
:
all
.2s
ease-out
0s
;
display
:
inline-block
;
font-size
:
16px
;
margin-top
:
15px
}
.share
.icon
:hover
{
transform
:
rotate
(
360deg
);
color
:
#9EABB3
}
.icon-weibo
:before
{
content
:
"\e605"
}
.icon-twitter
:before
{
content
:
"\e60b"
}
.icon-tencent
:before
{
content
:
"\e60d"
}
.icon-google
:before
{
content
:
"\e603"
}
.icon-gotop
:before
{
content
:
"\E60A"
;
font-weight
:
700
}
.icon-gotop
{
cursor
:
pointer
;
position
:
fixed
;
bottom
:
30px
;
right
:
30px
;
-webkit-animation
:
upbounce
4s
2s
infinite
;
animation
:
upbounce
4s
2s
infinite
;
z-index
:
10
}
.icon-gotop
:hover
{
color
:
#B8B8B8
;
-webkit-animation
:
none
;
animation
:
none
}
.pagination
{
font-size
:
1.3rem
;
color
:
#9eabb3
;
text-align
:
center
}
.pagination
a
{
color
:
#9EABB3
;
transition
:
all
.2s
ease
;
padding
:
0
15px
;
border
:
1px
solid
#bfc8cd
;
display
:
inline-block
;
border-radius
:
4px
}
.pagination
a
:hover
{
border-color
:
#98a0a4
;
color
:
#889093
}
ul
.comments
{
padding
:
0
;
margin-top
:
100px
;
position
:
relative
}
.comments
li
{
padding
:
10px
;
white-space
:
normal
;
word-wrap
:
break-word
;
position
:
relative
;
border-bottom
:
#EBF2F6
1px
solid
}
.comments
li
:hover
{
background-color
:
#F7F7F7
}
.comments
.comment-content
{
margin
:
8px
0
0
}
.comments
li
.comment-body-ref
{
position
:
absolute
;
z-index
:
10
;
background-color
:
#EBF2F6
;
border
:
1px
solid
#d5dbde
;
width
:
86%
;
left
:
69px
}
.comments
.post-meta
{
margin-top
:
0
}
#captcha
,
#captchaReply
{
height
:
27px
;
display
:
inline-block
;
vertical-align
:
inherit
}
.read-next
{
display
:
-webkit-box
;
display
:
-webkit-flex
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-align
:
stretch
;
-webkit-align-items
:
stretch
;
-ms-flex-align
:
stretch
;
align-items
:
stretch
;
margin-top
:
10rem
}
.read-next-story
{
display
:
-webkit-box
;
display
:
-webkit-flex
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-flex
:
1
;
-webkit-flex-grow
:
1
;
-ms-flex-positive
:
1
;
flex-grow
:
1
;
min-width
:
50%
;
position
:
relative
;
text-align
:
center
;
color
:
#fff
;
background
:
center
center
no-repeat
#222
;
background-size
:
cover
;
overflow
:
hidden
}
.read-next-story
a
{
color
:
#BBB
}
.read-next-story
a
:hover
{
color
:
#FFF
}
.read-next-story
:hover:before
{
background
:
rgba
(
0
,
0
,
0
,
.8
);
transition
:
all
.2s
ease
}
.read-next-story
:hover
.post
:before
{
color
:
#222
;
background
:
#fff
;
transition
:
all
.2s
ease
}
.read-next-story
:before
{
content
:
""
;
display
:
block
;
position
:
absolute
;
top
:
0
;
right
:
0
;
bottom
:
0
;
left
:
0
;
background
:
rgba
(
0
,
0
,
0
,
.7
);
transition
:
all
.5s
ease
}
.read-next-story
.post
{
padding-top
:
6rem
;
padding-bottom
:
6rem
;
width
:
80%
;
position
:
relative
;
margin
:
0
auto
}
.read-next-story
.post
:before
{
content
:
"Read This Next"
;
padding
:
4px
10px
5px
;
text-transform
:
uppercase
;
font-size
:
1.1rem
;
color
:
rgba
(
255
,
255
,
255
,
.8
);
border
:
1px
solid
rgba
(
255
,
255
,
255
,
.5
);
border-radius
:
4px
;
transition
:
all
.5s
ease
}
.read-next-story.prev
.post
:before
{
content
:
"Read This Before"
}
.read-next-story
h2
{
margin-top
:
1rem
;
color
:
#fff
}
.read-next-story
p
{
margin
:
0
;
color
:
rgba
(
255
,
255
,
255
,
.8
)}
.read-next
+
.site-footer
{
position
:
absolute
;
bottom
:
0
;
left
:
0
;
right
:
0
;
margin
:
0
}
#tags
{
padding
:
0
}
#tags
li
{
float
:
left
}
#tags
li
a
{
border
:
1px
solid
#4A4A4A
;
display
:
inline-block
;
padding
:
10px
;
margin
:
1rem
;
border-radius
:
5px
}
#tags
li
a
:hover
{
border
:
1px
solid
#FFF
;
color
:
#FFF
;
background-color
:
#4A4A4A
}
.dynamic
.read-next-story
>
div
{
position
:
relative
;
width
:
60%
;
margin
:
50px
auto
;
text-align
:
left
}
.dynamic
a
{
margin
:
0
;
color
:
rgba
(
255
,
255
,
255
,
.8
)}
.dynamic
a
:hover
{
color
:
rgba
(
255
,
255
,
255
,
.5
)}
.site-footer
{
position
:
relative
;
margin
:
8rem
0
0
;
padding
:
1rem
15px
;
font-size
:
1rem
;
line-height
:
1.75em
;
color
:
#BBC7CC
}
.site-footer
a
{
color
:
#BBC7CC
;
font-weight
:
700
}
.site-footer
a
:hover
{
text-decoration
:
underline
}
@media
only
screen
and
(
max-width
:
900px
){
blockquote
{
margin-left
:
0
}
.main-header
{
-webkit-box-sizing
:
border-box
;
-moz-box-sizing
:
border-box
;
box-sizing
:
border-box
;
min-height
:
240px
;
height
:
60vh
;
padding
:
15%
0
}
.scroll-down
{
display
:
none
}
.page-title
,
.page-title
a
{
font-size
:
4rem
;
letter-spacing
:
-1px
}
.page-description
,
.page-description
a
{
font-size
:
1.8rem
;
line-height
:
1.5em
}
.post
{
font-size
:
.95em
}
hr
{
margin
:
2.4em
0
}
ol
,
ul
{
padding-left
:
2em
}
h1
{
font-size
:
4.5rem
;
text-indent
:
-2px
}
h2
{
font-size
:
3.6rem
}
h3
{
font-size
:
3.1rem
}
h4
{
font-size
:
2.5rem
}
h5
{
font-size
:
2.2rem
}
h6
{
font-size
:
1.8rem
}
.read-next
{
-webkit-box-orient
:
vertical
;
-webkit-box-direction
:
normal
;
-webkit-flex-direction
:
column
;
-ms-flex-direction
:
column
;
flex-direction
:
column
;
margin-top
:
4rem
}}
@media
only
screen
and
(
max-width
:
500px
){
.main-header
{
margin-bottom
:
15px
;
height
:
40vh
}
.pagination
{
width
:
auto
;
margin
:
2rem
auto
}
.post
{
width
:
auto
;
padding-bottom
:
2rem
;
line-height
:
1.65em
;
margin
:
2rem
16px
}
hr
{
margin
:
1.75em
0
}
dl
,
ol
,
p
,
ul
{
font-size
:
.95em
;
margin
:
0
0
2.5rem
}
.page-title
,
.page-title
a
{
font-size
:
3rem
}
.post-excerpt
p
{
font-size
:
.85em
}
.page-description
,
.page-description
a
{
font-size
:
1.6rem
}
h1
,
h2
,
h3
,
h4
,
h5
,
h6
{
margin
:
0
0
.3em
}
h1
{
font-size
:
2.8rem
;
letter-spacing
:
-1px
}
h2
{
font-size
:
2.4rem
;
letter-spacing
:
0
}
h3
{
font-size
:
2.1rem
}
h4
{
font-size
:
1.9rem
}
h5
,
h6
{
font-size
:
1.8rem
}
.post-content
img
{
padding
:
0
;
width
:
calc
(
100%
+
32px
);
min-width
:
0
;
max-width
:
112%
}
.post-meta
{
font-size
:
1.3rem
;
margin-top
:
1rem
}
.site-footer
{
margin-top
:
3rem
}
.read-next
{
margin-top
:
2rem
;
margin-bottom
:
-37px
}
.read-next
.post
{
width
:
100%
}
.menu-button
{
border
:
0
;
top
:
0
;
right
:
0
}
.nav-closed
.menu-button
:hover
{
color
:
#FFF
;
background-color
:
transparent
}
.nav-opened
.menu-button
{
display
:
none
}
.post-author
{
width
:
40px
;
height
:
40px
;
bottom
:
-37px
;
padding
:
3px
;
margin-left
:
-20px
}
.post-author
a
{
width
:
34px
;
height
:
34px
;
display
:
block
;
border-radius
:
17px
}
.nav
.count
{
line-height
:
1.5rem
}
#tags
li
a
{
padding
:
0
5px
}}
\ No newline at end of file
src/main/webapp/skins/yilia/css/yilia.min.css
View file @
017f9fda
@charset
"utf-8"
;
body
,
html
{
height
:
100%
;
max-height
:
100%
}
body
,
dl
,
h1
,
h2
,
h3
,
h4
,
h5
,
h6
,
ol
,
p
,
ul
{
text-rendering
:
geometricPrecision
}
dl
dd
,
dl
dt
{
margin-bottom
:
1em
}
body
,
li
li
{
margin
:
0
}
blockquote
cite
,
dl
dt
{
font-weight
:
700
}
.fn-left
,
dl
dt
{
float
:
left
}
.form
button
,
a
,
blockquote
{
transition
:
all
.3s
ease
}
#emotions
span
,
.form
button
,
.share
span
{
cursor
:
pointer
}
.classify
li
,
.comments
,
.dynamic
li
,
.side
nav
ul
{
list-style
:
none
}
html
{
font-size
:
16px
;
-webkit-tap-highlight-color
:
transparent
}
body
{
font-family
:
Merriweather
,
"Microsoft Yahei"
,
Helvetica
;
letter-spacing
:
.01rem
;
font-size
:
100%
;
line-height
:
1.75em
;
color
:
rgba
(
0
,
0
,
0
,
.6
);
-webkit-font-feature-settings
:
'kern'
1
;
-moz-font-feature-settings
:
'kern'
1
;
-o-font-feature-settings
:
'kern'
1
;
background-color
:
#eaeaea
}
::-moz-selection
{
background
:
#D6EDFF
}
::selection
{
background
:
#D6EDFF
}
a
{
text-decoration
:
none
;
color
:
#258fb8
;
outline
:
0
}
h1
,
h2
,
h3
,
h4
,
h5
,
h6
{
-webkit-font-feature-settings
:
'dlig'
1
,
'liga'
1
,
'lnum'
1
,
'kern'
1
;
-moz-font-feature-settings
:
'dlig'
1
,
'liga'
1
,
'lnum'
1
,
'kern'
1
;
-o-font-feature-settings
:
'dlig'
1
,
'liga'
1
,
'lnum'
1
,
'kern'
1
;
color
:
#666
;
line-height
:
1.15em
;
font-family
:
"Open Sans"
,
"Microsoft Yahei"
,
Helvetica
}
h1
{
font-size
:
5rem
;
letter-spacing
:
-2px
;
text-indent
:
-3px
}
h2
{
font-size
:
3.6rem
;
letter-spacing
:
-1px
}
h3
{
font-size
:
3rem
}
h4
{
font-size
:
2.5rem
}
h5
,
h6
{
font-size
:
2rem
}
img
{
max-width
:
100%
}
dl
,
ol
,
p
,
ul
{
-webkit-font-feature-settings
:
'liga'
1
,
'onum'
1
,
'kern'
1
;
-moz-font-feature-settings
:
'liga'
1
,
'onum'
1
,
'kern'
1
;
-o-font-feature-settings
:
'liga'
1
,
'onum'
1
,
'kern'
1
}
ol
,
ul
{
padding-left
:
3rem
}
ol
ol
,
ol
ul
,
ul
ol
,
ul
ul
{
padding-left
:
2em
}
dl
dt
{
width
:
180px
;
overflow
:
hidden
;
clear
:
left
;
text-align
:
right
;
text-overflow
:
ellipsis
;
white-space
:
nowrap
}
dl
dd
{
margin-left
:
200px
}
hr
{
display
:
block
;
height
:
1px
;
border
:
0
;
border-top
:
#EFEFEF
1px
solid
;
margin
:
3.2em
0
;
padding
:
0
}
blockquote
{
box-sizing
:
border-box
;
margin
:
1.75em
0
;
padding
:
0
0
0
1.75em
;
border-left
:
5px
solid
}
blockquote
:hover
{
border-color
:
#b0a0aa
}
blockquote
p
{
margin
:
.8em
0
;
font-style
:
italic
}
blockquote
small
{
display
:
inline-block
;
margin
:
.8em
0
.8em
1.5em
;
font-size
:
.9em
;
color
:
#CCC
}
blockquote
small
:before
{
content
:
"\2014 \00A0"
}
blockquote
cite
a
{
font-weight
:
400
}
mark
{
background-color
:
#fdffb6
}
code
,
tt
{
padding
:
1px
3px
;
font-family
:
Inconsolata
,
monospace
,
"Microsoft Yahei"
,
Helvetica
;
font-size
:
.85em
;
white-space
:
pre-wrap
;
border
:
1px
solid
#E3EDF3
;
background
:
#F7FAFB
;
border-radius
:
2px
}
pre
{
font-size
:
.9em
}
pre
code
,
pre
tt
{
font-size
:
inherit
;
white-space
:
pre-wrap
;
background
:
0
0
;
border
:
none
;
padding
:
0
}
.fn-clear
:after
,
.fn-clear
:before
{
display
:
table
;
content
:
""
}
.fn-clear
:after
{
clear
:
both
}
.fn-right
{
float
:
right
}
.fn-none
{
display
:
none
}
@font-face
{
font-family
:
icomoon
;
src
:
url(fonts/icomoon.eot?3js4w7)
;
src
:
url(fonts/icomoon.eot?3js4w7#iefix)
format
(
'embedded-opentype'
),
url(fonts/icomoon.ttf?3js4w7)
format
(
'truetype'
),
url(fonts/icomoon.woff?3js4w7)
format
(
'woff'
),
url(fonts/icomoon.svg?3js4w7#icomoon)
format
(
'svg'
);
font-weight
:
400
;
font-style
:
normal
}
[
class
*=
" icon-"
],[
class
^=
icon-
]
{
font-family
:
icomoon
;
speak
:
none
;
font-style
:
normal
;
font-weight
:
400
;
font-variant
:
normal
;
text-transform
:
none
;
line-height
:
1
;
-webkit-font-smoothing
:
antialiased
;
-moz-osx-font-smoothing
:
grayscale
;
vertical-align
:
middle
}
.icon-tag
:before
{
content
:
"\e903"
}
.icon-date
:before
{
content
:
"\e902"
}
.icon-github
:before
{
content
:
"\e900"
}
.icon-rss
:before
{
content
:
"\e901"
}
.icon-register
:before
{
content
:
"\e600"
}
.icon-logout
:before
{
content
:
"\e601"
}
.icon-setting
:before
{
content
:
"\e602"
}
.icon-gplus
:before
{
content
:
"\e603"
}
.icon-weibo
:before
{
content
:
"\e605"
}
.icon-goup
:before
{
content
:
"\e60a"
}
.icon-twitter
:before
{
content
:
"\e60b"
}
.icon-t-weibo
:before
{
content
:
"\e60d"
}
.icon-login
:before
{
content
:
"\e611"
}
.form
{
width
:
100%
;
padding
:
30px
}
#captcha
,
#captchaReply
{
height
:
27px
;
display
:
inline-block
;
vertical-align
:
inherit
}
.form
button
,
.form
input
,
.form
textarea
{
border
:
1px
solid
#CCC
;
background-color
:
#FAFAFA
;
border-radius
:
3px
;
box-shadow
:
0
1px
2px
rgba
(
0
,
0
,
0
,
.075
)
inset
;
padding
:
7px
8px
;
width
:
100%
;
box-sizing
:
border-box
;
outline
:
0
;
font-family
:
Merriweather
,
"Microsoft Yahei"
,
Helvetica
}
.tags
.tag
,
footer
.footer
{
font-family
:
Menlo
,
Monaco
,
"Andale Mono"
,
"lucida console"
,
"Courier New"
,
monospace
}
.form
button
{
width
:
auto
;
vertical-align
:
bottom
}
.form
button
:hover
{
background-color
:
#b0a0aa
;
color
:
#FFF
;
box-shadow
:
0
0
0
;
border-color
:
#b0a0aa
}
.form
input
:focus
,
.form
textarea
:focus
{
background-color
:
#FFF
;
box-shadow
:
0
1px
2px
rgba
(
0
,
0
,
0
,
.075
)
inset
,
0
0
5px
rgba
(
176
,
160
,
170
,
.5
);
border
:
1px
solid
#b0a0aa
}
.em00
,
.em01
,
.em02
,
.em03
,
.em04
,
.em05
,
.em06
,
.em07
,
.em08
,
.em09
,
.em10
,
.em11
,
.em12
,
.em13
,
.em14
{
background-image
:
url(../images/emotions/emotions-ease.png)
;
float
:
left
;
height
:
24px
;
margin-right
:
5px
;
width
:
24px
}
.em01
{
background-position
:
-24px
0
}
.em02
{
background-position
:
-48px
0
}
.em03
{
background-position
:
-72px
0
}
.em04
{
background-position
:
-96px
0
}
.em05
{
background-position
:
0
-24px
}
.em06
{
background-position
:
-24px
-24px
}
.em07
{
background-position
:
-48px
-24px
}
.em08
{
background-position
:
-72px
-24px
}
.em09
{
background-position
:
-96px
-24px
}
.em10
{
background-position
:
0
-48px
}
.em11
{
background-position
:
-24px
-48px
}
.em12
{
background-position
:
-48px
-48px
}
.em13
{
background-position
:
-72px
-48px
}
.em14
{
background-position
:
-96px
-48px
}
.side
{
position
:
fixed
;
background-color
:
#FFF
;
height
:
100%
;
width
:
300px
}
.side
.overlay
,
.side
footer
,
main
{
position
:
absolute
}
.side
a
{
color
:
#696969
;
font-size
:
30px
}
.side
a
:hover
{
color
:
#b0a0aa
}
.side
.overlay
{
height
:
180px
;
background-color
:
#000
;
opacity
:
.7
;
width
:
100%
;
z-index
:
-1
}
.side
.content
{
width
:
76%
;
text-align
:
center
;
margin
:
112px
auto
0
}
.side
.avatar
{
display
:
block
;
border
:
5px
solid
#fff
;
border-radius
:
50%
;
width
:
128px
;
height
:
128px
;
margin
:
0
auto
;
transition
:
all
.1s
ease-in
}
.side
.avatar
:hover
{
border-color
:
rgba
(
37
,
143
,
184
,
.6
)}
.side
hgroup
h1
{
margin
:
10px
0
;
line-height
:
30px
}
.side
.subtitle
{
color
:
#999
;
font-size
:
14px
;
line-height
:
25px
}
.side
nav
ul
{
margin
:
0
;
padding
:
0
}
.side
nav
a
{
font-size
:
14px
}
.side
footer
{
bottom
:
15px
;
left
:
50%
;
margin-left
:
-65px
}
main
{
right
:
0
;
min-height
:
100%
;
background
:
#eaeaea
;
left
:
300px
;
width
:
auto
}
article
{
margin
:
30px
;
border
:
1px
solid
#ddd
;
background
:
#fff
;
position
:
relative
;
transition
:
all
.2s
ease-in
;
visibility
:
hidden
}
.share
span
,
.tags
.avatar
{
transition
:
all
.2s
ease-out
0s
}
article
.post
,
article
.show
{
visibility
:
visible
}
article
.show
{
-webkit-animation
:
bounce
.6s
;
animation
:
bounce
.6s
}
@-webkit-keyframes
bounce
{
0
%
{
opacity
:
0
;
-webkit-transform
:
scale
(
1
)}
60
%
{
opacity
:
1
;
-webkit-transform
:
scale
(
1.02
)}
100
%
{
-webkit-transform
:
scale
(
1
)}}
@-moz-keyframes
bounce
{
0
%
{
opacity
:
0
;
-moz-transform
:
scale
(
1
)}
60
%
{
opacity
:
1
;
-moz-transform
:
scale
(
1.02
)}
100
%
{
-moz-transform
:
scale
(
1
)}}
.tags
.tag
:hover
,
article
.abstract
a
:hover
,
nav
.pagination
a
.page-num
:hover
{
opacity
:
.7
}
article
header
{
border-left
:
5px
solid
;
padding
:
15px
30px
15px
25px
}
article
header
:hover
{
border-color
:
#b0a0aa
}
article
header
h2
{
margin
:
0
;
font-size
:
26px
;
padding-right
:
110px
}
article
header
a
{
color
:
#696969
;
margin-left
:
0
;
font-weight
:
300
;
line-height
:
35px
}
article
header
a
:hover
{
color
:
#b0a0aa
}
article
header
sup
{
font-size
:
14px
;
font-weight
:
400
;
color
:
#999
}
article
header
time
{
font-size
:
14px
;
position
:
absolute
;
right
:
30px
;
color
:
#aaa
;
top
:
18px
}
article
.abstract
{
line-height
:
1.8em
;
padding-right
:
30px
;
padding-left
:
30px
;
overflow
:
hidden
;
word-wrap
:
break-word
}
article
footer
{
padding
:
20px
35px
0
0
;
margin
:
30px
30px
20px
;
border-top
:
1px
solid
#ddd
}
.tags
.avatar
{
width
:
20px
;
border-radius
:
10px
;
right
:
30px
;
position
:
absolute
;
bottom
:
25px
}
.share
span
:hover
,
.tags
.avatar
:hover
{
transform
:
rotate
(
360deg
);
color
:
#333
}
.tags
.tag
{
color
:
#fff
;
font-size
:
10px
;
height
:
18px
;
line-height
:
18px
;
display
:
inline-block
;
padding
:
0
5px
0
10px
;
position
:
relative
;
border-radius
:
0
5px
5px
0
;
margin
:
5px
9px
5px
8px
;
background-color
:
#7b5d5f
}
.tags
.tag
:after
,
.tags
.tag
:before
{
content
:
" "
;
position
:
absolute
}
.tags
.tag
:before
{
width
:
0
;
height
:
0
;
top
:
0
;
left
:
-18px
;
border
:
9px
solid
transparent
;
border-right-color
:
#7b5d5f
}
.tags
.tag
:after
{
width
:
4px
;
height
:
4px
;
background-color
:
#fff
;
border-radius
:
4px
;
box-shadow
:
0
0
0
1px
rgba
(
0
,
0
,
0
,
.3
);
top
:
7px
;
left
:
2px
}
a
.color1.tag
{
background
:
#ff945c
}
a
.color1.tag
:before
{
border-right-color
:
#ff945c
}
a
.color2.tag
{
background
:
#f5c7b7
}
a
.color2.tag
:before
{
border-right-color
:
#f5c7b7
}
a
.color3.tag
{
background
:
#ba8f6c
}
a
.color3.tag
:before
{
border-right-color
:
#ba8f6c
}
a
.color4.tag
{
background
:
#cfb7c4
}
a
.color4.tag
:before
{
border-right-color
:
#cfb7c4
}
nav
.pagination
{
text-align
:
center
;
margin-top
:
30px
}
nav
.pagination
.page-num
{
width
:
20px
;
height
:
20px
;
background
:
#4d4d4d
;
border-radius
:
50%
;
display
:
inline-block
;
color
:
#fff
;
line-height
:
20px
;
font-size
:
12px
;
margin
:
0
3px
30px
}
nav
.pagination
.page-num.current
{
background
:
#88acdb
}
nav
.pagination
.extend
{
color
:
#4d4d4d
;
margin
:
0
27px
;
opacity
:
0
}
nav
.pagination
.extend
:hover
{
color
:
#b0a0aa
}
nav
.pagination
:hover
.extend
{
opacity
:
1
}
.post
.tags
.avatar
{
bottom
:
inherit
;
margin-top
:
4px
}
.post
section
.tags
{
margin
:
0
}
.post
header
{
padding-bottom
:
0
}
.post
.share
{
padding
:
10px
0
0
;
margin-top
:
15px
;
font-size
:
14px
}
.post
aside
a
{
color
:
#DDD
}
.post
aside
a
>
strong
{
background
:
#ddd
;
color
:
#fff
;
border-radius
:
50%
;
width
:
16px
;
height
:
16px
;
display
:
inline-block
;
transition
:
background
.3s
;
vertical-align
:
middle
;
line-height
:
18px
;
text-align
:
center
}
.post
aside
a
:hover
{
color
:
#4d4d4d
}
.post
aside
a
:hover
>
strong
{
background-color
:
#4d4d4d
}
.comments
{
margin
:
60px
60px
0
50px
;
padding
:
0
;
position
:
relative
}
.comments
li
{
margin-bottom
:
30px
;
padding-bottom
:
30px
;
border-bottom
:
1px
solid
#ddd
}
.comments
li
time
{
border-left
:
1px
solid
#d5dbde
;
padding-left
:
10px
;
margin-left
:
10px
}
.comments
.avatar
{
position
:
absolute
;
height
:
60px
;
width
:
60px
;
border-radius
:
50%
;
border
:
3px
solid
#FFF
}
.comments
.content
{
margin-left
:
80px
;
min-height
:
66px
}
.comments
.post-meta
{
margin-bottom
:
9px
}
.comments
.content
img
{
vertical-align
:
sub
}
.comments
li
.comment-body-ref
{
position
:
absolute
;
background-color
:
#FFF
;
width
:
80%
;
margin-left
:
80px
;
padding
:
10px
;
border
:
1px
solid
#ddd
}
footer
.footer
{
line-height
:
1rem
;
font-size
:
12px
;
text-shadow
:
0
1px
#fff
;
opacity
:
.6
;
margin
:
0
30px
30px
}
footer
.footer
.icon-goup
{
position
:
fixed
;
bottom
:
35px
;
right
:
5px
;
-webkit-animation
:
upbounce
4s
2s
infinite
;
animation
:
upbounce
4s
2s
infinite
;
z-index
:
10
;
font-size
:
20px
;
cursor
:
pointer
;
color
:
#b0a0aa
;
transition
:
all
.3s
ease
}
footer
.footer
.icon-goup
:hover
{
color
:
#4a4a4a
}
@-webkit-keyframes
upbounce
{
0
%,
10
%,
25
%,
40
%,
50
%
{
-webkit-transform
:
translateY
(
0
);
transform
:
translateY
(
0
)}
20
%
{
-webkit-transform
:
translateY
(
-10px
);
transform
:
translateY
(
-10px
)}
30
%
{
-webkit-transform
:
translateY
(
-5px
);
transform
:
translateY
(
-5px
)}}
@keyframes
upbounce
{
0
%,
100
%,
20
%,
50
%,
80
%
{
-webkit-transform
:
translateY
(
0
);
transform
:
translateY
(
0
)}
40
%
{
-webkit-transform
:
translateY
(
-10px
);
transform
:
translateY
(
-10px
)}
60
%
{
-webkit-transform
:
translateY
(
-5px
);
transform
:
translateY
(
-5px
)}}
.classify
li
{
font-size
:
20px
;
float
:
left
;
margin
:
0
30px
20px
0
}
.classify
.tags
.tag
{
font-size
:
20px
;
padding
:
10px
}
.classify
.tags
.tag
:before
{
left
:
-38px
;
border-width
:
19px
}
.classify
.tags
.tag
:after
{
top
:
15px
;
left
:
-6px
;
width
:
8px
;
height
:
8px
}
.classify-name
{
font-size
:
18px
;
margin
:
30px
}
.dynamic
.comments
li
:last-child
{
border-bottom-width
:
0
}
@media
only
screen
and
(
max-width
:
500px
){
.side
,
.side
.avatar
{
position
:
relative
}
.side
{
height
:
auto
;
width
:
100%
}
.side
footer
,
main
{
position
:
initial
}
.side
.content
{
margin-top
:
0
;
padding-top
:
20px
}
.side
.overlay
{
height
:
100px
;
z-index
:
0
}
.side
nav
{
display
:
none
}
.side
footer
{
margin
:
10px
auto
;
padding-bottom
:
16px
}
article
{
margin
:
10px
}
.comments
{
margin
:
20px
20px
0
}
footer
.footer
{
text-align
:
center
}
footer
.footer
.fn-right
{
float
:
none
;
display
:
block
}}
\ No newline at end of file
@charset
"utf-8"
;
body
,
html
{
height
:
100%
;
max-height
:
100%
}
body
,
dl
,
h1
,
h2
,
h3
,
h4
,
h5
,
h6
,
ol
,
p
,
ul
{
text-rendering
:
geometricPrecision
}
dl
dd
,
dl
dt
{
margin-bottom
:
1em
}
body
,
li
li
{
margin
:
0
}
blockquote
cite
,
dl
dt
{
font-weight
:
700
}
.fn-left
,
dl
dt
{
float
:
left
}
.form
button
,
a
,
blockquote
{
transition
:
all
.3s
ease
}
.classify
li
,
.comments
,
.dynamic
li
,
.side
nav
ul
{
list-style
:
none
}
html
{
font-size
:
16px
;
-webkit-tap-highlight-color
:
transparent
}
body
{
font-family
:
Merriweather
,
"Microsoft Yahei"
,
Helvetica
;
letter-spacing
:
.01rem
;
font-size
:
100%
;
line-height
:
1.75em
;
color
:
rgba
(
0
,
0
,
0
,
.6
);
-webkit-font-feature-settings
:
'kern'
1
;
-moz-font-feature-settings
:
'kern'
1
;
-o-font-feature-settings
:
'kern'
1
;
background-color
:
#eaeaea
}
::-moz-selection
{
background
:
#D6EDFF
}
::selection
{
background
:
#D6EDFF
}
a
{
text-decoration
:
none
;
color
:
#258fb8
;
outline
:
0
}
h1
,
h2
,
h3
,
h4
,
h5
,
h6
{
-webkit-font-feature-settings
:
'dlig'
1
,
'liga'
1
,
'lnum'
1
,
'kern'
1
;
-moz-font-feature-settings
:
'dlig'
1
,
'liga'
1
,
'lnum'
1
,
'kern'
1
;
-o-font-feature-settings
:
'dlig'
1
,
'liga'
1
,
'lnum'
1
,
'kern'
1
;
color
:
#666
;
line-height
:
1.15em
;
font-family
:
"Open Sans"
,
"Microsoft Yahei"
,
Helvetica
}
h1
{
font-size
:
5rem
;
letter-spacing
:
-2px
;
text-indent
:
-3px
}
h2
{
font-size
:
3.6rem
;
letter-spacing
:
-1px
}
h3
{
font-size
:
3rem
}
h4
{
font-size
:
2.5rem
}
h5
,
h6
{
font-size
:
2rem
}
img
{
max-width
:
100%
}
dl
,
ol
,
p
,
ul
{
-webkit-font-feature-settings
:
'liga'
1
,
'onum'
1
,
'kern'
1
;
-moz-font-feature-settings
:
'liga'
1
,
'onum'
1
,
'kern'
1
;
-o-font-feature-settings
:
'liga'
1
,
'onum'
1
,
'kern'
1
}
ol
,
ul
{
padding-left
:
3rem
}
ol
ol
,
ol
ul
,
ul
ol
,
ul
ul
{
padding-left
:
2em
}
dl
dt
{
width
:
180px
;
overflow
:
hidden
;
clear
:
left
;
text-align
:
right
;
text-overflow
:
ellipsis
;
white-space
:
nowrap
}
dl
dd
{
margin-left
:
200px
}
hr
{
display
:
block
;
height
:
1px
;
border
:
0
;
border-top
:
#EFEFEF
1px
solid
;
margin
:
3.2em
0
;
padding
:
0
}
blockquote
{
box-sizing
:
border-box
;
margin
:
1.75em
0
;
padding
:
0
0
0
1.75em
;
border-left
:
5px
solid
}
blockquote
:hover
{
border-color
:
#b0a0aa
}
blockquote
p
{
margin
:
.8em
0
;
font-style
:
italic
}
blockquote
small
{
display
:
inline-block
;
margin
:
.8em
0
.8em
1.5em
;
font-size
:
.9em
;
color
:
#CCC
}
blockquote
small
:before
{
content
:
"\2014 \00A0"
}
blockquote
cite
a
{
font-weight
:
400
}
mark
{
background-color
:
#fdffb6
}
code
,
tt
{
padding
:
1px
3px
;
font-family
:
Inconsolata
,
monospace
,
"Microsoft Yahei"
,
Helvetica
;
font-size
:
.85em
;
white-space
:
pre-wrap
;
border
:
1px
solid
#E3EDF3
;
background
:
#F7FAFB
;
border-radius
:
2px
}
pre
{
font-size
:
.9em
}
pre
code
,
pre
tt
{
font-size
:
inherit
;
white-space
:
pre-wrap
;
background
:
0
0
;
border
:
none
;
padding
:
0
}
.fn-clear
:after
,
.fn-clear
:before
{
display
:
table
;
content
:
""
}
.fn-clear
:after
{
clear
:
both
}
.fn-right
{
float
:
right
}
.fn-none
{
display
:
none
}
@font-face
{
font-family
:
icomoon
;
src
:
url(fonts/icomoon.eot?3js4w7)
;
src
:
url(fonts/icomoon.eot?3js4w7#iefix)
format
(
'embedded-opentype'
),
url(fonts/icomoon.ttf?3js4w7)
format
(
'truetype'
),
url(fonts/icomoon.woff?3js4w7)
format
(
'woff'
),
url(fonts/icomoon.svg?3js4w7#icomoon)
format
(
'svg'
);
font-weight
:
400
;
font-style
:
normal
}
[
class
*=
" icon-"
],[
class
^=
icon-
]
{
font-family
:
icomoon
;
speak
:
none
;
font-style
:
normal
;
font-weight
:
400
;
font-variant
:
normal
;
text-transform
:
none
;
line-height
:
1
;
-webkit-font-smoothing
:
antialiased
;
-moz-osx-font-smoothing
:
grayscale
;
vertical-align
:
middle
}
.icon-tag
:before
{
content
:
"\e903"
}
.icon-date
:before
{
content
:
"\e902"
}
.icon-github
:before
{
content
:
"\e900"
}
.icon-rss
:before
{
content
:
"\e901"
}
.icon-register
:before
{
content
:
"\e600"
}
.icon-logout
:before
{
content
:
"\e601"
}
.icon-setting
:before
{
content
:
"\e602"
}
.icon-gplus
:before
{
content
:
"\e603"
}
.icon-weibo
:before
{
content
:
"\e605"
}
.icon-goup
:before
{
content
:
"\e60a"
}
.icon-twitter
:before
{
content
:
"\e60b"
}
.icon-t-weibo
:before
{
content
:
"\e60d"
}
.icon-login
:before
{
content
:
"\e611"
}
.form
{
width
:
100%
;
padding
:
30px
}
#captcha
,
#captchaReply
{
height
:
27px
;
display
:
inline-block
;
vertical-align
:
inherit
}
.form
button
,
.form
input
,
.form
textarea
{
border
:
1px
solid
#CCC
;
background-color
:
#FAFAFA
;
border-radius
:
3px
;
box-shadow
:
0
1px
2px
rgba
(
0
,
0
,
0
,
.075
)
inset
;
padding
:
7px
8px
;
width
:
100%
;
box-sizing
:
border-box
;
outline
:
0
;
font-family
:
Merriweather
,
"Microsoft Yahei"
,
Helvetica
}
.tags
.tag
,
footer
.footer
{
font-family
:
Menlo
,
Monaco
,
"Andale Mono"
,
"lucida console"
,
"Courier New"
,
monospace
}
.form
button
{
width
:
auto
;
vertical-align
:
bottom
;
cursor
:
pointer
}
.form
button
:hover
{
background-color
:
#b0a0aa
;
color
:
#FFF
;
box-shadow
:
0
0
0
;
border-color
:
#b0a0aa
}
.form
input
:focus
,
.form
textarea
:focus
{
background-color
:
#FFF
;
box-shadow
:
0
1px
2px
rgba
(
0
,
0
,
0
,
.075
)
inset
,
0
0
5px
rgba
(
176
,
160
,
170
,
.5
);
border
:
1px
solid
#b0a0aa
}
.em00
,
.em01
,
.em02
,
.em03
,
.em04
,
.em05
,
.em06
,
.em07
,
.em08
,
.em09
,
.em10
,
.em11
,
.em12
,
.em13
,
.em14
{
cursor
:
pointer
;
background-image
:
url(../images/emotions/emotions-ease.png)
;
float
:
left
;
height
:
24px
;
margin-right
:
5px
;
width
:
24px
;
transition
:
all
.2s
ease-out
;
-webkit-transition
:
all
.2s
ease-out
;
-moz-transition
:
all
.2s
ease-out
}
#emotions
span
:hover
{
transform
:
scale
(
1.2
)
rotate
(
360deg
);
-webkit-transform
:
scale
(
1.2
)
rotate
(
360deg
);
-moz-transform
:
scale
(
1.2
)
rotate
(
360deg
)}
.em01
{
background-position
:
-24px
0
}
.em02
{
background-position
:
-48px
0
}
.em03
{
background-position
:
-72px
0
}
.em04
{
background-position
:
-96px
0
}
.em05
{
background-position
:
0
-24px
}
.em06
{
background-position
:
-24px
-24px
}
.em07
{
background-position
:
-48px
-24px
}
.em08
{
background-position
:
-72px
-24px
}
.em09
{
background-position
:
-96px
-24px
}
.em10
{
background-position
:
0
-48px
}
.em11
{
background-position
:
-24px
-48px
}
.em12
{
background-position
:
-48px
-48px
}
.em13
{
background-position
:
-72px
-48px
}
.em14
{
background-position
:
-96px
-48px
}
.side
{
position
:
fixed
;
background-color
:
#FFF
;
height
:
100%
;
width
:
300px
}
.side
.overlay
,
.side
footer
,
main
{
position
:
absolute
}
.side
a
{
color
:
#696969
;
font-size
:
30px
}
.side
a
:hover
{
color
:
#b0a0aa
}
.side
.overlay
{
height
:
180px
;
background-color
:
#000
;
opacity
:
.7
;
width
:
100%
;
z-index
:
-1
}
.side
.content
{
width
:
76%
;
text-align
:
center
;
margin
:
112px
auto
0
}
.side
.avatar
{
display
:
block
;
border
:
5px
solid
#fff
;
border-radius
:
50%
;
width
:
128px
;
height
:
128px
;
margin
:
0
auto
;
transition
:
all
.1s
ease-in
}
.side
.avatar
:hover
{
border-color
:
rgba
(
37
,
143
,
184
,
.6
)}
.side
hgroup
h1
{
margin
:
10px
0
;
line-height
:
30px
}
.side
.subtitle
{
color
:
#999
;
font-size
:
14px
;
line-height
:
25px
}
.side
nav
ul
{
margin
:
0
;
padding
:
0
}
.side
nav
a
{
font-size
:
14px
}
.side
footer
{
bottom
:
15px
;
left
:
50%
;
margin-left
:
-65px
}
main
{
right
:
0
;
min-height
:
100%
;
background
:
#eaeaea
;
left
:
300px
;
width
:
auto
}
article
{
margin
:
30px
;
border
:
1px
solid
#ddd
;
background
:
#fff
;
position
:
relative
;
transition
:
all
.2s
ease-in
;
visibility
:
hidden
}
.share
span
,
.tags
.avatar
{
transition
:
all
.2s
ease-out
0s
}
article
.post
,
article
.show
{
visibility
:
visible
}
article
.show
{
-webkit-animation
:
bounce
.6s
;
animation
:
bounce
.6s
}
@-webkit-keyframes
bounce
{
0
%
{
opacity
:
0
;
-webkit-transform
:
scale
(
1
)}
60
%
{
opacity
:
1
;
-webkit-transform
:
scale
(
1.02
)}
100
%
{
-webkit-transform
:
scale
(
1
)}}
@-moz-keyframes
bounce
{
0
%
{
opacity
:
0
;
-moz-transform
:
scale
(
1
)}
60
%
{
opacity
:
1
;
-moz-transform
:
scale
(
1.02
)}
100
%
{
-moz-transform
:
scale
(
1
)}}
.tags
.tag
:hover
,
article
.abstract
a
:hover
,
nav
.pagination
a
.page-num
:hover
{
opacity
:
.7
}
article
header
{
border-left
:
5px
solid
;
padding
:
15px
30px
15px
25px
}
article
header
:hover
{
border-color
:
#b0a0aa
}
article
header
h2
{
margin
:
0
;
font-size
:
26px
;
padding-right
:
110px
}
article
header
a
{
color
:
#696969
;
margin-left
:
0
;
font-weight
:
300
;
line-height
:
35px
}
article
header
a
:hover
{
color
:
#b0a0aa
}
article
header
sup
{
font-size
:
14px
;
font-weight
:
400
;
color
:
#999
}
article
header
time
{
font-size
:
14px
;
position
:
absolute
;
right
:
30px
;
color
:
#aaa
;
top
:
18px
}
article
.abstract
{
line-height
:
1.8em
;
padding-right
:
30px
;
padding-left
:
30px
;
overflow
:
hidden
;
word-wrap
:
break-word
}
article
footer
{
padding
:
20px
35px
0
0
;
margin
:
30px
30px
20px
;
border-top
:
1px
solid
#ddd
}
.tags
.avatar
{
width
:
20px
;
border-radius
:
10px
;
right
:
30px
;
position
:
absolute
;
bottom
:
25px
}
.share
span
{
cursor
:
pointer
}
.share
span
:hover
,
.tags
.avatar
:hover
{
transform
:
rotate
(
360deg
);
color
:
#333
}
.tags
.tag
{
color
:
#fff
;
font-size
:
10px
;
height
:
18px
;
line-height
:
18px
;
display
:
inline-block
;
padding
:
0
5px
0
10px
;
position
:
relative
;
border-radius
:
0
5px
5px
0
;
margin
:
5px
9px
5px
8px
;
background-color
:
#7b5d5f
}
.tags
.tag
:after
,
.tags
.tag
:before
{
content
:
" "
;
position
:
absolute
}
.tags
.tag
:before
{
width
:
0
;
height
:
0
;
top
:
0
;
left
:
-18px
;
border
:
9px
solid
transparent
;
border-right-color
:
#7b5d5f
}
.tags
.tag
:after
{
width
:
4px
;
height
:
4px
;
background-color
:
#fff
;
border-radius
:
4px
;
box-shadow
:
0
0
0
1px
rgba
(
0
,
0
,
0
,
.3
);
top
:
7px
;
left
:
2px
}
a
.color1.tag
{
background
:
#ff945c
}
a
.color1.tag
:before
{
border-right-color
:
#ff945c
}
a
.color2.tag
{
background
:
#f5c7b7
}
a
.color2.tag
:before
{
border-right-color
:
#f5c7b7
}
a
.color3.tag
{
background
:
#ba8f6c
}
a
.color3.tag
:before
{
border-right-color
:
#ba8f6c
}
a
.color4.tag
{
background
:
#cfb7c4
}
a
.color4.tag
:before
{
border-right-color
:
#cfb7c4
}
nav
.pagination
{
text-align
:
center
;
margin-top
:
30px
}
nav
.pagination
.page-num
{
width
:
20px
;
height
:
20px
;
background
:
#4d4d4d
;
border-radius
:
50%
;
display
:
inline-block
;
color
:
#fff
;
line-height
:
20px
;
font-size
:
12px
;
margin
:
0
3px
30px
}
nav
.pagination
.page-num.current
{
background
:
#88acdb
}
nav
.pagination
.extend
{
color
:
#4d4d4d
;
margin
:
0
27px
;
opacity
:
0
}
nav
.pagination
.extend
:hover
{
color
:
#b0a0aa
}
nav
.pagination
:hover
.extend
{
opacity
:
1
}
.post
.tags
.avatar
{
bottom
:
inherit
;
margin-top
:
4px
}
.post
section
.tags
{
margin
:
0
}
.post
header
{
padding-bottom
:
0
}
.post
.share
{
padding
:
10px
0
0
;
margin-top
:
15px
;
font-size
:
14px
}
.post
aside
a
{
color
:
#DDD
}
.post
aside
a
>
strong
{
background
:
#ddd
;
color
:
#fff
;
border-radius
:
50%
;
width
:
16px
;
height
:
16px
;
display
:
inline-block
;
transition
:
background
.3s
;
vertical-align
:
middle
;
line-height
:
18px
;
text-align
:
center
}
.post
aside
a
:hover
{
color
:
#4d4d4d
}
.post
aside
a
:hover
>
strong
{
background-color
:
#4d4d4d
}
.comments
{
margin
:
60px
60px
0
50px
;
padding
:
0
;
position
:
relative
}
.comments
li
{
margin-bottom
:
30px
;
padding-bottom
:
30px
;
border-bottom
:
1px
solid
#ddd
}
.comments
li
time
{
border-left
:
1px
solid
#d5dbde
;
padding-left
:
10px
;
margin-left
:
10px
}
.comments
.avatar
{
position
:
absolute
;
height
:
60px
;
width
:
60px
;
border-radius
:
50%
;
border
:
3px
solid
#FFF
}
.comments
.content
{
margin-left
:
80px
;
min-height
:
66px
}
.comments
.post-meta
{
margin-bottom
:
9px
}
.comments
.content
img
{
vertical-align
:
sub
}
.comments
li
.comment-body-ref
{
position
:
absolute
;
background-color
:
#FFF
;
width
:
80%
;
margin-left
:
80px
;
padding
:
10px
;
border
:
1px
solid
#ddd
}
footer
.footer
{
line-height
:
1rem
;
font-size
:
12px
;
text-shadow
:
0
1px
#fff
;
opacity
:
.6
;
margin
:
0
30px
30px
}
footer
.footer
.icon-goup
{
position
:
fixed
;
bottom
:
35px
;
right
:
5px
;
-webkit-animation
:
upbounce
4s
2s
infinite
;
animation
:
upbounce
4s
2s
infinite
;
z-index
:
10
;
font-size
:
20px
;
cursor
:
pointer
;
color
:
#b0a0aa
;
transition
:
all
.3s
ease
}
footer
.footer
.icon-goup
:hover
{
color
:
#4a4a4a
}
@-webkit-keyframes
upbounce
{
0
%,
10
%,
25
%,
40
%,
50
%
{
-webkit-transform
:
translateY
(
0
);
transform
:
translateY
(
0
)}
20
%
{
-webkit-transform
:
translateY
(
-10px
);
transform
:
translateY
(
-10px
)}
30
%
{
-webkit-transform
:
translateY
(
-5px
);
transform
:
translateY
(
-5px
)}}
@keyframes
upbounce
{
0
%,
100
%,
20
%,
50
%,
80
%
{
-webkit-transform
:
translateY
(
0
);
transform
:
translateY
(
0
)}
40
%
{
-webkit-transform
:
translateY
(
-10px
);
transform
:
translateY
(
-10px
)}
60
%
{
-webkit-transform
:
translateY
(
-5px
);
transform
:
translateY
(
-5px
)}}
.classify
li
{
font-size
:
20px
;
float
:
left
;
margin
:
0
30px
20px
0
}
.classify
.tags
.tag
{
font-size
:
20px
;
padding
:
10px
}
.classify
.tags
.tag
:before
{
left
:
-38px
;
border-width
:
19px
}
.classify
.tags
.tag
:after
{
top
:
15px
;
left
:
-6px
;
width
:
8px
;
height
:
8px
}
.classify-name
{
font-size
:
18px
;
margin
:
30px
}
.dynamic
.comments
li
:last-child
{
border-bottom-width
:
0
}
@media
only
screen
and
(
max-width
:
500px
){
.side
,
.side
.avatar
{
position
:
relative
}
.side
{
height
:
auto
;
width
:
100%
}
.side
footer
,
main
{
position
:
initial
}
.side
.content
{
margin-top
:
0
;
padding-top
:
20px
}
.side
.overlay
{
height
:
100px
;
z-index
:
0
}
.side
nav
{
display
:
none
}
.side
footer
{
margin
:
10px
auto
;
padding-bottom
:
16px
}
article
{
margin
:
10px
}
.comments
{
margin
:
20px
20px
0
}
footer
.footer
{
text-align
:
center
}
footer
.footer
.fn-right
{
float
:
none
;
display
:
block
}}
\ No newline at end of file
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment
