-
Notifications
You must be signed in to change notification settings - Fork 3
/
kid3index.css
119 lines (115 loc) · 2.5 KB
/
kid3index.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
/*! Index page */
html{
-webkit-transition:.5s background;
transition:.5s background;
font-family: Helvetica, Arial, sans-serif, sans;
font-size: 1em;
background: #d7d7d7;
}
body, p{
margin:0;
}
h1,
h2,
h3,
h4 {
font-weight:bold;
text-transform: uppercase;
}
b,
strong {
font-weight:bold;
}
a:link,
a:visited,
a:hover,
a:active,
a:focus {
text-decoration: none;
-webkit-transition:.6s background;
transition:.6s background;
}
a,
a:link,
a:visited {
color: #fff;
-webkit-transition-property: hover;
-webkit-transition: color 0.15s ease-in-out;
-moz-transition: color 0.15s linear 0s; /* firefox 4 */
-o-transition-property: color; /* opera 10.5 */
-o-transition-duration: 0.15s;
}
a:hover {
color: rgba(0,0,0,0.9);
}
a:active {
color: #f00;
}
.vignette {
float: left;
width:370px;
height:370px;
background:no-repeat;
background-size: 370px;
background-color: rgba(0,0,0,0.2);
box-shadow: 1px 0px 37px rgba(0, 0, 0,.1),
-1px 0px 37px rgba(0, 0, 0,.1),
0px -1px 37px rgba(0, 0, 0,.1),
0px 1px 37px rgba(0, 0, 0,.1);
}
#picker {
}
#picker p {
position:relative;
width:336px;
height: 336px;
padding: 17px;
border-radius: 2px;
background: rgba(0,0,0,0.2);
color:transparent;
-webkit-transition-property: hover;
-webkit-transition: background 0.15s ease-in-out;
-moz-transition: background 0.15s linear 0s; /* firefox 4 */
-o-transition-property: background; /* opera 10.5 */
-o-transition-duration: 0.15s;
}
#picker p:hover{
background: rgba(0,0,0,.9);
color: #d7d7d7;
}
strong {
font-size:2em;
}
.title{
text-shadow: 1px 0px 7px rgba(0, 0, 0,.5),
-1px 0px 7px rgba(0, 0, 0,.5),
0px -1px 7px rgba(0, 0, 0,.5),
0px 1px 7px rgba(0, 0, 0,.5);
}
#pagetitle {
z-index: 100;
text-transform: none;
position: fixed; bottom: 10px; left:17px;
font-size:3.5em;
letter-spacing:-.05em;
line-height: .95em;
color:rgba(119,119,119,0);
background-color:transparent;
box-shadow: 1px 0px 27px rgba(0, 0, 0,.1),
-1px 0px 27px rgba(0, 0, 0,.1),
0px -1px 27px rgba(0, 0, 0,.1),
0px 1px 27px rgba(0, 0, 0,.1);
padding:7px;
border-radius: 2px;
}
h1:hover{
text-shadow: 1px 0px 0px rgba(0, 0, 0,.5),
-1px 0px 0px rgba(0, 0, 0,.5),
0px -1px 0px rgba(0, 0, 0,.5),
0px 1px 0px rgba(0, 0, 0,.5);
-webkit-transition-property: hover;
-webkit-transition: text-shadow 0.3s ease-in-out;
-moz-transition: text-shadow 0.3s linear 0s; /* firefox 4 */
-o-transition-property: text-shadow; /* opera 10.5 */
-o-transition-duration: 0.3s;
}