Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
SRCT
photos
Commits
f579579b
Commit
f579579b
authored
Jul 26, 2014
by
Tobias Reich
Browse files
Fixed broken upload status style in Firefox
parent
b45112f4
Changes
3
Hide whitespace changes
Inline
Side-by-side
assets/css/upload.css
View file @
f579579b
...
...
@@ -83,8 +83,8 @@
.upload_message
.rows
.row
a
.name
{
float
:
left
;
width
:
70%
;
padding
:
5px
10px
;
width
:
calc
(
70%
-
20px
);
color
:
#fff
;
font-size
:
14px
;
white-space
:
nowrap
;
...
...
@@ -92,10 +92,12 @@
}
.upload_message
.rows
.row
a
.status
{
float
:
righ
t
;
float
:
lef
t
;
padding
:
5px
10px
;
width
:
calc
(
30%
-
20px
);
color
:
rgba
(
255
,
255
,
255
,
.5
);
font-size
:
14px
;
text-align
:
right
;
}
.upload_message
.rows
.row
a
.status
{
...
...
assets/js/upload.js
View file @
f579579b
...
...
@@ -176,7 +176,7 @@ upload = {
xhr
.
send
(
formData
);
}
}
;
if
(
files
.
length
<=
0
)
return
false
;
if
(
albumID
===
false
||
visible
.
albums
()
===
true
)
albumID
=
0
;
...
...
assets/min/main.css
View file @
f579579b
a
,
abbr
,
acronym
,
address
,
applet
,
article
,
aside
,
audio
,
b
,
big
,
blockquote
,
body
,
canvas
,
caption
,
center
,
cite
,
code
,
dd
,
del
,
details
,
dfn
,
div
,
dl
,
dt
,
em
,
embed
,
fieldset
,
figcaption
,
figure
,
footer
,
form
,
h1
,
h2
,
h3
,
h4
,
h5
,
h6
,
header
,
hgroup
,
html
,
i
,
iframe
,
img
,
ins
,
kbd
,
label
,
legend
,
li
,
mark
,
menu
,
nav
,
object
,
ol
,
output
,
p
,
pre
,
q
,
ruby
,
s
,
samp
,
section
,
small
,
span
,
strike
,
strong
,
sub
,
summary
,
sup
,
table
,
tbody
,
td
,
tfoot
,
th
,
thead
,
time
,
tr
,
tt
,
u
,
ul
,
var
,
video
{
margin
:
0
;
padding
:
0
;
border
:
0
;
font
:
inherit
;
vertical-align
:
baseline
}
article
,
aside
,
details
,
figcaption
,
figure
,
footer
,
header
,
hgroup
,
menu
,
nav
,
section
{
display
:
block
}
body
{
line-height
:
1
}
ol
,
ul
{
list-style
:
none
}
blockquote
,
q
{
quotes
:
none
}
blockquote
:after
,
blockquote
:before
,
q
:after
,
q
:before
{
content
:
''
;
content
:
none
}
table
{
border-collapse
:
collapse
;
border-spacing
:
0
}
.fadeIn
{
-webkit-animation-name
:
fadeIn
;
animation-name
:
fadeIn
;
-webkit-animation-duration
:
.3s
;
animation-duration
:
.3s
;
-webkit-animation-fill-mode
:
forwards
;
animation-fill-mode
:
forwards
;
-webkit-animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
);
animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
)}
.fadeOut
{
-webkit-animation-name
:
fadeOut
;
animation-name
:
fadeOut
;
-webkit-animation-duration
:
.3s
;
animation-duration
:
.3s
;
-webkit-animation-fill-mode
:
forwards
;
animation-fill-mode
:
forwards
;
-webkit-animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
);
animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
)}
.contentZoomIn
{
-webkit-animation-name
:
zoomIn
;
animation-name
:
zoomIn
;
-webkit-animation-duration
:
.2s
;
animation-duration
:
.2s
;
-webkit-animation-fill-mode
:
forwards
;
animation-fill-mode
:
forwards
;
-webkit-animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1
);
animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1
)}
.contentZoomOut
{
-webkit-animation-name
:
zoomOut
;
animation-name
:
zoomOut
;
-webkit-animation-duration
:
.2s
;
animation-duration
:
.2s
;
-webkit-animation-fill-mode
:
forwards
;
animation-fill-mode
:
forwards
;
-webkit-animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1
);
animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1
)}
@-webkit-keyframes
moveUp
{
0
%
{
-webkit-transform
:
translateY
(
100px
);
transform
:
translateY
(
100px
);
opacity
:
0
}
100
%
{
-webkit-transform
:
translateY
(
0
);
transform
:
translateY
(
0
);
opacity
:
1
}}
@keyframes
moveUp
{
0
%
{
-webkit-transform
:
translateY
(
100px
);
transform
:
translateY
(
100px
);
opacity
:
0
}
100
%
{
-webkit-transform
:
translateY
(
0
);
transform
:
translateY
(
0
);
opacity
:
1
}}
@-webkit-keyframes
fadeIn
{
0
%
{
opacity
:
0
}
100
%
{
opacity
:
1
}}
@keyframes
fadeIn
{
0
%
{
opacity
:
0
}
100
%
{
opacity
:
1
}}
@-webkit-keyframes
fadeOut
{
0
%
{
opacity
:
1
}
100
%
{
opacity
:
0
}}
@keyframes
fadeOut
{
0
%
{
opacity
:
1
}
100
%
{
opacity
:
0
}}
@-webkit-keyframes
moveBackground
{
0
%
{
background-position-x
:
0
}
100
%
{
background-position-x
:
-100px
}}
@keyframes
moveBackground
{
0
%
{
background-position-x
:
0
}
100
%
{
background-position-x
:
-100px
}}
@-webkit-keyframes
zoomIn
{
0
%
{
opacity
:
0
;
-webkit-transform
:
scale
(
.8
);
transform
:
scale
(
.8
)}
100
%
{
opacity
:
1
;
-webkit-transform
:
scale
(
1
);
transform
:
scale
(
1
)}}
@keyframes
zoomIn
{
0
%
{
opacity
:
0
;
-webkit-transform
:
scale
(
.8
);
transform
:
scale
(
.8
)}
100
%
{
opacity
:
1
;
-webkit-transform
:
scale
(
1
);
transform
:
scale
(
1
)}}
@-webkit-keyframes
zoomOut
{
0
%
{
opacity
:
1
;
-webkit-transform
:
scale
(
1
);
transform
:
scale
(
1
)}
100
%
{
opacity
:
0
;
-webkit-transform
:
scale
(
.8
);
transform
:
scale
(
.8
)}}
@keyframes
zoomOut
{
0
%
{
opacity
:
1
;
-webkit-transform
:
scale
(
1
);
transform
:
scale
(
1
)}
100
%
{
opacity
:
0
;
-webkit-transform
:
scale
(
.8
);
transform
:
scale
(
.8
)}}
@-webkit-keyframes
popIn
{
0
%
{
opacity
:
0
;
-webkit-transform
:
scale
(
0
);
transform
:
scale
(
0
)}
100
%
{
opacity
:
1
;
-webkit-transform
:
scale
(
1
);
transform
:
scale
(
1
)}}
@keyframes
popIn
{
0
%
{
opacity
:
0
;
-webkit-transform
:
scale
(
0
);
transform
:
scale
(
0
)}
100
%
{
opacity
:
1
;
-webkit-transform
:
scale
(
1
);
transform
:
scale
(
1
)}}
@-webkit-keyframes
pulse
{
0
%
{
opacity
:
1
}
50
%
{
opacity
:
.3
}
100
%
{
opacity
:
1
}}
@keyframes
pulse
{
0
%
{
opacity
:
1
}
50
%
{
opacity
:
.3
}
100
%
{
opacity
:
1
}}
#content
::before
{
content
:
""
;
position
:
absolute
;
left
:
0
;
width
:
100%
;
height
:
20px
;
background
:
-webkit-linear-gradient
(
top
,
#262626
,
#222
);
background
:
linear-gradient
(
to
bottom
,
#262626
,
#222
);
border-top
:
1px
solid
#333
}
#content
.view
::before
{
display
:
none
}
#content
{
position
:
absolute
;
padding
:
50px
0
33px
;
width
:
100%
;
min-height
:
-webkit-calc
(
100%
-
90px
);
min-height
:
calc
(
100%
-
90px
);
-webkit-overflow-scrolling
:
touch
}
.photo
{
float
:
left
;
display
:
inline-block
;
width
:
206px
;
height
:
206px
;
margin
:
30px
0
0
30px
;
cursor
:
pointer
}
.photo
img
{
position
:
absolute
;
width
:
200px
;
height
:
200px
;
background-color
:
#222
;
border-radius
:
2px
;
border
:
2px
solid
#ccc
}
.photo.active
img
,
.photo
:hover
img
{
box-shadow
:
0
0
5px
#005ecc
}
.photo
:active
{
-webkit-transition-duration
:
.1s
;
transition-duration
:
.1s
;
-webkit-transform
:
scale
(
.98
);
-ms-transform
:
scale
(
.98
);
transform
:
scale
(
.98
)}
.album
{
float
:
left
;
display
:
inline-block
;
width
:
204px
;
height
:
204px
;
margin
:
30px
0
0
30px
;
cursor
:
pointer
}
.album
img
:first-child
,
.album
img
:nth-child
(
2
)
{
-webkit-transform
:
rotate
(
0deg
)
translateY
(
0px
)
translateX
(
0px
);
-ms-transform
:
rotate
(
0deg
)
translateY
(
0px
)
translateX
(
0px
);
transform
:
rotate
(
0deg
)
translateY
(
0px
)
translateX
(
0px
);
opacity
:
0
}
.album
:hover
img
:first-child
{
-webkit-transform
:
rotate
(
-2deg
)
translateY
(
10px
)
translateX
(
-12px
);
-ms-transform
:
rotate
(
-2deg
)
translateY
(
10px
)
translateX
(
-12px
);
transform
:
rotate
(
-2deg
)
translateY
(
10px
)
translateX
(
-12px
);
opacity
:
1
}
.album
:hover
img
:nth-child
(
2
)
{
-webkit-transform
:
rotate
(
5deg
)
translateY
(
-8px
)
translateX
(
12px
);
-ms-transform
:
rotate
(
5deg
)
translateY
(
-8px
)
translateX
(
12px
);
transform
:
rotate
(
5deg
)
translateY
(
-8px
)
translateX
(
12px
);
opacity
:
1
}
.album
img
{
position
:
absolute
;
width
:
200px
;
height
:
200px
;
background-color
:
#222
;
border-radius
:
2px
;
border
:
2px
solid
#ccc
}
.album.active
img
,
.album
:hover
img
{
box-shadow
:
0
0
5px
#005ecc
}
.album
.overlay
,
.photo
.overlay
{
position
:
absolute
;
width
:
200px
;
height
:
200px
;
margin
:
2px
}
.album
.overlay
{
background
:
-webkit-linear-gradient
(
top
,
rgba
(
0
,
0
,
0
,
0
)
0
,
rgba
(
0
,
0
,
0
,
0
)
20%
,
rgba
(
0
,
0
,
0
,
.9
)
100%
);
background
:
linear-gradient
(
to
bottom
,
rgba
(
0
,
0
,
0
,
0
)
0
,
rgba
(
0
,
0
,
0
,
0
)
20%
,
rgba
(
0
,
0
,
0
,
.9
)
100%
)}
.photo
.overlay
{
background
:
-webkit-linear-gradient
(
top
,
rgba
(
0
,
0
,
0
,
0
)
0
,
rgba
(
0
,
0
,
0
,
0
)
60%
,
rgba
(
0
,
0
,
0
,
.5
)
80%
,
rgba
(
0
,
0
,
0
,
.9
)
100%
);
background
:
linear-gradient
(
to
bottom
,
rgba
(
0
,
0
,
0
,
0
)
0
,
rgba
(
0
,
0
,
0
,
0
)
60%
,
rgba
(
0
,
0
,
0
,
.5
)
80%
,
rgba
(
0
,
0
,
0
,
.9
)
100%
);
opacity
:
0
}
.photo.active
.overlay
,
.photo
:hover
.overlay
{
opacity
:
1
}
.album
.overlay
h1
,
.photo
.overlay
h1
{
min-height
:
19px
;
width
:
185px
;
margin
:
153px
0
3px
15px
;
color
:
#fff
;
font-size
:
16px
;
font-weight
:
700
;
overflow
:
hidden
}
.album
.overlay
a
,
.photo
.overlay
a
{
font-size
:
11px
;
color
:
#aaa
}
.album
.overlay
a
{
margin-left
:
15px
}
.photo
.overlay
a
{
margin
:
155px
0
5px
15px
}
.photo
.overlay
a
span
{
margin
:
0
5px
0
0
}
.album
.badge
,
.photo
.badge
{
position
:
absolute
;
margin-top
:
-1px
;
margin-left
:
12px
;
padding
:
12px
7px
3px
;
box-shadow
:
0
0
3px
rgba
(
0
,
0
,
0
,
.8
);
border-radius
:
0
0
3px
3px
;
border
:
1px
solid
#fff
;
border-top
:
none
;
color
:
#fff
;
font-size
:
24px
;
text-shadow
:
0
1px
0
rgba
(
0
,
0
,
0
,
.4
);
opacity
:
.9
}
.album
.badge.icon-star
,
.photo
.badge.icon-star
{
padding
:
12px
8px
3px
}
.album
.badge.icon-share
,
.photo
.badge.icon-share
{
padding
:
12px
6px
3px
8px
}
.album
.badge.icon-time
,
.photo
.badge.icon-time
{
padding
:
12px
8px
3px
9px
}
.album
.badge
::after
,
.photo
.badge
::after
{
content
:
""
;
position
:
absolute
;
margin-top
:
-12px
;
margin-left
:
-26px
;
width
:
38px
;
height
:
5px
;
background
:
-webkit-linear-gradient
(
top
,
rgba
(
0
,
0
,
0
,
1
)
0
,
rgba
(
0
,
0
,
0
,
0
)
100%
);
background
:
linear-gradient
(
to
bottom
,
rgba
(
0
,
0
,
0
,
1
)
0
,
rgba
(
0
,
0
,
0
,
0
)
100%
);
opacity
:
.4
}
.album
.badge.icon-star
::after
,
.photo
.badge.icon-star
::after
{
margin-left
:
-29px
}
.album
.badge.icon-share
::after
,
.photo
.badge.icon-share
::after
{
margin-left
:
-31px
}
.album
.badge.icon-time
::after
,
.photo
.badge.icon-time
::after
{
margin-left
:
-29px
}
.album
.badge.icon-reorder
::after
{
margin-left
:
-30px
}
.album
.badge
:nth-child
(
2
n
),
.photo
.badge
:nth-child
(
2
n
)
{
margin-left
:
57px
}
.album
.badge.red
,
.photo
.badge.red
{
background
:
-webkit-linear-gradient
(
top
,
#d64b4b
0
,
#ab2c2c
100%
);
background
:
linear-gradient
(
to
bottom
,
#d64b4b
0
,
#ab2c2c
100%
)}
.album
.badge.blue
,
.photo
.badge.blue
{
background
:
-webkit-linear-gradient
(
top
,
#347cd6
0
,
#2945ab
100%
);
background
:
linear-gradient
(
to
bottom
,
#347cd6
0
,
#2945ab
100%
)}
.divider
{
float
:
left
;
width
:
100%
;
margin-top
:
50px
;
opacity
:
0
;
border-top
:
1px
solid
#2E2E2E
;
box-shadow
:
0
-1px
0
#151515
}
.divider
:first-child
{
margin-top
:
0
;
border-top
:
none
}
.divider
h1
{
float
:
left
;
margin
:
20px
0
0
30px
;
color
:
#fff
;
font-size
:
14px
;
font-weight
:
700
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
.8
)}
.no_content
{
position
:
absolute
;
top
:
50%
;
left
:
50%
;
height
:
160px
;
width
:
180px
;
margin-top
:
-80px
;
margin-left
:
-90px
;
padding-top
:
20px
;
color
:
rgba
(
20
,
20
,
20
,
1
);
text-shadow
:
0
1px
0
rgba
(
255
,
255
,
255
,
.05
);
text-align
:
center
}
.no_content
.icon
{
font-size
:
120px
}
.no_content
p
{
font-size
:
18px
}
.contextmenu_bg
{
position
:
fixed
;
height
:
100%
;
width
:
100%
;
z-index
:
1000
}
.contextmenu
{
position
:
fixed
;
top
:
0
;
left
:
0
;
padding
:
5px
0
6px
;
background
:
-webkit-linear-gradient
(
top
,
#444
0
,
#2f2f2f
100%
);
background
:
linear-gradient
(
to
bottom
,
#444
0
,
#2f2f2f
100%
);
border
:
1px
solid
rgba
(
0
,
0
,
0
,
.5
);
border-bottom
:
1px
solid
rgba
(
0
,
0
,
0
,
.7
);
border-radius
:
5px
;
box-shadow
:
0
3px
4px
rgba
(
0
,
0
,
0
,
.25
),
inset
0
1px
0
rgba
(
255
,
255
,
255
,
.1
);
opacity
:
0
;
z-index
:
1001
;
-webkit-transition
:
none
;
transition
:
none
}
.contextmenu
tr
{
font-size
:
14px
;
color
:
#eee
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
.2
);
cursor
:
pointer
}
.contextmenu
tr
:hover
{
background
:
-webkit-linear-gradient
(
top
,
#6a84f2
,
#4967F0
);
background
:
linear-gradient
(
to
bottom
,
#6a84f2
,
#4967F0
)}
.contextmenu
tr
.no_hover
:hover
{
cursor
:
inherit
;
background-color
:
inherit
;
background-image
:
none
}
.contextmenu
tr
.separator
{
float
:
left
;
height
:
1px
;
width
:
100%
;
background-color
:
#1f1f1f
;
border-bottom
:
1px
solid
#4c4c4c
;
margin
:
5px
0
;
cursor
:
inherit
}
.contextmenu
tr
.separator
:hover
{
background-color
:
#222
;
background-image
:
none
}
.contextmenu
tr
td
{
padding
:
7px
30px
6px
12px
;
white-space
:
nowrap
;
-webkit-transition
:
none
;
transition
:
none
}
.contextmenu
tr
:hover
td
{
color
:
#fff
;
box-shadow
:
inset
0
1px
0
rgba
(
255
,
255
,
255
,
.05
);
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
.2
)}
.contextmenu
tr
.no_hover
:hover
td
{
box-shadow
:
none
}
.contextmenu
tr
a
{
float
:
left
;
width
:
10px
;
margin-right
:
10px
;
text-align
:
center
}
.contextmenu
#link
{
float
:
right
;
width
:
140px
;
margin
:
-1px
-18px
-2px
-1px
;
padding
:
5px
7px
6px
;
background-color
:
#444
;
color
:
#fff
;
border
:
none
;
border
:
1px
solid
rgba
(
0
,
0
,
0
,
.5
);
box-shadow
:
0
1px
0
rgba
(
255
,
255
,
255
,
.08
);
outline
:
0
;
border-radius
:
5px
}
.contextmenu
tr
a
#link_icon
{
padding-top
:
4px
}
@font-face
{
font-family
:
FontAwesome
;
src
:
url(../font/fontawesome-webfont.eot)
;
src
:
url(../font/fontawesome-webfont.eot?#iefix)
format
(
'eot'
),
url(../font/fontawesome-webfont.woff)
format
(
'woff'
),
url(../font/fontawesome-webfont.ttf)
format
(
'truetype'
),
url(../font/fontawesome-webfont.svg#FontAwesome)
format
(
'svg'
);
font-weight
:
400
;
font-style
:
normal
}
[
class
*=
" icon-"
]
:before
,[
class
^=
icon-
]
:before
{
font-family
:
FontAwesome
;
font-weight
:
400
;
font-style
:
normal
;
display
:
inline-block
;
text-decoration
:
inherit
}
a
[
class
*=
" icon-"
],
a
[
class
^=
icon-
]
{
display
:
inline-block
;
text-decoration
:
inherit
}
.icon-large
:before
{
vertical-align
:
top
;
font-size
:
1.3333333333333333em
}
.btn
[
class
*=
" icon-"
],
.btn
[
class
^=
icon-
]
{
line-height
:
.9em
}
li
[
class
*=
" icon-"
],
li
[
class
^=
icon-
]
{
display
:
inline-block
;
width
:
1.25em
;
text-align
:
center
}
li
.icon-large
[
class
*=
" icon-"
],
li
.icon-large
[
class
^=
icon-
]
{
width
:
1.875em
}
li
[
class
*=
" icon-"
],
li
[
class
^=
icon-
]
{
margin-left
:
0
;
list-style-type
:
none
}
li
[
class
*=
" icon-"
]
:before
,
li
[
class
^=
icon-
]
:before
{
text-indent
:
-2em
;
text-align
:
center
}
li
[
class
*=
" icon-"
]
.icon-large
:before
,
li
[
class
^=
icon-
]
.icon-large
:before
{
text-indent
:
-1.3333333333333333em
}
.icon-glass
:before
{
content
:
"\f000"
}
.icon-music
:before
{
content
:
"\f001"
}
.icon-search
:before
{
content
:
"\f002"
}
.icon-envelope
:before
{
content
:
"\f003"
}
.icon-heart
:before
{
content
:
"\f004"
}
.icon-star
:before
{
content
:
"\f005"
}
.icon-star-empty
:before
{
content
:
"\f006"
}
.icon-user
:before
{
content
:
"\f007"
}
.icon-film
:before
{
content
:
"\f008"
}
.icon-th-large
:before
{
content
:
"\f009"
}
.icon-th
:before
{
content
:
"\f00a"
}
.icon-th-list
:before
{
content
:
"\f00b"
}
.icon-ok
:before
{
content
:
"\f00c"
}
.icon-remove
:before
{
content
:
"\f00d"
}
.icon-zoom-in
:before
{
content
:
"\f00e"
}
.icon-zoom-out
:before
{
content
:
"\f010"
}
.icon-off
:before
{
content
:
"\f011"
}
.icon-signal
:before
{
content
:
"\f012"
}
.icon-cog
:before
{
content
:
"\f013"
}
.icon-trash
:before
{
content
:
"\f014"
}
.icon-home
:before
{
content
:
"\f015"
}
.icon-file
:before
{
content
:
"\f016"
}
.icon-time
:before
{
content
:
"\f017"
}
.icon-road
:before
{
content
:
"\f018"
}
.icon-download-alt
:before
{
content
:
"\f019"
}
.icon-download
:before
{
content
:
"\f01a"
}
.icon-upload
:before
{
content
:
"\f01b"
}
.icon-inbox
:before
{
content
:
"\f01c"
}
.icon-play-circle
:before
{
content
:
"\f01d"
}
.icon-repeat
:before
{
content
:
"\f01e"
}
.icon-refresh
:before
{
content
:
"\f021"
}
.icon-list-alt
:before
{
content
:
"\f022"
}
.icon-lock
:before
{
content
:
"\f023"
}
.icon-flag
:before
{
content
:
"\f024"
}
.icon-headphones
:before
{
content
:
"\f025"
}
.icon-volume-off
:before
{
content
:
"\f026"
}
.icon-volume-down
:before
{
content
:
"\f027"
}
.icon-volume-up
:before
{
content
:
"\f028"
}
.icon-qrcode
:before
{
content
:
"\f029"
}
.icon-barcode
:before
{
content
:
"\f02a"
}
.icon-tag
:before
{
content
:
"\f02b"
}
.icon-tags
:before
{
content
:
"\f02c"
}
.icon-book
:before
{
content
:
"\f02d"
}
.icon-bookmark
:before
{
content
:
"\f02e"
}
.icon-print
:before
{
content
:
"\f02f"
}
.icon-camera
:before
{
content
:
"\f030"
}
.icon-font
:before
{
content
:
"\f031"
}
.icon-bold
:before
{
content
:
"\f032"
}
.icon-italic
:before
{
content
:
"\f033"
}
.icon-text-height
:before
{
content
:
"\f034"
}
.icon-text-width
:before
{
content
:
"\f035"
}
.icon-align-left
:before
{
content
:
"\f036"
}
.icon-align-center
:before
{
content
:
"\f037"
}
.icon-align-right
:before
{
content
:
"\f038"
}
.icon-align-justify
:before
{
content
:
"\f039"
}
.icon-list
:before
{
content
:
"\f03a"
}
.icon-indent-left
:before
{
content
:
"\f03b"
}
.icon-indent-right
:before
{
content
:
"\f03c"
}
.icon-facetime-video
:before
{
content
:
"\f03d"
}
.icon-picture
:before
{
content
:
"\f03e"
}
.icon-pencil
:before
{
content
:
"\f040"
}
.icon-map-marker
:before
{
content
:
"\f041"
}
.icon-adjust
:before
{
content
:
"\f042"
}
.icon-tint
:before
{
content
:
"\f043"
}
.icon-edit
:before
{
content
:
"\f044"
}
.icon-share
:before
{
content
:
"\f045"
}
.icon-check
:before
{
content
:
"\f046"
}
.icon-move
:before
{
content
:
"\f047"
}
.icon-step-backward
:before
{
content
:
"\f048"
}
.icon-fast-backward
:before
{
content
:
"\f049"
}
.icon-backward
:before
{
content
:
"\f04a"
}
.icon-play
:before
{
content
:
"\f04b"
}
.icon-pause
:before
{
content
:
"\f04c"
}
.icon-stop
:before
{
content
:
"\f04d"
}
.icon-forward
:before
{
content
:
"\f04e"
}
.icon-fast-forward
:before
{
content
:
"\f050"
}
.icon-step-forward
:before
{
content
:
"\f051"
}
.icon-eject
:before
{
content
:
"\f052"
}
.icon-chevron-left
:before
{
content
:
"\f053"
}
.icon-chevron-right
:before
{
content
:
"\f054"
}
.icon-plus-sign
:before
{
content
:
"\f055"
}
.icon-minus-sign
:before
{
content
:
"\f056"
}
.icon-remove-sign
:before
{
content
:
"\f057"
}
.icon-ok-sign
:before
{
content
:
"\f058"
}
.icon-question-sign
:before
{
content
:
"\f059"
}
.icon-info-sign
:before
{
content
:
"\f05a"
}
.icon-screenshot
:before
{
content
:
"\f05b"
}
.icon-remove-circle
:before
{
content
:
"\f05c"
}
.icon-ok-circle
:before
{
content
:
"\f05d"
}
.icon-ban-circle
:before
{
content
:
"\f05e"
}
.icon-arrow-left
:before
{
content
:
"\f060"
}
.icon-arrow-right
:before
{
content
:
"\f061"
}
.icon-arrow-up
:before
{
content
:
"\f062"
}
.icon-arrow-down
:before
{
content
:
"\f063"
}
.icon-share-alt
:before
{
content
:
"\f064"
}
.icon-resize-full
:before
{
content
:
"\f065"
}
.icon-resize-small
:before
{
content
:
"\f066"
}
.icon-plus
:before
{
content
:
"\f067"
}
.icon-minus
:before
{
content
:
"\f068"
}
.icon-asterisk
:before
{
content
:
"\f069"
}
.icon-exclamation-sign
:before
{
content
:
"\f06a"
}
.icon-gift
:before
{
content
:
"\f06b"
}
.icon-leaf
:before
{
content
:
"\f06c"
}
.icon-fire
:before
{
content
:
"\f06d"
}
.icon-eye-open
:before
{
content
:
"\f06e"
}
.icon-eye-close
:before
{
content
:
"\f070"
}
.icon-warning-sign
:before
{
content
:
"\f071"
}
.icon-plane
:before
{
content
:
"\f072"
}
.icon-calendar
:before
{
content
:
"\f073"
}
.icon-random
:before
{
content
:
"\f074"
}
.icon-comment
:before
{
content
:
"\f075"
}
.icon-magnet
:before
{
content
:
"\f076"
}
.icon-chevron-up
:before
{
content
:
"\f077"
}
.icon-chevron-down
:before
{
content
:
"\f078"
}
.icon-retweet
:before
{
content
:
"\f079"
}
.icon-shopping-cart
:before
{
content
:
"\f07a"
}
.icon-folder-close
:before
{
content
:
"\f07b"
}
.icon-folder-open
:before
{
content
:
"\f07c"
}
.icon-resize-vertical
:before
{
content
:
"\f07d"
}
.icon-resize-horizontal
:before
{
content
:
"\f07e"
}
.icon-bar-chart
:before
{
content
:
"\f080"
}
.icon-twitter-sign
:before
{
content
:
"\f081"
}
.icon-facebook-sign
:before
{
content
:
"\f082"
}
.icon-camera-retro
:before
{
content
:
"\f083"
}
.icon-key
:before
{
content
:
"\f084"
}
.icon-cogs
:before
{
content
:
"\f085"
}
.icon-comments
:before
{
content
:
"\f086"
}
.icon-thumbs-up
:before
{
content
:
"\f087"
}
.icon-thumbs-down
:before
{
content
:
"\f088"
}
.icon-star-half
:before
{
content
:
"\f089"
}
.icon-heart-empty
:before
{
content
:
"\f08a"
}
.icon-signout
:before
{
content
:
"\f08b"
}
.icon-linkedin-sign
:before
{
content
:
"\f08c"
}
.icon-pushpin
:before
{
content
:
"\f08d"
}
.icon-external-link
:before
{
content
:
"\f08e"
}
.icon-signin
:before
{
content
:
"\f090"
}
.icon-trophy
:before
{
content
:
"\f091"
}
.icon-github-sign
:before
{
content
:
"\f092"
}
.icon-upload-alt
:before
{
content
:
"\f093"
}
.icon-lemon
:before
{
content
:
"\f094"
}
.icon-phone
:before
{
content
:
"\f095"
}
.icon-check-empty
:before
{
content
:
"\f096"
}
.icon-bookmark-empty
:before
{
content
:
"\f097"
}
.icon-phone-sign
:before
{
content
:
"\f098"
}
.icon-twitter
:before
{
content
:
"\f099"
}
.icon-facebook
:before
{
content
:
"\f09a"
}
.icon-github
:before
{
content
:
"\f09b"
}
.icon-unlock
:before
{
content
:
"\f09c"
}
.icon-credit-card
:before
{
content
:
"\f09d"
}
.icon-rss
:before
{
content
:
"\f09e"
}
.icon-hdd
:before
{
content
:
"\f0a0"
}
.icon-bullhorn
:before
{
content
:
"\f0a1"
}
.icon-bell
:before
{
content
:
"\f0a2"
}
.icon-certificate
:before
{
content
:
"\f0a3"
}
.icon-hand-right
:before
{
content
:
"\f0a4"
}
.icon-hand-left
:before
{
content
:
"\f0a5"
}
.icon-hand-up
:before
{
content
:
"\f0a6"
}
.icon-hand-down
:before
{
content
:
"\f0a7"
}
.icon-circle-arrow-left
:before
{
content
:
"\f0a8"
}
.icon-circle-arrow-right
:before
{
content
:
"\f0a9"
}
.icon-circle-arrow-up
:before
{
content
:
"\f0aa"
}
.icon-circle-arrow-down
:before
{
content
:
"\f0ab"
}
.icon-globe
:before
{
content
:
"\f0ac"
}
.icon-wrench
:before
{
content
:
"\f0ad"
}
.icon-tasks
:before
{
content
:
"\f0ae"
}
.icon-filter
:before
{
content
:
"\f0b0"
}
.icon-briefcase
:before
{
content
:
"\f0b1"
}
.icon-fullscreen
:before
{
content
:
"\f0b2"
}
.icon-group
:before
{
content
:
"\f0c0"
}
.icon-link
:before
{
content
:
"\f0c1"
}
.icon-cloud
:before
{
content
:
"\f0c2"
}
.icon-beaker
:before
{
content
:
"\f0c3"
}
.icon-cut
:before
{
content
:
"\f0c4"
}
.icon-copy
:before
{
content
:
"\f0c5"
}
.icon-paper-clip
:before
{
content
:
"\f0c6"
}
.icon-save
:before
{
content
:
"\f0c7"
}
.icon-sign-blank
:before
{
content
:
"\f0c8"
}
.icon-reorder
:before
{
content
:
"\f0c9"
}
.icon-list-ul
:before
{
content
:
"\f0ca"
}
.icon-list-ol
:before
{
content
:
"\f0cb"
}
.icon-strikethrough
:before
{
content
:
"\f0cc"
}
.icon-underline
:before
{
content
:
"\f0cd"
}
.icon-table
:before
{
content
:
"\f0ce"
}
.icon-magic
:before
{
content
:
"\f0d0"
}
.icon-truck
:before
{
content
:
"\f0d1"
}
.icon-pinterest
:before
{
content
:
"\f0d2"
}
.icon-pinterest-sign
:before
{
content
:
"\f0d3"
}
.icon-google-plus-sign
:before
{
content
:
"\f0d4"
}
.icon-google-plus
:before
{
content
:
"\f0d5"
}
.icon-money
:before
{
content
:
"\f0d6"
}
.icon-caret-down
:before
{
content
:
"\f0d7"
}
.icon-caret-up
:before
{
content
:
"\f0d8"
}
.icon-caret-left
:before
{
content
:
"\f0d9"
}
.icon-caret-right
:before
{
content
:
"\f0da"
}
.icon-columns
:before
{
content
:
"\f0db"
}
.icon-sort
:before
{
content
:
"\f0dc"
}
.icon-sort-down
:before
{
content
:
"\f0dd"
}
.icon-sort-up
:before
{
content
:
"\f0de"
}
.icon-envelope-alt
:before
{
content
:
"\f0e0"
}
.icon-linkedin
:before
{
content
:
"\f0e1"
}
.icon-undo
:before
{
content
:
"\f0e2"
}
.icon-legal
:before
{
content
:
"\f0e3"
}
.icon-dashboard
:before
{
content
:
"\f0e4"
}
.icon-comment-alt
:before
{
content
:
"\f0e5"
}
.icon-comments-alt
:before
{
content
:
"\f0e6"
}
.icon-bolt
:before
{
content
:
"\f0e7"
}
.icon-sitemap
:before
{
content
:
"\f0e8"
}
.icon-umbrella
:before
{
content
:
"\f0e9"
}
.icon-paste
:before
{
content
:
"\f0ea"
}
.icon-user-md
:before
{
content
:
"\f200"
}
header
{
position
:
fixed
;
height
:
49px
;
width
:
100%
;
background
:
-webkit-linear-gradient
(
top
,
#3E3E3E
,
#282828
);
background
:
linear-gradient
(
to
bottom
,
#3E3E3E
,
#282828
);
border-bottom
:
1px
solid
#161616
;
z-index
:
1
;
-webkit-transition
:
-webkit-transform
.3s
ease-out
;
transition
:
transform
.3s
ease-out
}
header
.hidden
{
-webkit-transform
:
translateY
(
-60px
);
-ms-transform
:
translateY
(
-60px
);
transform
:
translateY
(
-60px
)}
header
.loading
{
-webkit-transform
:
translateY
(
2px
);
-ms-transform
:
translateY
(
2px
);
transform
:
translateY
(
2px
)}
header
.error
{
-webkit-transform
:
translateY
(
40px
);
-ms-transform
:
translateY
(
40px
);
transform
:
translateY
(
40px
)}
header
.view.error
{
background-color
:
rgba
(
10
,
10
,
10
,
.99
)}
header
.view
{
background
:
0
0
;
border-bottom
:
none
}
header
.view
#title
,
header
.view
.button
,
header
.view
.tools
{
text-shadow
:
none
!important
}
header
#title
{
position
:
absolute
;
margin
:
0
30%
;
width
:
40%
;
padding
:
15px
0
;
color
:
#fff
;
font-size
:
16px
;
font-weight
:
700
;
text-align
:
center
;
text-shadow
:
0
-1px
0
#222
}
header
#title
.editable
{
cursor
:
pointer
}
header
.button
{
color
:
#888
;
font-family
:
FontAwesome
;
font-size
:
21px
;
font-weight
:
700
;
text-decoration
:
none
!important
;
cursor
:
pointer
;
text-shadow
:
0
-1px
0
#222
}
header
.button.left
{
float
:
left
;
position
:
absolute
;
padding
:
16px
10px
8px
18px
}
header
.button.right
{
float
:
right
;
position
:
relative
;
padding
:
16px
19px
13px
11px
}
header
.button
:hover
{
color
:
#fff
}
header
#button_signin
,
header
#tools_album
,
header
#tools_albums
,
header
#tools_photo
{
display
:
none
}
header
.button_divider
{
float
:
right
;
position
:
relative
;
width
:
14px
;
height
:
50px
}
header
#search
{
float
:
right
;
width
:
80px
;
margin
:
12px
12px
0
0
;
padding
:
5px
12px
6px
;
background-color
:
#383838
;
color
:
#fff
;
border
:
none
;
border
:
1px
solid
#131313
;
box-shadow
:
0
1px
0
rgba
(
255
,
255
,
255
,
.1
);
outline
:
0
;
border-radius
:
50px
;
opacity
:
.6
;
-webkit-transition
:
opacity
.3s
ease-out
,
-webkit-transform
.3s
ease-out
,
box-shadow
.3s
,
width
.2s
ease-out
;
transition
:
opacity
.3s
ease-out
,
transform
.3s
ease-out
,
box-shadow
.3s
,
width
.2s
ease-out
}
header
#search
:focus
{
width
:
140px
}
header
#search
:focus
~
#clearSearch
{
opacity
:
1
}
header
#clearSearch
{
position
:
absolute
;
top
:
15px
;
right
:
81px
;
padding
:
0
;
font-size
:
20px
;
opacity
:
0
;
-webkit-transition
:
opacity
.2s
ease-out
;
transition
:
opacity
.2s
ease-out
}
header
#clearSearch
:hover
{
opacity
:
1
}
header
.tools
:first-of-type
{
margin-right
:
6px
}
header
.tools
{
float
:
right
;
padding
:
14px
8px
;
color
:
#888
;
font-size
:
21px
;
text-shadow
:
0
-1px
0
#222
;
cursor
:
pointer
}
header
.tools
:hover
a
{
color
:
#fff
}
header
.tools
.icon-star
{
color
:
#f0ef77
}
header
.tools
.icon-share.active
{
color
:
#ff9737
}
header
#hostedwith
{
float
:
right
;
padding
:
5px
10px
;
margin
:
13px
9px
;
color
:
#888
;
font-size
:
13px
;
text-shadow
:
0
-1px
0
#222
;
display
:
none
;
cursor
:
pointer
}
header
#hostedwith
:hover
{
background-color
:
rgba
(
0
,
0
,
0
,
.2
);
border-radius
:
100px
}
#imageview
{
position
:
fixed
;
display
:
none
;
width
:
100%
;
min-height
:
100%
;
background-color
:
rgba
(
10
,
10
,
10
,
.98
);
-webkit-transition
:
background-color
.3s
;
transition
:
background-color
.3s
}
#imageview
.view
{
background-color
:
inherit
}
#imageview
.full
{
background-color
:
rgba
(
0
,
0
,
0
,
1
)}
#imageview
#image
{
position
:
absolute
;
top
:
60px
;
right
:
30px
;
bottom
:
30px
;
left
:
30px
;
background-repeat
:
no-repeat
;
background-position
:
50%
50%
;
background-size
:
contain
;
-webkit-transition
:
top
.3s
,
right
.3s
,
bottom
.3s
,
left
.3s
,
margin-top
.3s
,
opacity
.2s
,
-webkit-transform
.3s
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
);
transition
:
top
.3s
,
right
.3s
,
bottom
.3s
,
left
.3s
,
margin-top
.3s
,
opacity
.2s
,
transform
.3s
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
);
-webkit-animation-name
:
zoomIn
;
animation-name
:
zoomIn
;
-webkit-animation-duration
:
.3s
;
animation-duration
:
.3s
;
-webkit-animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
);
animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
)}
#imageview
#image
.small
{
top
:
50%
;
right
:
auto
;
bottom
:
auto
;
left
:
50%
}
#imageview
#image
.full
{
top
:
0
;
right
:
0
;
bottom
:
0
;
left
:
0
}
#imageview
.arrow_wrapper
{
position
:
fixed
;
width
:
20%
;
height
:
-webkit-calc
(
100%
-
60px
);
height
:
calc
(
100%
-
60px
);
top
:
60px
;
z-index
:
1
}
#imageview
.arrow_wrapper.previous
{
left
:
0
}
#imageview
.arrow_wrapper.next
{
right
:
0
}
#imageview
.arrow_wrapper
a
{
position
:
fixed
;
top
:
50%
;
margin-top
:
-10px
;
color
:
#fff
;
font-size
:
50px
;
text-shadow
:
0
1px
2px
#000
;
cursor
:
pointer
;
opacity
:
0
;
z-index
:
2
;
-webkit-transition
:
opacity
.2s
;
transition
:
opacity
.2s
}
#imageview
.arrow_wrapper
:hover
a
{
opacity
:
.2
}
#imageview
.arrow_wrapper
a
#previous
{
left
:
20px
}
#imageview
.arrow_wrapper
a
#next
{
right
:
20px
}
#infobox_overlay
{
z-index
:
3
;
position
:
fixed
;
width
:
100%
;
height
:
100%
;
top
:
0
;
left
:
0
;
background-color
:
rgba
(
0
,
0
,
0
,
.8
)}
#infobox
{
z-index
:
4
;
position
:
fixed
;
right
:
0
;
width
:
350px
;
height
:
100%
;
background-color
:
rgba
(
20
,
20
,
20
,
.98
);
box-shadow
:
-1px
0
2px
rgba
(
0
,
0
,
0
,
.8
);
display
:
none
;
-webkit-transform
:
translateX
(
370px
);
-ms-transform
:
translateX
(
370px
);
transform
:
translateX
(
370px
);
-webkit-transition
:
-webkit-transform
.3s
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
);
transition
:
transform
.3s
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
)}
#infobox
.active
{
-webkit-transform
:
translateX
(
50px
);
-ms-transform
:
translateX
(
50px
);
transform
:
translateX
(
50px
)}
#infobox
.wrapper
{
float
:
left
;
height
:
100%
;
width
:
300px
;
overflow
:
scroll
;
-webkit-overflow-scrolling
:
touch
}
#infobox
.edit
{
display
:
inline
;
margin-left
:
3px
;
width
:
20px
;
height
:
5px
;
cursor
:
pointer
}
#infobox
.bumper
{
float
:
left
;
width
:
100%
;
height
:
50px
}
#infobox
.header
{
float
:
left
;
height
:
49px
;
width
:
100%
;
background-image
:
-webkit-linear-gradient
(
top
,
#2A2A2A
,
#131313
);
background-image
:
linear-gradient
(
to
bottom
,
#2A2A2A
,
#131313
);
border-bottom
:
1px
solid
#000
}
#infobox
.header
h1
{
position
:
absolute
;
margin
:
15px
30%
15px
-webkit-calc
(
30%
-
25px
);
margin
:
15px
30%
15px
calc
(
30%
-
25px
);
width
:
40%
;
color
:
#fff
;
font-size
:
16px
;
font-weight
:
700
;
text-align
:
center
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
.8
)}
#infobox
.header
a
{
float
:
right
;
padding
:
15px
65px
15px
15px
;
color
:
#fff
;
font-size
:
20px
;
font-weight
:
700
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
.8
);
opacity
:
.5
;
cursor
:
pointer
}
#infobox
.header
a
:hover
{
opacity
:
1
}
#infobox
.separator
{
float
:
left
;
width
:
100%
;
border-top
:
1px
solid
rgba
(
255
,
255
,
255
,
.04
);
box-shadow
:
0
-1px
0
#000
}
#infobox
.separator
h1
{
margin
:
20px
0
5px
20px
;
color
:
#fff
;
font-size
:
14px
;
font-weight
:
700
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
.8
)}
#infobox
table
{
float
:
left
;
margin
:
10px
0
15px
20px
}
#infobox
table
tr
td
{
padding
:
5px
0
;
color
:
#fff
;
font-size
:
14px
;
line-height
:
19px
;
-webkit-user-select
:
text
;
-moz-user-select
:
text
;
-ms-user-select
:
text
;
user-select
:
text
}
#infobox
table
tr
td
:first-child
{
width
:
110px
}
#infobox
table
tr
td
:last-child
{
padding-right
:
10px
}
#infobox
#tags
{
width
:
-webkit-calc
(
100%
-
40px
);
width
:
calc
(
100%
-
40px
);
margin
:
16px
20px
12px
;
color
:
#fff
;
display
:
inline-block
}
#infobox
#tags
.empty
{
font-size
:
14px
;
margin-bottom
:
8px
}
#infobox
#tags
.edit
{
display
:
inline-block
}
#infobox
#tags
.empty
.edit
{
display
:
inline
}
#infobox
.tag
{
float
:
left
;
padding
:
4px
7px
;
margin
:
0
6px
8px
0
;
background-color
:
rgba
(
0
,
0
,
0
,
.5
);
border
:
2px
solid
rgba
(
255
,
255
,
255
,
.3
);
border-radius
:
100px
;
font-size
:
12px
;
-webkit-transition
:
border
.3s
;
transition
:
border
.3s
}
#infobox
.tag
:hover
{
border
:
2px
solid
#aaa
}
#infobox
.tag
span
{
float
:
right
;
width
:
0
;
padding
:
0
;
margin
:
0
0
-2px
;
color
:
red
;
font-size
:
11px
;
cursor
:
pointer
;
overflow
:
hidden
;
-webkit-transform
:
scale
(
0
);
-ms-transform
:
scale
(
0
);
transform
:
scale
(
0
);
-webkit-transition
:
width
.3s
,
margin
.3s
,
-webkit-transform
.3s
;
transition
:
width
.3s
,
margin
.3s
,
transform
.3s
}
#infobox
.tag
:hover
span
{
width
:
10px
;
margin
:
0
0
-2px
6px
;
-webkit-transform
:
scale
(
1
);
-ms-transform
:
scale
(
1
);
transform
:
scale
(
1
)}
#loading
{
position
:
fixed
;
width
:
100%
;
height
:
3px
;
background-size
:
100px
3px
;
background-repeat
:
repeat-x
;
border-bottom
:
1px
solid
rgba
(
0
,
0
,
0
,
.3
);
display
:
none
;
-webkit-animation-name
:
moveBackground
;
animation-name
:
moveBackground
;
-webkit-animation-duration
:
.3s
;
animation-duration
:
.3s
;
-webkit-animation-iteration-count
:
infinite
;
animation-iteration-count
:
infinite
;
-webkit-animation-timing-function
:
linear
;
animation-timing-function
:
linear
}
#loading
.loading
{
background-image
:
-webkit-linear-gradient
(
left
,
#153674
0
,
#153674
47%
,
#2651AE
53%
,
#2651AE
100%
);
background-image
:
linear-gradient
(
to
right
,
#153674
0
,
#153674
47%
,
#2651AE
53%
,
#2651AE
100%
);
z-index
:
2
}
#loading
.error
{
background-color
:
#2f0d0e
;
background-image
:
-webkit-linear-gradient
(
left
,
#451317
0
,
#451317
47%
,
#AA3039
53%
,
#AA3039
100%
);
background-image
:
linear-gradient
(
to
right
,
#451317
0
,
#451317
47%
,
#AA3039
53%
,
#AA3039
100%
);
z-index
:
1
}
#loading
h1
{
margin
:
13px
13px
0
;
color
:
#ddd
;
font-size
:
14px
;
font-weight
:
700
;
text-shadow
:
0
1px
0
#000
;
text-transform
:
capitalize
}
#loading
h1
span
{
margin-left
:
10px
;
font-weight
:
400
;
text-transform
:
none
}
@media
only
screen
and
(
max-width
:
900px
){
#title
{
margin
:
0
20%
!important
;
width
:
40%
!important
}
#title
.view
{
margin
:
0
20%
!important
;
width
:
60%
!important
}
#title
span
{
display
:
none
!important
}}
@media
only
screen
and
(
max-width
:
640px
){
#title
{
display
:
none
!important
}
#title
.view
{
display
:
block
!important
;
width
:
70%
!important
;
margin
:
0
20%
0
10%
!important
}
#button_archive
,
#button_move
{
display
:
none
!important
}
.center
{
top
:
0
!important
;
left
:
0
!important
}
.album
,
.photo
{
margin
:
40px
0
0
50px
!important
}
#imageview
.arrow_wrapper
{
display
:
none
!important
}
.message
{
position
:
fixed
!important
;
width
:
100%
!important
;
height
:
100%
!important
;
margin
:
1px
0
0
!important
;
border-radius
:
0
!important
;
-webkit-animation
:
moveUp
.3s
!important
;
animation
:
moveUp
.3s
!important
}
.upload_message
{
margin-top
:
0
!important
;
margin-left
:
0
!important
;
width
:
100%
!important
}}
.message_overlay
{
position
:
fixed
;
width
:
100%
;
height
:
100%
;
top
:
0
;
left
:
0
;
background-color
:
rgba
(
0
,
0
,
0
,
.85
);
z-index
:
1000
}
.message
{
position
:
absolute
;
display
:
inline-block
;
width
:
500px
;
margin-left
:
-250px
;
margin-top
:
-95px
;
background-color
:
#444
;
background-image
:
-webkit-linear-gradient
(
top
,
#4b4b4b
,
#2d2d2d
);
background-image
:
linear-gradient
(
to
bottom
,
#4b4b4b
,
#2d2d2d
);
border-radius
:
5px
;
box-shadow
:
0
0
5px
#000
,
inset
0
1px
0
rgba
(
255
,
255
,
255
,
.08
);
-webkit-animation-name
:
moveUp
;
animation-name
:
moveUp
;
-webkit-animation-duration
:
.3s
;
animation-duration
:
.3s
;
-webkit-animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
);
animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
)}
.message
h1
{
float
:
left
;
width
:
100%
;
padding
:
12px
0
;
color
:
#fff
;
font-size
:
16px
;
font-weight
:
700
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
.3
);
text-align
:
center
}
.message
.close
{
position
:
absolute
;
top
:
0
;
right
:
0
;
padding
:
12px
14px
6px
7px
;
color
:
#aaa
;
font-size
:
20px
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
.3
);
cursor
:
pointer
}
.message
.close
:hover
{
color
:
#fff
}
.message
p
{
float
:
left
;
width
:
90%
;
margin-top
:
1px
;
padding
:
12px
5%
15px
;
color
:
#eee
;
font-size
:
14px
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
.3
);
line-height
:
20px
}
.message
p
b
{
font-weight
:
700
}
.message
p
a
{
color
:
#eee
;
text-decoration
:
none
;
border-bottom
:
1px
dashed
#888
}
.message
.button
{
float
:
right
;
margin
:
15px
15px
15px
0
;
padding
:
7px
10px
8px
;
color
:
#ccc
;
font-size
:
14px
;
font-weight
:
700
;
text-align
:
center
;
text-shadow
:
0
-1px
0
#222
;
border-radius
:
5px
;
border
:
1px
solid
rgba
(
0
,
0
,
0
,
.4
);
box-shadow
:
inset
0
1px
0
rgba
(
255
,
255
,
255
,
.08
),
0
1px
0
rgba
(
255
,
255
,
255
,
.05
);
cursor
:
pointer
}
.message
.button
:first-of-type
{
margin
:
15px
5%
18px
0
!important
}
.message
.button.active
{
color
:
#fff
;
box-shadow
:
inset
0
1px
0
rgba
(
255
,
255
,
255
,
.08
),
0
1px
0
rgba
(
255
,
255
,
255
,
.1
),
0
0
4px
#005ecc
}
.message
.button
:hover
{
background-image
:
-webkit-linear-gradient
(
top
,
#3c3c3c
,
#393939
);
background-image
:
linear-gradient
(
to
bottom
,
#3c3c3c
,
#393939
)}
.message
.button.pressed
,
.message
.button
:active
{
background-color
:
#393939
;
background-image
:
-webkit-linear-gradient
(
top
,
#393939
,
#3c3c3c
);
background-image
:
linear-gradient
(
to
bottom
,
#393939
,
#3c3c3c
)}
.sign_in
{
float
:
left
;
width
:
100%
;
margin-top
:
1px
;
padding
:
5px
0
;
color
:
#eee
;
font-size
:
14px
;
text-shadow
:
0
-1px
0
#222
;
line-height
:
20px
}
.sign_in
input
{
float
:
left
;
width
:
88%
;
padding
:
7px
1%
9px
;
margin
:
0
5%
;
background-color
:
transparent
;
color
:
#fff
;
text-shadow
:
0
-1px
0
#222
;
border
:
none
;
border-bottom
:
1px
solid
#222
;
box-shadow
:
0
1px
0
rgba
(
255
,
255
,
255
,
.1
);
border-radius
:
0
;
outline
:
0
}
.sign_in
input
:first-of-type
{
margin-bottom
:
10px
}
.sign_in
input
.error
:focus
{
box-shadow
:
0
1px
0
rgba
(
204
,
0
,
7
,
.6
)}
.message
#version
{
display
:
inline-block
;
margin-top
:
23px
;
margin-left
:
5%
;
color
:
#888
;
text-shadow
:
0
-1px
0
#111
}
.message
#version
span
{
display
:
none
}
.message
#version
span
a
{
color
:
#888
}
.message
input
.text
{
float
:
left
;
width
:
-webkit-calc
(
100%
-
10px
);
width
:
calc
(
100%
-
10px
);
padding
:
17px
5px
9px
;
margin-top
:
10px
;
background-color
:
transparent
;
color
:
#fff
;
text-shadow
:
0
-1px
0
#222
;
border
:
none
;
box-shadow
:
0
1px
0
rgba
(
255
,
255
,
255
,
.1
);
border-bottom
:
1px
solid
#222
;
border-radius
:
0
;
outline
:
0
}
.message
input
.less
{
margin-bottom
:
-10px
}
.message
input
.more
{
margin-bottom
:
30px
}
.message
.copylink
{
margin-bottom
:
20px
}
.message
.choice
{
float
:
left
;
margin
:
12px
5%
;
width
:
90%
;
color
:
#fff
}
.message
.choice
input
{
float
:
left
}
.message
.choice
h2
{
float
:
left
;
margin
:
1px
0
0
8px
;
color
:
#fff
;
font-size
:
14px
;
font-weight
:
700
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
.3
)}
.message
.choice
p
{
margin-top
:
2px
;
padding
:
0
5%
0
25px
;
color
:
#aaa
;
font-size
:
13px
}
.message
.choice
p
input
{
width
:
100%
;
padding
:
10px
1px
9px
;
margin-top
:
10px
}
body
,
html
{
min-height
:
100%
}
body
{
background-color
:
#222
;
font-family
:
'Helvetica Neue'
,
Helvetica
,
Arial
,
sans-serif
;
font-size
:
12px
;
-webkit-font-smoothing
:
antialiased
;
-moz-font-smoothing
:
antialiased
;
-moz-osx-font-smoothing
:
grayscale
;
font-smoothing
:
antialiased
}
body
.view
{
background-color
:
#0f0f0f
}
.center
{
position
:
absolute
;
left
:
50%
;
top
:
50%
}
*
{
-webkit-user-select
:
none
;
-moz-user-select
:
none
;
-ms-user-select
:
none
;
user-select
:
none
;
-webkit-transition
:
color
.3s
,
opacity
.3s
ease-out
,
-webkit-transform
.3s
ease-out
,
box-shadow
.3s
;
transition
:
color
.3s
,
opacity
.3s
ease-out
,
transform
.3s
ease-out
,
box-shadow
.3s
}
input
{
-webkit-user-select
:
text
!important
;
-moz-user-select
:
text
!important
;
-ms-user-select
:
text
!important
;
user-select
:
text
!important
}
#multiselect
{
position
:
absolute
;
background-color
:
rgba
(
0
,
94
,
204
,
.3
);
border
:
1px
solid
rgba
(
0
,
94
,
204
,
1
);
border-radius
:
3px
;
z-index
:
3
}
.tipsy
{
padding
:
4px
;
font-size
:
12px
;
position
:
absolute
;
z-index
:
100000
;
-webkit-animation-name
:
fadeIn
;
animation-name
:
fadeIn
;
-webkit-animation-duration
:
.3s
;
animation-duration
:
.3s
}
.tipsy-inner
{
padding
:
8px
10px
7px
;
color
:
#fff
;
max-width
:
200px
;
text-align
:
center
;
background
:
rgba
(
0
,
0
,
0
,
.8
);
border-radius
:
25px
}
.tipsy-arrow
{
position
:
absolute
;
width
:
0
;
height
:
0
;
line-height
:
0
;
border
:
5px
dashed
rgba
(
0
,
0
,
0
,
.8
)}
.tipsy-arrow-n
{
border-bottom-color
:
rgba
(
0
,
0
,
0
,
.8
)}
.tipsy-arrow-s
{
border-top-color
:
rgba
(
0
,
0
,
0
,
.8
)}
.tipsy-arrow-e
{
border-left-color
:
rgba
(
0
,
0
,
0
,
.8
)}
.tipsy-arrow-w
{
border-right-color
:
rgba
(
0
,
0
,
0
,
.8
)}
.tipsy-n
.tipsy-arrow
{
top
:
0
;
left
:
50%
;
margin-left
:
-5px
;
border-bottom-style
:
solid
;
border-top
:
none
;
border-left-color
:
transparent
;
border-right-color
:
transparent
}
.tipsy-nw
.tipsy-arrow
{
top
:
0
;
left
:
10px
;
border-bottom-style
:
solid
;
border-top
:
none
;
border-left-color
:
transparent
;
border-right-color
:
transparent
}
.tipsy-ne
.tipsy-arrow
{
top
:
0
;
right
:
10px
;
border-bottom-style
:
solid
;
border-top
:
none
;
border-left-color
:
transparent
;
border-right-color
:
transparent
}
.tipsy-s
.tipsy-arrow
{
bottom
:
0
;
left
:
50%
;
margin-left
:
-5px
;
border-top-style
:
solid
;
border-bottom
:
none
;
border-left-color
:
transparent
;
border-right-color
:
transparent
}
.tipsy-sw
.tipsy-arrow
{
bottom
:
0
;
left
:
10px
;
border-top-style
:
solid
;
border-bottom
:
none
;
border-left-color
:
transparent
;
border-right-color
:
transparent
}
.tipsy-se
.tipsy-arrow
{
bottom
:
0
;
right
:
10px
;
border-top-style
:
solid
;
border-bottom
:
none
;
border-left-color
:
transparent
;
border-right-color
:
transparent
}
.tipsy-e
.tipsy-arrow
{
right
:
0
;
top
:
50%
;
margin-top
:
-5px
;
border-left-style
:
solid
;
border-right
:
none
;
border-top-color
:
transparent
;
border-bottom-color
:
transparent
}
.tipsy-w
.tipsy-arrow
{
left
:
0
;
top
:
50%
;
margin-top
:
-5px
;
border-right-style
:
solid
;
border-left
:
none
;
border-top-color
:
transparent
;
border-bottom-color
:
transparent
}
#upload
{
display
:
none
}
.upload_overlay
{
position
:
fixed
;
width
:
100%
;
height
:
100%
;
top
:
0
;
left
:
0
;
background-color
:
rgba
(
0
,
0
,
0
,
.85
);
z-index
:
1000
}
.upload_message
{
position
:
absolute
;
display
:
inline-block
;
width
:
450px
;
margin-left
:
-225px
;
margin-top
:
-170px
;
background-image
:
-webkit-linear-gradient
(
top
,
#4b4b4b
,
#2d2d2d
);
background-image
:
linear-gradient
(
to
bottom
,
#4b4b4b
,
#2d2d2d
);
border-radius
:
5px
;
box-shadow
:
0
0
5px
#000
,
inset
0
1px
0
rgba
(
255
,
255
,
255
,
.08
),
inset
1px
0
0
rgba
(
255
,
255
,
255
,
.03
),
inset
-1px
0
0
rgba
(
255
,
255
,
255
,
.03
);
-webkit-animation-name
:
moveUp
;
animation-name
:
moveUp
;
-webkit-animation-duration
:
.3s
;
animation-duration
:
.3s
;
-webkit-animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
);
animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
)}
.upload_message
h1
{
float
:
left
;
width
:
100%
;
padding
:
12px
0
;
color
:
#fff
;
font-size
:
16px
;
font-weight
:
700
;
text-shadow
:
0
-1px
0
#222
;
text-align
:
center
}
.upload_message
.close
{
position
:
absolute
;
top
:
0
;
right
:
0
;
padding
:
11px
14px
6px
7px
;
color
:
#aaa
;
font-size
:
20px
;
text-shadow
:
0
-1px
0
#222
;
cursor
:
pointer
}
.upload_message
.close
:hover
{
color
:
#fff
}
.upload_message
.rows
{
float
:
left
;
margin
:
3px
8px
8px
;
width
:
-webkit-calc
(
100%
-
16px
);
width
:
calc
(
100%
-
16px
);
height
:
300px
;
background-color
:
rgba
(
0
,
0
,
0
,
.5
);
overflow
:
hidden
;
overflow-y
:
scroll
;
border-radius
:
3px
;
box-shadow
:
inset
0
0
3px
rgba
(
0
,
0
,
0
,
.8
)}
.upload_message
.rows
.row
{
float
:
left
;
display
:
inline-block
;
padding
:
8px
0
;
width
:
100%
;
background-color
:
rgba
(
255
,
255
,
255
,
.02
)}
.upload_message
.rows
.row
:nth-child
(
2
n
)
{
background-color
:
transparent
}
.upload_message
.rows
.row
a
.name
{
float
:
left
;
width
:
70%
;
padding
:
5px
10px
;
color
:
#fff
;
font-size
:
14px
;
white-space
:
nowrap
;
overflow
:
hidden
}
.upload_message
.rows
.row
a
.status
{
float
:
right
;
padding
:
5px
10px
;
color
:
rgba
(
255
,
255
,
255
,
.5
);
font-size
:
14px
;
-webkit-animation-name
:
pulse
;
animation-name
:
pulse
;
-webkit-animation-duration
:
2s
;
animation-duration
:
2s
;
-webkit-animation-timing-function
:
ease-in-out
;
animation-timing-function
:
ease-in-out
;
-webkit-animation-iteration-count
:
infinite
;
animation-iteration-count
:
infinite
}
.upload_message
.rows
.row
a
.status.error
,
.upload_message
.rows
.row
a
.status.success
{
-webkit-animation
:
none
;
animation
:
none
}
.upload_message
.rows
.row
a
.status.error
{
color
:
#d51818
}
.upload_message
.rows
.row
a
.status.success
{
color
:
#2ad500
}
\ No newline at end of file
a
,
abbr
,
acronym
,
address
,
applet
,
article
,
aside
,
audio
,
b
,
big
,
blockquote
,
body
,
canvas
,
caption
,
center
,
cite
,
code
,
dd
,
del
,
details
,
dfn
,
div
,
dl
,
dt
,
em
,
embed
,
fieldset
,
figcaption
,
figure
,
footer
,
form
,
h1
,
h2
,
h3
,
h4
,
h5
,
h6
,
header
,
hgroup
,
html
,
i
,
iframe
,
img
,
ins
,
kbd
,
label
,
legend
,
li
,
mark
,
menu
,
nav
,
object
,
ol
,
output
,
p
,
pre
,
q
,
ruby
,
s
,
samp
,
section
,
small
,
span
,
strike
,
strong
,
sub
,
summary
,
sup
,
table
,
tbody
,
td
,
tfoot
,
th
,
thead
,
time
,
tr
,
tt
,
u
,
ul
,
var
,
video
{
margin
:
0
;
padding
:
0
;
border
:
0
;
font
:
inherit
;
vertical-align
:
baseline
}
article
,
aside
,
details
,
figcaption
,
figure
,
footer
,
header
,
hgroup
,
menu
,
nav
,
section
{
display
:
block
}
body
{
line-height
:
1
}
ol
,
ul
{
list-style
:
none
}
blockquote
,
q
{
quotes
:
none
}
blockquote
:after
,
blockquote
:before
,
q
:after
,
q
:before
{
content
:
''
;
content
:
none
}
table
{
border-collapse
:
collapse
;
border-spacing
:
0
}
.fadeIn
{
-webkit-animation-name
:
fadeIn
;
animation-name
:
fadeIn
;
-webkit-animation-duration
:
.3s
;
animation-duration
:
.3s
;
-webkit-animation-fill-mode
:
forwards
;
animation-fill-mode
:
forwards
;
-webkit-animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
);
animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
)}
.fadeOut
{
-webkit-animation-name
:
fadeOut
;
animation-name
:
fadeOut
;
-webkit-animation-duration
:
.3s
;
animation-duration
:
.3s
;
-webkit-animation-fill-mode
:
forwards
;
animation-fill-mode
:
forwards
;
-webkit-animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
);
animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
)}
.contentZoomIn
{
-webkit-animation-name
:
zoomIn
;
animation-name
:
zoomIn
;
-webkit-animation-duration
:
.2s
;
animation-duration
:
.2s
;
-webkit-animation-fill-mode
:
forwards
;
animation-fill-mode
:
forwards
;
-webkit-animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1
);
animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1
)}
.contentZoomOut
{
-webkit-animation-name
:
zoomOut
;
animation-name
:
zoomOut
;
-webkit-animation-duration
:
.2s
;
animation-duration
:
.2s
;
-webkit-animation-fill-mode
:
forwards
;
animation-fill-mode
:
forwards
;
-webkit-animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1
);
animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1
)}
@-webkit-keyframes
moveUp
{
0
%
{
-webkit-transform
:
translateY
(
100px
);
transform
:
translateY
(
100px
);
opacity
:
0
}
100
%
{
-webkit-transform
:
translateY
(
0
);
transform
:
translateY
(
0
);
opacity
:
1
}}
@keyframes
moveUp
{
0
%
{
-webkit-transform
:
translateY
(
100px
);
transform
:
translateY
(
100px
);
opacity
:
0
}
100
%
{
-webkit-transform
:
translateY
(
0
);
transform
:
translateY
(
0
);
opacity
:
1
}}
@-webkit-keyframes
fadeIn
{
0
%
{
opacity
:
0
}
100
%
{
opacity
:
1
}}
@keyframes
fadeIn
{
0
%
{
opacity
:
0
}
100
%
{
opacity
:
1
}}
@-webkit-keyframes
fadeOut
{
0
%
{
opacity
:
1
}
100
%
{
opacity
:
0
}}
@keyframes
fadeOut
{
0
%
{
opacity
:
1
}
100
%
{
opacity
:
0
}}
@-webkit-keyframes
moveBackground
{
0
%
{
background-position-x
:
0
}
100
%
{
background-position-x
:
-100px
}}
@keyframes
moveBackground
{
0
%
{
background-position-x
:
0
}
100
%
{
background-position-x
:
-100px
}}
@-webkit-keyframes
zoomIn
{
0
%
{
opacity
:
0
;
-webkit-transform
:
scale
(
.8
);
transform
:
scale
(
.8
)}
100
%
{
opacity
:
1
;
-webkit-transform
:
scale
(
1
);
transform
:
scale
(
1
)}}
@keyframes
zoomIn
{
0
%
{
opacity
:
0
;
-webkit-transform
:
scale
(
.8
);
transform
:
scale
(
.8
)}
100
%
{
opacity
:
1
;
-webkit-transform
:
scale
(
1
);
transform
:
scale
(
1
)}}
@-webkit-keyframes
zoomOut
{
0
%
{
opacity
:
1
;
-webkit-transform
:
scale
(
1
);
transform
:
scale
(
1
)}
100
%
{
opacity
:
0
;
-webkit-transform
:
scale
(
.8
);
transform
:
scale
(
.8
)}}
@keyframes
zoomOut
{
0
%
{
opacity
:
1
;
-webkit-transform
:
scale
(
1
);
transform
:
scale
(
1
)}
100
%
{
opacity
:
0
;
-webkit-transform
:
scale
(
.8
);
transform
:
scale
(
.8
)}}
@-webkit-keyframes
popIn
{
0
%
{
opacity
:
0
;
-webkit-transform
:
scale
(
0
);
transform
:
scale
(
0
)}
100
%
{
opacity
:
1
;
-webkit-transform
:
scale
(
1
);
transform
:
scale
(
1
)}}
@keyframes
popIn
{
0
%
{
opacity
:
0
;
-webkit-transform
:
scale
(
0
);
transform
:
scale
(
0
)}
100
%
{
opacity
:
1
;
-webkit-transform
:
scale
(
1
);
transform
:
scale
(
1
)}}
@-webkit-keyframes
pulse
{
0
%
{
opacity
:
1
}
50
%
{
opacity
:
.3
}
100
%
{
opacity
:
1
}}
@keyframes
pulse
{
0
%
{
opacity
:
1
}
50
%
{
opacity
:
.3
}
100
%
{
opacity
:
1
}}
#content
::before
{
content
:
""
;
position
:
absolute
;
left
:
0
;
width
:
100%
;
height
:
20px
;
background
:
-webkit-linear-gradient
(
top
,
#262626
,
#222
);
background
:
linear-gradient
(
to
bottom
,
#262626
,
#222
);
border-top
:
1px
solid
#333
}
#content
.view
::before
{
display
:
none
}
#content
{
position
:
absolute
;
padding
:
50px
0
33px
;
width
:
100%
;
min-height
:
-webkit-calc
(
100%
-
90px
);
min-height
:
calc
(
100%
-
90px
);
-webkit-overflow-scrolling
:
touch
}
.photo
{
float
:
left
;
display
:
inline-block
;
width
:
206px
;
height
:
206px
;
margin
:
30px
0
0
30px
;
cursor
:
pointer
}
.photo
img
{
position
:
absolute
;
width
:
200px
;
height
:
200px
;
background-color
:
#222
;
border-radius
:
2px
;
border
:
2px
solid
#ccc
}
.photo.active
img
,
.photo
:hover
img
{
box-shadow
:
0
0
5px
#005ecc
}
.photo
:active
{
-webkit-transition-duration
:
.1s
;
transition-duration
:
.1s
;
-webkit-transform
:
scale
(
.98
);
-ms-transform
:
scale
(
.98
);
transform
:
scale
(
.98
)}
.album
{
float
:
left
;
display
:
inline-block
;
width
:
204px
;
height
:
204px
;
margin
:
30px
0
0
30px
;
cursor
:
pointer
}
.album
img
:first-child
,
.album
img
:nth-child
(
2
)
{
-webkit-transform
:
rotate
(
0deg
)
translateY
(
0px
)
translateX
(
0px
);
-ms-transform
:
rotate
(
0deg
)
translateY
(
0px
)
translateX
(
0px
);
transform
:
rotate
(
0deg
)
translateY
(
0px
)
translateX
(
0px
);
opacity
:
0
}
.album
:hover
img
:first-child
{
-webkit-transform
:
rotate
(
-2deg
)
translateY
(
10px
)
translateX
(
-12px
);
-ms-transform
:
rotate
(
-2deg
)
translateY
(
10px
)
translateX
(
-12px
);
transform
:
rotate
(
-2deg
)
translateY
(
10px
)
translateX
(
-12px
);
opacity
:
1
}
.album
:hover
img
:nth-child
(
2
)
{
-webkit-transform
:
rotate
(
5deg
)
translateY
(
-8px
)
translateX
(
12px
);
-ms-transform
:
rotate
(
5deg
)
translateY
(
-8px
)
translateX
(
12px
);
transform
:
rotate
(
5deg
)
translateY
(
-8px
)
translateX
(
12px
);
opacity
:
1
}
.album
img
{
position
:
absolute
;
width
:
200px
;
height
:
200px
;
background-color
:
#222
;
border-radius
:
2px
;
border
:
2px
solid
#ccc
}
.album.active
img
,
.album
:hover
img
{
box-shadow
:
0
0
5px
#005ecc
}
.album
.overlay
,
.photo
.overlay
{
position
:
absolute
;
width
:
200px
;
height
:
200px
;
margin
:
2px
}
.album
.overlay
{
background
:
-webkit-linear-gradient
(
top
,
rgba
(
0
,
0
,
0
,
0
)
0
,
rgba
(
0
,
0
,
0
,
0
)
20%
,
rgba
(
0
,
0
,
0
,
.9
)
100%
);
background
:
linear-gradient
(
to
bottom
,
rgba
(
0
,
0
,
0
,
0
)
0
,
rgba
(
0
,
0
,
0
,
0
)
20%
,
rgba
(
0
,
0
,
0
,
.9
)
100%
)}
.photo
.overlay
{
background
:
-webkit-linear-gradient
(
top
,
rgba
(
0
,
0
,
0
,
0
)
0
,
rgba
(
0
,
0
,
0
,
0
)
60%
,
rgba
(
0
,
0
,
0
,
.5
)
80%
,
rgba
(
0
,
0
,
0
,
.9
)
100%
);
background
:
linear-gradient
(
to
bottom
,
rgba
(
0
,
0
,
0
,
0
)
0
,
rgba
(
0
,
0
,
0
,
0
)
60%
,
rgba
(
0
,
0
,
0
,
.5
)
80%
,
rgba
(
0
,
0
,
0
,
.9
)
100%
);
opacity
:
0
}
.photo.active
.overlay
,
.photo
:hover
.overlay
{
opacity
:
1
}
.album
.overlay
h1
,
.photo
.overlay
h1
{
min-height
:
19px
;
width
:
185px
;
margin
:
153px
0
3px
15px
;
color
:
#fff
;
font-size
:
16px
;
font-weight
:
700
;
overflow
:
hidden
}
.album
.overlay
a
,
.photo
.overlay
a
{
font-size
:
11px
;
color
:
#aaa
}
.album
.overlay
a
{
margin-left
:
15px
}
.photo
.overlay
a
{
margin
:
155px
0
5px
15px
}
.photo
.overlay
a
span
{
margin
:
0
5px
0
0
}
.album
.badge
,
.photo
.badge
{
position
:
absolute
;
margin-top
:
-1px
;
margin-left
:
12px
;
padding
:
12px
7px
3px
;
box-shadow
:
0
0
3px
rgba
(
0
,
0
,
0
,
.8
);
border-radius
:
0
0
3px
3px
;
border
:
1px
solid
#fff
;
border-top
:
none
;
color
:
#fff
;
font-size
:
24px
;
text-shadow
:
0
1px
0
rgba
(
0
,
0
,
0
,
.4
);
opacity
:
.9
}
.album
.badge.icon-star
,
.photo
.badge.icon-star
{
padding
:
12px
8px
3px
}
.album
.badge.icon-share
,
.photo
.badge.icon-share
{
padding
:
12px
6px
3px
8px
}
.album
.badge.icon-time
,
.photo
.badge.icon-time
{
padding
:
12px
8px
3px
9px
}
.album
.badge
::after
,
.photo
.badge
::after
{
content
:
""
;
position
:
absolute
;
margin-top
:
-12px
;
margin-left
:
-26px
;
width
:
38px
;
height
:
5px
;
background
:
-webkit-linear-gradient
(
top
,
rgba
(
0
,
0
,
0
,
1
)
0
,
rgba
(
0
,
0
,
0
,
0
)
100%
);
background
:
linear-gradient
(
to
bottom
,
rgba
(
0
,
0
,
0
,
1
)
0
,
rgba
(
0
,
0
,
0
,
0
)
100%
);
opacity
:
.4
}
.album
.badge.icon-star
::after
,
.photo
.badge.icon-star
::after
{
margin-left
:
-29px
}
.album
.badge.icon-share
::after
,
.photo
.badge.icon-share
::after
{
margin-left
:
-31px
}
.album
.badge.icon-time
::after
,
.photo
.badge.icon-time
::after
{
margin-left
:
-29px
}
.album
.badge.icon-reorder
::after
{
margin-left
:
-30px
}
.album
.badge
:nth-child
(
2
n
),
.photo
.badge
:nth-child
(
2
n
)
{
margin-left
:
57px
}
.album
.badge.red
,
.photo
.badge.red
{
background
:
-webkit-linear-gradient
(
top
,
#d64b4b
0
,
#ab2c2c
100%
);
background
:
linear-gradient
(
to
bottom
,
#d64b4b
0
,
#ab2c2c
100%
)}
.album
.badge.blue
,
.photo
.badge.blue
{
background
:
-webkit-linear-gradient
(
top
,
#347cd6
0
,
#2945ab
100%
);
background
:
linear-gradient
(
to
bottom
,
#347cd6
0
,
#2945ab
100%
)}
.divider
{
float
:
left
;
width
:
100%
;
margin-top
:
50px
;
opacity
:
0
;
border-top
:
1px
solid
#2E2E2E
;
box-shadow
:
0
-1px
0
#151515
}
.divider
:first-child
{
margin-top
:
0
;
border-top
:
none
}
.divider
h1
{
float
:
left
;
margin
:
20px
0
0
30px
;
color
:
#fff
;
font-size
:
14px
;
font-weight
:
700
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
.8
)}
.no_content
{
position
:
absolute
;
top
:
50%
;
left
:
50%
;
height
:
160px
;
width
:
180px
;
margin-top
:
-80px
;
margin-left
:
-90px
;
padding-top
:
20px
;
color
:
rgba
(
20
,
20
,
20
,
1
);
text-shadow
:
0
1px
0
rgba
(
255
,
255
,
255
,
.05
);
text-align
:
center
}
.no_content
.icon
{
font-size
:
120px
}
.no_content
p
{
font-size
:
18px
}
.contextmenu_bg
{
position
:
fixed
;
height
:
100%
;
width
:
100%
;
z-index
:
1000
}
.contextmenu
{
position
:
fixed
;
top
:
0
;
left
:
0
;
padding
:
5px
0
6px
;
background
:
-webkit-linear-gradient
(
top
,
#444
0
,
#2f2f2f
100%
);
background
:
linear-gradient
(
to
bottom
,
#444
0
,
#2f2f2f
100%
);
border
:
1px
solid
rgba
(
0
,
0
,
0
,
.5
);
border-bottom
:
1px
solid
rgba
(
0
,
0
,
0
,
.7
);
border-radius
:
5px
;
box-shadow
:
0
3px
4px
rgba
(
0
,
0
,
0
,
.25
),
inset
0
1px
0
rgba
(
255
,
255
,
255
,
.1
);
opacity
:
0
;
z-index
:
1001
;
-webkit-transition
:
none
;
transition
:
none
}
.contextmenu
tr
{
font-size
:
14px
;
color
:
#eee
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
.2
);
cursor
:
pointer
}
.contextmenu
tr
:hover
{
background
:
-webkit-linear-gradient
(
top
,
#6a84f2
,
#4967F0
);
background
:
linear-gradient
(
to
bottom
,
#6a84f2
,
#4967F0
)}
.contextmenu
tr
.no_hover
:hover
{
cursor
:
inherit
;
background-color
:
inherit
;
background-image
:
none
}
.contextmenu
tr
.separator
{
float
:
left
;
height
:
1px
;
width
:
100%
;
background-color
:
#1f1f1f
;
border-bottom
:
1px
solid
#4c4c4c
;
margin
:
5px
0
;
cursor
:
inherit
}
.contextmenu
tr
.separator
:hover
{
background-color
:
#222
;
background-image
:
none
}
.contextmenu
tr
td
{
padding
:
7px
30px
6px
12px
;
white-space
:
nowrap
;
-webkit-transition
:
none
;
transition
:
none
}
.contextmenu
tr
:hover
td
{
color
:
#fff
;
box-shadow
:
inset
0
1px
0
rgba
(
255
,
255
,
255
,
.05
);
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
.2
)}
.contextmenu
tr
.no_hover
:hover
td
{
box-shadow
:
none
}
.contextmenu
tr
a
{
float
:
left
;
width
:
10px
;
margin-right
:
10px
;
text-align
:
center
}
.contextmenu
#link
{
float
:
right
;
width
:
140px
;
margin
:
-1px
-18px
-2px
-1px
;
padding
:
5px
7px
6px
;
background-color
:
#444
;
color
:
#fff
;
border
:
none
;
border
:
1px
solid
rgba
(
0
,
0
,
0
,
.5
);
box-shadow
:
0
1px
0
rgba
(
255
,
255
,
255
,
.08
);
outline
:
0
;
border-radius
:
5px
}
.contextmenu
tr
a
#link_icon
{
padding-top
:
4px
}
@font-face
{
font-family
:
FontAwesome
;
src
:
url(../font/fontawesome-webfont.eot)
;
src
:
url(../font/fontawesome-webfont.eot?#iefix)
format
(
'eot'
),
url(../font/fontawesome-webfont.woff)
format
(
'woff'
),
url(../font/fontawesome-webfont.ttf)
format
(
'truetype'
),
url(../font/fontawesome-webfont.svg#FontAwesome)
format
(
'svg'
);
font-weight
:
400
;
font-style
:
normal
}
[
class
*=
" icon-"
]
:before
,[
class
^=
icon-
]
:before
{
font-family
:
FontAwesome
;
font-weight
:
400
;
font-style
:
normal
;
display
:
inline-block
;
text-decoration
:
inherit
}
a
[
class
*=
" icon-"
],
a
[
class
^=
icon-
]
{
display
:
inline-block
;
text-decoration
:
inherit
}
.icon-large
:before
{
vertical-align
:
top
;
font-size
:
1.3333333333333333em
}
.btn
[
class
*=
" icon-"
],
.btn
[
class
^=
icon-
]
{
line-height
:
.9em
}
li
[
class
*=
" icon-"
],
li
[
class
^=
icon-
]
{
display
:
inline-block
;
width
:
1.25em
;
text-align
:
center
}
li
.icon-large
[
class
*=
" icon-"
],
li
.icon-large
[
class
^=
icon-
]
{
width
:
1.875em
}
li
[
class
*=
" icon-"
],
li
[
class
^=
icon-
]
{
margin-left
:
0
;
list-style-type
:
none
}
li
[
class
*=
" icon-"
]
:before
,
li
[
class
^=
icon-
]
:before
{
text-indent
:
-2em
;
text-align
:
center
}
li
[
class
*=
" icon-"
]
.icon-large
:before
,
li
[
class
^=
icon-
]
.icon-large
:before
{
text-indent
:
-1.3333333333333333em
}
.icon-glass
:before
{
content
:
"\f000"
}
.icon-music
:before
{
content
:
"\f001"
}
.icon-search
:before
{
content
:
"\f002"
}
.icon-envelope
:before
{
content
:
"\f003"
}
.icon-heart
:before
{
content
:
"\f004"
}
.icon-star
:before
{
content
:
"\f005"
}
.icon-star-empty
:before
{
content
:
"\f006"
}
.icon-user
:before
{
content
:
"\f007"
}
.icon-film
:before
{
content
:
"\f008"
}
.icon-th-large
:before
{
content
:
"\f009"
}
.icon-th
:before
{
content
:
"\f00a"
}
.icon-th-list
:before
{
content
:
"\f00b"
}
.icon-ok
:before
{
content
:
"\f00c"
}
.icon-remove
:before
{
content
:
"\f00d"
}
.icon-zoom-in
:before
{
content
:
"\f00e"
}
.icon-zoom-out
:before
{
content
:
"\f010"
}
.icon-off
:before
{
content
:
"\f011"
}
.icon-signal
:before
{
content
:
"\f012"
}
.icon-cog
:before
{
content
:
"\f013"
}
.icon-trash
:before
{
content
:
"\f014"
}
.icon-home
:before
{
content
:
"\f015"
}
.icon-file
:before
{
content
:
"\f016"
}
.icon-time
:before
{
content
:
"\f017"
}
.icon-road
:before
{
content
:
"\f018"
}
.icon-download-alt
:before
{
content
:
"\f019"
}
.icon-download
:before
{
content
:
"\f01a"
}
.icon-upload
:before
{
content
:
"\f01b"
}
.icon-inbox
:before
{
content
:
"\f01c"
}
.icon-play-circle
:before
{
content
:
"\f01d"
}
.icon-repeat
:before
{
content
:
"\f01e"
}
.icon-refresh
:before
{
content
:
"\f021"
}
.icon-list-alt
:before
{
content
:
"\f022"
}
.icon-lock
:before
{
content
:
"\f023"
}
.icon-flag
:before
{
content
:
"\f024"
}
.icon-headphones
:before
{
content
:
"\f025"
}
.icon-volume-off
:before
{
content
:
"\f026"
}
.icon-volume-down
:before
{
content
:
"\f027"
}
.icon-volume-up
:before
{
content
:
"\f028"
}
.icon-qrcode
:before
{
content
:
"\f029"
}
.icon-barcode
:before
{
content
:
"\f02a"
}
.icon-tag
:before
{
content
:
"\f02b"
}
.icon-tags
:before
{
content
:
"\f02c"
}
.icon-book
:before
{
content
:
"\f02d"
}
.icon-bookmark
:before
{
content
:
"\f02e"
}
.icon-print
:before
{
content
:
"\f02f"
}
.icon-camera
:before
{
content
:
"\f030"
}
.icon-font
:before
{
content
:
"\f031"
}
.icon-bold
:before
{
content
:
"\f032"
}
.icon-italic
:before
{
content
:
"\f033"
}
.icon-text-height
:before
{
content
:
"\f034"
}
.icon-text-width
:before
{
content
:
"\f035"
}
.icon-align-left
:before
{
content
:
"\f036"
}
.icon-align-center
:before
{
content
:
"\f037"
}
.icon-align-right
:before
{
content
:
"\f038"
}
.icon-align-justify
:before
{
content
:
"\f039"
}
.icon-list
:before
{
content
:
"\f03a"
}
.icon-indent-left
:before
{
content
:
"\f03b"
}
.icon-indent-right
:before
{
content
:
"\f03c"
}
.icon-facetime-video
:before
{
content
:
"\f03d"
}
.icon-picture
:before
{
content
:
"\f03e"
}
.icon-pencil
:before
{
content
:
"\f040"
}
.icon-map-marker
:before
{
content
:
"\f041"
}
.icon-adjust
:before
{
content
:
"\f042"
}
.icon-tint
:before
{
content
:
"\f043"
}
.icon-edit
:before
{
content
:
"\f044"
}
.icon-share
:before
{
content
:
"\f045"
}
.icon-check
:before
{
content
:
"\f046"
}
.icon-move
:before
{
content
:
"\f047"
}
.icon-step-backward
:before
{
content
:
"\f048"
}
.icon-fast-backward
:before
{
content
:
"\f049"
}
.icon-backward
:before
{
content
:
"\f04a"
}
.icon-play
:before
{
content
:
"\f04b"
}
.icon-pause
:before
{
content
:
"\f04c"
}
.icon-stop
:before
{
content
:
"\f04d"
}
.icon-forward
:before
{
content
:
"\f04e"
}
.icon-fast-forward
:before
{
content
:
"\f050"
}
.icon-step-forward
:before
{
content
:
"\f051"
}
.icon-eject
:before
{
content
:
"\f052"
}
.icon-chevron-left
:before
{
content
:
"\f053"
}
.icon-chevron-right
:before
{
content
:
"\f054"
}
.icon-plus-sign
:before
{
content
:
"\f055"
}
.icon-minus-sign
:before
{
content
:
"\f056"
}
.icon-remove-sign
:before
{
content
:
"\f057"
}
.icon-ok-sign
:before
{
content
:
"\f058"
}
.icon-question-sign
:before
{
content
:
"\f059"
}
.icon-info-sign
:before
{
content
:
"\f05a"
}
.icon-screenshot
:before
{
content
:
"\f05b"
}
.icon-remove-circle
:before
{
content
:
"\f05c"
}
.icon-ok-circle
:before
{
content
:
"\f05d"
}
.icon-ban-circle
:before
{
content
:
"\f05e"
}
.icon-arrow-left
:before
{
content
:
"\f060"
}
.icon-arrow-right
:before
{
content
:
"\f061"
}
.icon-arrow-up
:before
{
content
:
"\f062"
}
.icon-arrow-down
:before
{
content
:
"\f063"
}
.icon-share-alt
:before
{
content
:
"\f064"
}
.icon-resize-full
:before
{
content
:
"\f065"
}
.icon-resize-small
:before
{
content
:
"\f066"
}
.icon-plus
:before
{
content
:
"\f067"
}
.icon-minus
:before
{
content
:
"\f068"
}
.icon-asterisk
:before
{
content
:
"\f069"
}
.icon-exclamation-sign
:before
{
content
:
"\f06a"
}
.icon-gift
:before
{
content
:
"\f06b"
}
.icon-leaf
:before
{
content
:
"\f06c"
}
.icon-fire
:before
{
content
:
"\f06d"
}
.icon-eye-open
:before
{
content
:
"\f06e"
}
.icon-eye-close
:before
{
content
:
"\f070"
}
.icon-warning-sign
:before
{
content
:
"\f071"
}
.icon-plane
:before
{
content
:
"\f072"
}
.icon-calendar
:before
{
content
:
"\f073"
}
.icon-random
:before
{
content
:
"\f074"
}
.icon-comment
:before
{
content
:
"\f075"
}
.icon-magnet
:before
{
content
:
"\f076"
}
.icon-chevron-up
:before
{
content
:
"\f077"
}
.icon-chevron-down
:before
{
content
:
"\f078"
}
.icon-retweet
:before
{
content
:
"\f079"
}
.icon-shopping-cart
:before
{
content
:
"\f07a"
}
.icon-folder-close
:before
{
content
:
"\f07b"
}
.icon-folder-open
:before
{
content
:
"\f07c"
}
.icon-resize-vertical
:before
{
content
:
"\f07d"
}
.icon-resize-horizontal
:before
{
content
:
"\f07e"
}
.icon-bar-chart
:before
{
content
:
"\f080"
}
.icon-twitter-sign
:before
{
content
:
"\f081"
}
.icon-facebook-sign
:before
{
content
:
"\f082"
}
.icon-camera-retro
:before
{
content
:
"\f083"
}
.icon-key
:before
{
content
:
"\f084"
}
.icon-cogs
:before
{
content
:
"\f085"
}
.icon-comments
:before
{
content
:
"\f086"
}
.icon-thumbs-up
:before
{
content
:
"\f087"
}
.icon-thumbs-down
:before
{
content
:
"\f088"
}
.icon-star-half
:before
{
content
:
"\f089"
}
.icon-heart-empty
:before
{
content
:
"\f08a"
}
.icon-signout
:before
{
content
:
"\f08b"
}
.icon-linkedin-sign
:before
{
content
:
"\f08c"
}
.icon-pushpin
:before
{
content
:
"\f08d"
}
.icon-external-link
:before
{
content
:
"\f08e"
}
.icon-signin
:before
{
content
:
"\f090"
}
.icon-trophy
:before
{
content
:
"\f091"
}
.icon-github-sign
:before
{
content
:
"\f092"
}
.icon-upload-alt
:before
{
content
:
"\f093"
}
.icon-lemon
:before
{
content
:
"\f094"
}
.icon-phone
:before
{
content
:
"\f095"
}
.icon-check-empty
:before
{
content
:
"\f096"
}
.icon-bookmark-empty
:before
{
content
:
"\f097"
}
.icon-phone-sign
:before
{
content
:
"\f098"
}
.icon-twitter
:before
{
content
:
"\f099"
}
.icon-facebook
:before
{
content
:
"\f09a"
}
.icon-github
:before
{
content
:
"\f09b"
}
.icon-unlock
:before
{
content
:
"\f09c"
}
.icon-credit-card
:before
{
content
:
"\f09d"
}
.icon-rss
:before
{
content
:
"\f09e"
}
.icon-hdd
:before
{
content
:
"\f0a0"
}
.icon-bullhorn
:before
{
content
:
"\f0a1"
}
.icon-bell
:before
{
content
:
"\f0a2"
}
.icon-certificate
:before
{
content
:
"\f0a3"
}
.icon-hand-right
:before
{
content
:
"\f0a4"
}
.icon-hand-left
:before
{
content
:
"\f0a5"
}
.icon-hand-up
:before
{
content
:
"\f0a6"
}
.icon-hand-down
:before
{
content
:
"\f0a7"
}
.icon-circle-arrow-left
:before
{
content
:
"\f0a8"
}
.icon-circle-arrow-right
:before
{
content
:
"\f0a9"
}
.icon-circle-arrow-up
:before
{
content
:
"\f0aa"
}
.icon-circle-arrow-down
:before
{
content
:
"\f0ab"
}
.icon-globe
:before
{
content
:
"\f0ac"
}
.icon-wrench
:before
{
content
:
"\f0ad"
}
.icon-tasks
:before
{
content
:
"\f0ae"
}
.icon-filter
:before
{
content
:
"\f0b0"
}
.icon-briefcase
:before
{
content
:
"\f0b1"
}
.icon-fullscreen
:before
{
content
:
"\f0b2"
}
.icon-group
:before
{
content
:
"\f0c0"
}
.icon-link
:before
{
content
:
"\f0c1"
}
.icon-cloud
:before
{
content
:
"\f0c2"
}
.icon-beaker
:before
{
content
:
"\f0c3"
}
.icon-cut
:before
{
content
:
"\f0c4"
}
.icon-copy
:before
{
content
:
"\f0c5"
}
.icon-paper-clip
:before
{
content
:
"\f0c6"
}
.icon-save
:before
{
content
:
"\f0c7"
}
.icon-sign-blank
:before
{
content
:
"\f0c8"
}
.icon-reorder
:before
{
content
:
"\f0c9"
}
.icon-list-ul
:before
{
content
:
"\f0ca"
}
.icon-list-ol
:before
{
content
:
"\f0cb"
}
.icon-strikethrough
:before
{
content
:
"\f0cc"
}
.icon-underline
:before
{
content
:
"\f0cd"
}
.icon-table
:before
{
content
:
"\f0ce"
}
.icon-magic
:before
{
content
:
"\f0d0"
}
.icon-truck
:before
{
content
:
"\f0d1"
}
.icon-pinterest
:before
{
content
:
"\f0d2"
}
.icon-pinterest-sign
:before
{
content
:
"\f0d3"
}
.icon-google-plus-sign
:before
{
content
:
"\f0d4"
}
.icon-google-plus
:before
{
content
:
"\f0d5"
}
.icon-money
:before
{
content
:
"\f0d6"
}
.icon-caret-down
:before
{
content
:
"\f0d7"
}
.icon-caret-up
:before
{
content
:
"\f0d8"
}
.icon-caret-left
:before
{
content
:
"\f0d9"
}
.icon-caret-right
:before
{
content
:
"\f0da"
}
.icon-columns
:before
{
content
:
"\f0db"
}
.icon-sort
:before
{
content
:
"\f0dc"
}
.icon-sort-down
:before
{
content
:
"\f0dd"
}
.icon-sort-up
:before
{
content
:
"\f0de"
}
.icon-envelope-alt
:before
{
content
:
"\f0e0"
}
.icon-linkedin
:before
{
content
:
"\f0e1"
}
.icon-undo
:before
{
content
:
"\f0e2"
}
.icon-legal
:before
{
content
:
"\f0e3"
}
.icon-dashboard
:before
{
content
:
"\f0e4"
}
.icon-comment-alt
:before
{
content
:
"\f0e5"
}
.icon-comments-alt
:before
{
content
:
"\f0e6"
}
.icon-bolt
:before
{
content
:
"\f0e7"
}
.icon-sitemap
:before
{
content
:
"\f0e8"
}
.icon-umbrella
:before
{
content
:
"\f0e9"
}
.icon-paste
:before
{
content
:
"\f0ea"
}
.icon-user-md
:before
{
content
:
"\f200"
}
header
{
position
:
fixed
;
height
:
49px
;
width
:
100%
;
background
:
-webkit-linear-gradient
(
top
,
#3E3E3E
,
#282828
);
background
:
linear-gradient
(
to
bottom
,
#3E3E3E
,
#282828
);
border-bottom
:
1px
solid
#161616
;
z-index
:
1
;
-webkit-transition
:
-webkit-transform
.3s
ease-out
;
transition
:
transform
.3s
ease-out
}
header
.hidden
{
-webkit-transform
:
translateY
(
-60px
);
-ms-transform
:
translateY
(
-60px
);
transform
:
translateY
(
-60px
)}
header
.loading
{
-webkit-transform
:
translateY
(
2px
);
-ms-transform
:
translateY
(
2px
);
transform
:
translateY
(
2px
)}
header
.error
{
-webkit-transform
:
translateY
(
40px
);
-ms-transform
:
translateY
(
40px
);
transform
:
translateY
(
40px
)}
header
.view.error
{
background-color
:
rgba
(
10
,
10
,
10
,
.99
)}
header
.view
{
background
:
0
0
;
border-bottom
:
none
}
header
.view
#title
,
header
.view
.button
,
header
.view
.tools
{
text-shadow
:
none
!important
}
header
#title
{
position
:
absolute
;
margin
:
0
30%
;
width
:
40%
;
padding
:
15px
0
;
color
:
#fff
;
font-size
:
16px
;
font-weight
:
700
;
text-align
:
center
;
text-shadow
:
0
-1px
0
#222
}
header
#title
.editable
{
cursor
:
pointer
}
header
.button
{
color
:
#888
;
font-family
:
FontAwesome
;
font-size
:
21px
;
font-weight
:
700
;
text-decoration
:
none
!important
;
cursor
:
pointer
;
text-shadow
:
0
-1px
0
#222
}
header
.button.left
{
float
:
left
;
position
:
absolute
;
padding
:
16px
10px
8px
18px
}
header
.button.right
{
float
:
right
;
position
:
relative
;
padding
:
16px
19px
13px
11px
}
header
.button
:hover
{
color
:
#fff
}
header
#button_signin
,
header
#tools_album
,
header
#tools_albums
,
header
#tools_photo
{
display
:
none
}
header
.button_divider
{
float
:
right
;
position
:
relative
;
width
:
14px
;
height
:
50px
}
header
#search
{
float
:
right
;
width
:
80px
;
margin
:
12px
12px
0
0
;
padding
:
5px
12px
6px
;
background-color
:
#383838
;
color
:
#fff
;
border
:
none
;
border
:
1px
solid
#131313
;
box-shadow
:
0
1px
0
rgba
(
255
,
255
,
255
,
.1
);
outline
:
0
;
border-radius
:
50px
;
opacity
:
.6
;
-webkit-transition
:
opacity
.3s
ease-out
,
-webkit-transform
.3s
ease-out
,
box-shadow
.3s
,
width
.2s
ease-out
;
transition
:
opacity
.3s
ease-out
,
transform
.3s
ease-out
,
box-shadow
.3s
,
width
.2s
ease-out
}
header
#search
:focus
{
width
:
140px
}
header
#search
:focus
~
#clearSearch
{
opacity
:
1
}
header
#clearSearch
{
position
:
absolute
;
top
:
15px
;
right
:
81px
;
padding
:
0
;
font-size
:
20px
;
opacity
:
0
;
-webkit-transition
:
opacity
.2s
ease-out
;
transition
:
opacity
.2s
ease-out
}
header
#clearSearch
:hover
{
opacity
:
1
}
header
.tools
:first-of-type
{
margin-right
:
6px
}
header
.tools
{
float
:
right
;
padding
:
14px
8px
;
color
:
#888
;
font-size
:
21px
;
text-shadow
:
0
-1px
0
#222
;
cursor
:
pointer
}
header
.tools
:hover
a
{
color
:
#fff
}
header
.tools
.icon-star
{
color
:
#f0ef77
}
header
.tools
.icon-share.active
{
color
:
#ff9737
}
header
#hostedwith
{
float
:
right
;
padding
:
5px
10px
;
margin
:
13px
9px
;
color
:
#888
;
font-size
:
13px
;
text-shadow
:
0
-1px
0
#222
;
display
:
none
;
cursor
:
pointer
}
header
#hostedwith
:hover
{
background-color
:
rgba
(
0
,
0
,
0
,
.2
);
border-radius
:
100px
}
#imageview
{
position
:
fixed
;
display
:
none
;
width
:
100%
;
min-height
:
100%
;
background-color
:
rgba
(
10
,
10
,
10
,
.98
);
-webkit-transition
:
background-color
.3s
;
transition
:
background-color
.3s
}
#imageview
.view
{
background-color
:
inherit
}
#imageview
.full
{
background-color
:
rgba
(
0
,
0
,
0
,
1
)}
#imageview
#image
{
position
:
absolute
;
top
:
60px
;
right
:
30px
;
bottom
:
30px
;
left
:
30px
;
background-repeat
:
no-repeat
;
background-position
:
50%
50%
;
background-size
:
contain
;
-webkit-transition
:
top
.3s
,
right
.3s
,
bottom
.3s
,
left
.3s
,
margin-top
.3s
,
opacity
.2s
,
-webkit-transform
.3s
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
);
transition
:
top
.3s
,
right
.3s
,
bottom
.3s
,
left
.3s
,
margin-top
.3s
,
opacity
.2s
,
transform
.3s
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
);
-webkit-animation-name
:
zoomIn
;
animation-name
:
zoomIn
;
-webkit-animation-duration
:
.3s
;
animation-duration
:
.3s
;
-webkit-animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
);
animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
)}
#imageview
#image
.small
{
top
:
50%
;
right
:
auto
;
bottom
:
auto
;
left
:
50%
}
#imageview
#image
.full
{
top
:
0
;
right
:
0
;
bottom
:
0
;
left
:
0
}
#imageview
.arrow_wrapper
{
position
:
fixed
;
width
:
20%
;
height
:
-webkit-calc
(
100%
-
60px
);
height
:
calc
(
100%
-
60px
);
top
:
60px
;
z-index
:
1
}
#imageview
.arrow_wrapper.previous
{
left
:
0
}
#imageview
.arrow_wrapper.next
{
right
:
0
}
#imageview
.arrow_wrapper
a
{
position
:
fixed
;
top
:
50%
;
margin-top
:
-10px
;
color
:
#fff
;
font-size
:
50px
;
text-shadow
:
0
1px
2px
#000
;
cursor
:
pointer
;
opacity
:
0
;
z-index
:
2
;
-webkit-transition
:
opacity
.2s
;
transition
:
opacity
.2s
}
#imageview
.arrow_wrapper
:hover
a
{
opacity
:
.2
}
#imageview
.arrow_wrapper
a
#previous
{
left
:
20px
}
#imageview
.arrow_wrapper
a
#next
{
right
:
20px
}
#infobox_overlay
{
z-index
:
3
;
position
:
fixed
;
width
:
100%
;
height
:
100%
;
top
:
0
;
left
:
0
;
background-color
:
rgba
(
0
,
0
,
0
,
.8
)}
#infobox
{
z-index
:
4
;
position
:
fixed
;
right
:
0
;
width
:
350px
;
height
:
100%
;
background-color
:
rgba
(
20
,
20
,
20
,
.98
);
box-shadow
:
-1px
0
2px
rgba
(
0
,
0
,
0
,
.8
);
display
:
none
;
-webkit-transform
:
translateX
(
370px
);
-ms-transform
:
translateX
(
370px
);
transform
:
translateX
(
370px
);
-webkit-transition
:
-webkit-transform
.3s
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
);
transition
:
transform
.3s
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
)}
#infobox
.active
{
-webkit-transform
:
translateX
(
50px
);
-ms-transform
:
translateX
(
50px
);
transform
:
translateX
(
50px
)}
#infobox
.wrapper
{
float
:
left
;
height
:
100%
;
width
:
300px
;
overflow
:
scroll
;
-webkit-overflow-scrolling
:
touch
}
#infobox
.edit
{
display
:
inline
;
margin-left
:
3px
;
width
:
20px
;
height
:
5px
;
cursor
:
pointer
}
#infobox
.bumper
{
float
:
left
;
width
:
100%
;
height
:
50px
}
#infobox
.header
{
float
:
left
;
height
:
49px
;
width
:
100%
;
background-image
:
-webkit-linear-gradient
(
top
,
#2A2A2A
,
#131313
);
background-image
:
linear-gradient
(
to
bottom
,
#2A2A2A
,
#131313
);
border-bottom
:
1px
solid
#000
}
#infobox
.header
h1
{
position
:
absolute
;
margin
:
15px
30%
15px
-webkit-calc
(
30%
-
25px
);
margin
:
15px
30%
15px
calc
(
30%
-
25px
);
width
:
40%
;
color
:
#fff
;
font-size
:
16px
;
font-weight
:
700
;
text-align
:
center
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
.8
)}
#infobox
.header
a
{
float
:
right
;
padding
:
15px
65px
15px
15px
;
color
:
#fff
;
font-size
:
20px
;
font-weight
:
700
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
.8
);
opacity
:
.5
;
cursor
:
pointer
}
#infobox
.header
a
:hover
{
opacity
:
1
}
#infobox
.separator
{
float
:
left
;
width
:
100%
;
border-top
:
1px
solid
rgba
(
255
,
255
,
255
,
.04
);
box-shadow
:
0
-1px
0
#000
}
#infobox
.separator
h1
{
margin
:
20px
0
5px
20px
;
color
:
#fff
;
font-size
:
14px
;
font-weight
:
700
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
.8
)}
#infobox
table
{
float
:
left
;
margin
:
10px
0
15px
20px
}
#infobox
table
tr
td
{
padding
:
5px
0
;
color
:
#fff
;
font-size
:
14px
;
line-height
:
19px
;
-webkit-user-select
:
text
;
-moz-user-select
:
text
;
-ms-user-select
:
text
;
user-select
:
text
}
#infobox
table
tr
td
:first-child
{
width
:
110px
}
#infobox
table
tr
td
:last-child
{
padding-right
:
10px
}
#infobox
#tags
{
width
:
-webkit-calc
(
100%
-
40px
);
width
:
calc
(
100%
-
40px
);
margin
:
16px
20px
12px
;
color
:
#fff
;
display
:
inline-block
}
#infobox
#tags
.empty
{
font-size
:
14px
;
margin-bottom
:
8px
}
#infobox
#tags
.edit
{
display
:
inline-block
}
#infobox
#tags
.empty
.edit
{
display
:
inline
}
#infobox
.tag
{
float
:
left
;
padding
:
4px
7px
;
margin
:
0
6px
8px
0
;
background-color
:
rgba
(
0
,
0
,
0
,
.5
);
border
:
2px
solid
rgba
(
255
,
255
,
255
,
.3
);
border-radius
:
100px
;
font-size
:
12px
;
-webkit-transition
:
border
.3s
;
transition
:
border
.3s
}
#infobox
.tag
:hover
{
border
:
2px
solid
#aaa
}
#infobox
.tag
span
{
float
:
right
;
width
:
0
;
padding
:
0
;
margin
:
0
0
-2px
;
color
:
red
;
font-size
:
11px
;
cursor
:
pointer
;
overflow
:
hidden
;
-webkit-transform
:
scale
(
0
);
-ms-transform
:
scale
(
0
);
transform
:
scale
(
0
);
-webkit-transition
:
width
.3s
,
margin
.3s
,
-webkit-transform
.3s
;
transition
:
width
.3s
,
margin
.3s
,
transform
.3s
}
#infobox
.tag
:hover
span
{
width
:
10px
;
margin
:
0
0
-2px
6px
;
-webkit-transform
:
scale
(
1
);
-ms-transform
:
scale
(
1
);
transform
:
scale
(
1
)}
#loading
{
position
:
fixed
;
width
:
100%
;
height
:
3px
;
background-size
:
100px
3px
;
background-repeat
:
repeat-x
;
border-bottom
:
1px
solid
rgba
(
0
,
0
,
0
,
.3
);
display
:
none
;
-webkit-animation-name
:
moveBackground
;
animation-name
:
moveBackground
;
-webkit-animation-duration
:
.3s
;
animation-duration
:
.3s
;
-webkit-animation-iteration-count
:
infinite
;
animation-iteration-count
:
infinite
;
-webkit-animation-timing-function
:
linear
;
animation-timing-function
:
linear
}
#loading
.loading
{
background-image
:
-webkit-linear-gradient
(
left
,
#153674
0
,
#153674
47%
,
#2651AE
53%
,
#2651AE
100%
);
background-image
:
linear-gradient
(
to
right
,
#153674
0
,
#153674
47%
,
#2651AE
53%
,
#2651AE
100%
);
z-index
:
2
}
#loading
.error
{
background-color
:
#2f0d0e
;
background-image
:
-webkit-linear-gradient
(
left
,
#451317
0
,
#451317
47%
,
#AA3039
53%
,
#AA3039
100%
);
background-image
:
linear-gradient
(
to
right
,
#451317
0
,
#451317
47%
,
#AA3039
53%
,
#AA3039
100%
);
z-index
:
1
}
#loading
h1
{
margin
:
13px
13px
0
;
color
:
#ddd
;
font-size
:
14px
;
font-weight
:
700
;
text-shadow
:
0
1px
0
#000
;
text-transform
:
capitalize
}
#loading
h1
span
{
margin-left
:
10px
;
font-weight
:
400
;
text-transform
:
none
}
@media
only
screen
and
(
max-width
:
900px
){
#title
{
margin
:
0
20%
!important
;
width
:
40%
!important
}
#title
.view
{
margin
:
0
20%
!important
;
width
:
60%
!important
}
#title
span
{
display
:
none
!important
}}
@media
only
screen
and
(
max-width
:
640px
){
#title
{
display
:
none
!important
}
#title
.view
{
display
:
block
!important
;
width
:
70%
!important
;
margin
:
0
20%
0
10%
!important
}
#button_archive
,
#button_move
{
display
:
none
!important
}
.center
{
top
:
0
!important
;
left
:
0
!important
}
.album
,
.photo
{
margin
:
40px
0
0
50px
!important
}
#imageview
.arrow_wrapper
{
display
:
none
!important
}
.message
{
position
:
fixed
!important
;
width
:
100%
!important
;
height
:
100%
!important
;
margin
:
1px
0
0
!important
;
border-radius
:
0
!important
;
-webkit-animation
:
moveUp
.3s
!important
;
animation
:
moveUp
.3s
!important
}
.upload_message
{
margin-top
:
0
!important
;
margin-left
:
0
!important
;
width
:
100%
!important
}}
.message_overlay
{
position
:
fixed
;
width
:
100%
;
height
:
100%
;
top
:
0
;
left
:
0
;
background-color
:
rgba
(
0
,
0
,
0
,
.85
);
z-index
:
1000
}
.message
{
position
:
absolute
;
display
:
inline-block
;
width
:
500px
;
margin-left
:
-250px
;
margin-top
:
-95px
;
background-color
:
#444
;
background-image
:
-webkit-linear-gradient
(
top
,
#4b4b4b
,
#2d2d2d
);
background-image
:
linear-gradient
(
to
bottom
,
#4b4b4b
,
#2d2d2d
);
border-radius
:
5px
;
box-shadow
:
0
0
5px
#000
,
inset
0
1px
0
rgba
(
255
,
255
,
255
,
.08
);
-webkit-animation-name
:
moveUp
;
animation-name
:
moveUp
;
-webkit-animation-duration
:
.3s
;
animation-duration
:
.3s
;
-webkit-animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
);
animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
)}
.message
h1
{
float
:
left
;
width
:
100%
;
padding
:
12px
0
;
color
:
#fff
;
font-size
:
16px
;
font-weight
:
700
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
.3
);
text-align
:
center
}
.message
.close
{
position
:
absolute
;
top
:
0
;
right
:
0
;
padding
:
12px
14px
6px
7px
;
color
:
#aaa
;
font-size
:
20px
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
.3
);
cursor
:
pointer
}
.message
.close
:hover
{
color
:
#fff
}
.message
p
{
float
:
left
;
width
:
90%
;
margin-top
:
1px
;
padding
:
12px
5%
15px
;
color
:
#eee
;
font-size
:
14px
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
.3
);
line-height
:
20px
}
.message
p
b
{
font-weight
:
700
}
.message
p
a
{
color
:
#eee
;
text-decoration
:
none
;
border-bottom
:
1px
dashed
#888
}
.message
.button
{
float
:
right
;
margin
:
15px
15px
15px
0
;
padding
:
7px
10px
8px
;
color
:
#ccc
;
font-size
:
14px
;
font-weight
:
700
;
text-align
:
center
;
text-shadow
:
0
-1px
0
#222
;
border-radius
:
5px
;
border
:
1px
solid
rgba
(
0
,
0
,
0
,
.4
);
box-shadow
:
inset
0
1px
0
rgba
(
255
,
255
,
255
,
.08
),
0
1px
0
rgba
(
255
,
255
,
255
,
.05
);
cursor
:
pointer
}
.message
.button
:first-of-type
{
margin
:
15px
5%
18px
0
!important
}
.message
.button.active
{
color
:
#fff
;
box-shadow
:
inset
0
1px
0
rgba
(
255
,
255
,
255
,
.08
),
0
1px
0
rgba
(
255
,
255
,
255
,
.1
),
0
0
4px
#005ecc
}
.message
.button
:hover
{
background-image
:
-webkit-linear-gradient
(
top
,
#3c3c3c
,
#393939
);
background-image
:
linear-gradient
(
to
bottom
,
#3c3c3c
,
#393939
)}
.message
.button.pressed
,
.message
.button
:active
{
background-color
:
#393939
;
background-image
:
-webkit-linear-gradient
(
top
,
#393939
,
#3c3c3c
);
background-image
:
linear-gradient
(
to
bottom
,
#393939
,
#3c3c3c
)}
.sign_in
{
float
:
left
;
width
:
100%
;
margin-top
:
1px
;
padding
:
5px
0
;
color
:
#eee
;
font-size
:
14px
;
text-shadow
:
0
-1px
0
#222
;
line-height
:
20px
}
.sign_in
input
{
float
:
left
;
width
:
88%
;
padding
:
7px
1%
9px
;
margin
:
0
5%
;
background-color
:
transparent
;
color
:
#fff
;
text-shadow
:
0
-1px
0
#222
;
border
:
none
;
border-bottom
:
1px
solid
#222
;
box-shadow
:
0
1px
0
rgba
(
255
,
255
,
255
,
.1
);
border-radius
:
0
;
outline
:
0
}
.sign_in
input
:first-of-type
{
margin-bottom
:
10px
}
.sign_in
input
.error
:focus
{
box-shadow
:
0
1px
0
rgba
(
204
,
0
,
7
,
.6
)}
.message
#version
{
display
:
inline-block
;
margin-top
:
23px
;
margin-left
:
5%
;
color
:
#888
;
text-shadow
:
0
-1px
0
#111
}
.message
#version
span
{
display
:
none
}
.message
#version
span
a
{
color
:
#888
}
.message
input
.text
{
float
:
left
;
width
:
-webkit-calc
(
100%
-
10px
);
width
:
calc
(
100%
-
10px
);
padding
:
17px
5px
9px
;
margin-top
:
10px
;
background-color
:
transparent
;
color
:
#fff
;
text-shadow
:
0
-1px
0
#222
;
border
:
none
;
box-shadow
:
0
1px
0
rgba
(
255
,
255
,
255
,
.1
);
border-bottom
:
1px
solid
#222
;
border-radius
:
0
;
outline
:
0
}
.message
input
.less
{
margin-bottom
:
-10px
}
.message
input
.more
{
margin-bottom
:
30px
}
.message
.copylink
{
margin-bottom
:
20px
}
.message
.choice
{
float
:
left
;
margin
:
12px
5%
;
width
:
90%
;
color
:
#fff
}
.message
.choice
input
{
float
:
left
}
.message
.choice
h2
{
float
:
left
;
margin
:
1px
0
0
8px
;
color
:
#fff
;
font-size
:
14px
;
font-weight
:
700
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
.3
)}
.message
.choice
p
{
margin-top
:
2px
;
padding
:
0
5%
0
25px
;
color
:
#aaa
;
font-size
:
13px
}
.message
.choice
p
input
{
width
:
100%
;
padding
:
10px
1px
9px
;
margin-top
:
10px
}
body
,
html
{
min-height
:
100%
}
body
{
background-color
:
#222
;
font-family
:
'Helvetica Neue'
,
Helvetica
,
Arial
,
sans-serif
;
font-size
:
12px
;
-webkit-font-smoothing
:
antialiased
;
-moz-font-smoothing
:
antialiased
;
-moz-osx-font-smoothing
:
grayscale
;
font-smoothing
:
antialiased
}
body
.view
{
background-color
:
#0f0f0f
}
.center
{
position
:
absolute
;
left
:
50%
;
top
:
50%
}
*
{
-webkit-user-select
:
none
;
-moz-user-select
:
none
;
-ms-user-select
:
none
;
user-select
:
none
;
-webkit-transition
:
color
.3s
,
opacity
.3s
ease-out
,
-webkit-transform
.3s
ease-out
,
box-shadow
.3s
;
transition
:
color
.3s
,
opacity
.3s
ease-out
,
transform
.3s
ease-out
,
box-shadow
.3s
}
input
{
-webkit-user-select
:
text
!important
;
-moz-user-select
:
text
!important
;
-ms-user-select
:
text
!important
;
user-select
:
text
!important
}
#multiselect
{
position
:
absolute
;
background-color
:
rgba
(
0
,
94
,
204
,
.3
);
border
:
1px
solid
rgba
(
0
,
94
,
204
,
1
);
border-radius
:
3px
;
z-index
:
3
}
.tipsy
{
padding
:
4px
;
font-size
:
12px
;
position
:
absolute
;
z-index
:
100000
;
-webkit-animation-name
:
fadeIn
;
animation-name
:
fadeIn
;
-webkit-animation-duration
:
.3s
;
animation-duration
:
.3s
}
.tipsy-inner
{
padding
:
8px
10px
7px
;
color
:
#fff
;
max-width
:
200px
;
text-align
:
center
;
background
:
rgba
(
0
,
0
,
0
,
.8
);
border-radius
:
25px
}
.tipsy-arrow
{
position
:
absolute
;
width
:
0
;
height
:
0
;
line-height
:
0
;
border
:
5px
dashed
rgba
(
0
,
0
,
0
,
.8
)}
.tipsy-arrow-n
{
border-bottom-color
:
rgba
(
0
,
0
,
0
,
.8
)}
.tipsy-arrow-s
{
border-top-color
:
rgba
(
0
,
0
,
0
,
.8
)}
.tipsy-arrow-e
{
border-left-color
:
rgba
(
0
,
0
,
0
,
.8
)}
.tipsy-arrow-w
{
border-right-color
:
rgba
(
0
,
0
,
0
,
.8
)}
.tipsy-n
.tipsy-arrow
{
top
:
0
;
left
:
50%
;
margin-left
:
-5px
;
border-bottom-style
:
solid
;
border-top
:
none
;
border-left-color
:
transparent
;
border-right-color
:
transparent
}
.tipsy-nw
.tipsy-arrow
{
top
:
0
;
left
:
10px
;
border-bottom-style
:
solid
;
border-top
:
none
;
border-left-color
:
transparent
;
border-right-color
:
transparent
}
.tipsy-ne
.tipsy-arrow
{
top
:
0
;
right
:
10px
;
border-bottom-style
:
solid
;
border-top
:
none
;
border-left-color
:
transparent
;
border-right-color
:
transparent
}
.tipsy-s
.tipsy-arrow
{
bottom
:
0
;
left
:
50%
;
margin-left
:
-5px
;
border-top-style
:
solid
;
border-bottom
:
none
;
border-left-color
:
transparent
;
border-right-color
:
transparent
}
.tipsy-sw
.tipsy-arrow
{
bottom
:
0
;
left
:
10px
;
border-top-style
:
solid
;
border-bottom
:
none
;
border-left-color
:
transparent
;
border-right-color
:
transparent
}
.tipsy-se
.tipsy-arrow
{
bottom
:
0
;
right
:
10px
;
border-top-style
:
solid
;
border-bottom
:
none
;
border-left-color
:
transparent
;
border-right-color
:
transparent
}
.tipsy-e
.tipsy-arrow
{
right
:
0
;
top
:
50%
;
margin-top
:
-5px
;
border-left-style
:
solid
;
border-right
:
none
;
border-top-color
:
transparent
;
border-bottom-color
:
transparent
}
.tipsy-w
.tipsy-arrow
{
left
:
0
;
top
:
50%
;
margin-top
:
-5px
;
border-right-style
:
solid
;
border-left
:
none
;
border-top-color
:
transparent
;
border-bottom-color
:
transparent
}
#upload
{
display
:
none
}
.upload_overlay
{
position
:
fixed
;
width
:
100%
;
height
:
100%
;
top
:
0
;
left
:
0
;
background-color
:
rgba
(
0
,
0
,
0
,
.85
);
z-index
:
1000
}
.upload_message
{
position
:
absolute
;
display
:
inline-block
;
width
:
450px
;
margin-left
:
-225px
;
margin-top
:
-170px
;
background-image
:
-webkit-linear-gradient
(
top
,
#4b4b4b
,
#2d2d2d
);
background-image
:
linear-gradient
(
to
bottom
,
#4b4b4b
,
#2d2d2d
);
border-radius
:
5px
;
box-shadow
:
0
0
5px
#000
,
inset
0
1px
0
rgba
(
255
,
255
,
255
,
.08
),
inset
1px
0
0
rgba
(
255
,
255
,
255
,
.03
),
inset
-1px
0
0
rgba
(
255
,
255
,
255
,
.03
);
-webkit-animation-name
:
moveUp
;
animation-name
:
moveUp
;
-webkit-animation-duration
:
.3s
;
animation-duration
:
.3s
;
-webkit-animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
);
animation-timing-function
:
cubic-bezier
(
0.51
,
.92
,
.24
,
1.15
)}
.upload_message
h1
{
float
:
left
;
width
:
100%
;
padding
:
12px
0
;
color
:
#fff
;
font-size
:
16px
;
font-weight
:
700
;
text-shadow
:
0
-1px
0
#222
;
text-align
:
center
}
.upload_message
.close
{
position
:
absolute
;
top
:
0
;
right
:
0
;
padding
:
11px
14px
6px
7px
;
color
:
#aaa
;
font-size
:
20px
;
text-shadow
:
0
-1px
0
#222
;
cursor
:
pointer
}
.upload_message
.close
:hover
{
color
:
#fff
}
.upload_message
.rows
{
float
:
left
;
margin
:
3px
8px
8px
;
width
:
-webkit-calc
(
100%
-
16px
);
width
:
calc
(
100%
-
16px
);
height
:
300px
;
background-color
:
rgba
(
0
,
0
,
0
,
.5
);
overflow
:
hidden
;
overflow-y
:
scroll
;
border-radius
:
3px
;
box-shadow
:
inset
0
0
3px
rgba
(
0
,
0
,
0
,
.8
)}
.upload_message
.rows
.row
{
float
:
left
;
display
:
inline-block
;
padding
:
8px
0
;
width
:
100%
;
background-color
:
rgba
(
255
,
255
,
255
,
.02
)}
.upload_message
.rows
.row
:nth-child
(
2
n
)
{
background-color
:
transparent
}
.upload_message
.rows
.row
a
.name
{
float
:
left
;
padding
:
5px
10px
;
width
:
-webkit-calc
(
70%
-
20px
);
width
:
calc
(
70%
-
20px
);
color
:
#fff
;
font-size
:
14px
;
white-space
:
nowrap
;
overflow
:
hidden
}
.upload_message
.rows
.row
a
.status
{
float
:
left
;
padding
:
5px
10px
;
width
:
-webkit-calc
(
30%
-
20px
);
width
:
calc
(
30%
-
20px
);
color
:
rgba
(
255
,
255
,
255
,
.5
);
font-size
:
14px
;
text-align
:
right
;
-webkit-animation-name
:
pulse
;
animation-name
:
pulse
;
-webkit-animation-duration
:
2s
;
animation-duration
:
2s
;
-webkit-animation-timing-function
:
ease-in-out
;
animation-timing-function
:
ease-in-out
;
-webkit-animation-iteration-count
:
infinite
;
animation-iteration-count
:
infinite
}
.upload_message
.rows
.row
a
.status.error
,
.upload_message
.rows
.row
a
.status.success
{
-webkit-animation
:
none
;
animation
:
none
}
.upload_message
.rows
.row
a
.status.error
{
color
:
#d51818
}
.upload_message
.rows
.row
a
.status.success
{
color
:
#2ad500
}
\ 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
