source: gs3-extensions/web-audio/trunk/js-mad/jsmad-master/css/style.css@ 28388

Last change on this file since 28388 was 28388, checked in by davidb, 11 years ago

Set of JS, CSS, PNG etc web resources to support a mixture of audio player/document display capabilities

File size: 3.2 KB
Line 
1body {
2 font-family: Helvetica;
3 margin:0;
4 padding:0;
5 background:#fa5945 url(../images/header.png) repeat-x top left;
6}
7#container {
8 width:960px;
9 margin:0 auto;
10}
11
12h1 {
13 background:transparent url(../images/logo.png) no-repeat top left;
14 width: 157px;
15 height: 180px;
16 display: block;
17 float:left;
18 margin:20px 40px 20px 20px;
19 }
20 h1 span { display:none; }
21
22h2 { font-size: 30px; line-height: 38px; margin:0; }
23h3 { font-size: 22px; margin: 10px 0 20px; }
24
25h3 small { font-size: 14px; color:#FA5945 !important; font-weight:normal !important; margin-left:10px; }
26
27a, a:active { color:#490CCE; outline:0;}
28a:hover { color:#0A28AC; }
29
30div.github {
31 -moz-transform: rotate(2deg);
32 -moz-transform-origin: left top;
33 background: url(../images/github.png) no-repeat 16px 10px rgba(255, 255, 255, 0.5);
34 box-shadow: 0 0 27px rgba(0, 0, 0, 0.08);
35 float: right;
36 padding: 30px 30px 30px 91px;
37 position: relative;
38 top: -3px;
39}
40
41div.select {
42 top: 66px;
43 clear:right;
44 position: relative;
45}
46div.select span {
47 margin:0 10px;
48}
49form { display: inline-block;}
50
51label { color:#FFE400; font-size: 18px; line-height:22px; margin-bottom: 3px; text-shadow: rgba(0,0,0,0.3) 1px 1px 1px; display:block;}
52label.ofm { background:url(../images/ofm.png) no-repeat top left; padding-left:20px;}
53
54input { font-size:18px; }
55
56#content {
57 clear:both;
58}
59
60#ID3 {
61 background:#fff;
62 padding:20px;
63 min-height:400px;
64 position:relative;
65}
66
67#ID3:before {
68 content: ' ';
69 height: 0;
70 position: absolute;
71 width: 0;
72 border: 15px solid transparent;
73 border-bottom-color: #fff;
74 top: 0%;
75 left: 90px;
76 margin-top: -30px;
77}
78
79div.player {
80 float:left;
81 margin-right:20px;
82 }
83
84div.picture {
85 width:400px;
86 height:400px;
87 display: block;
88 }
89 div.picture img.picture {
90 width:400px;
91 height:400px;
92 display: block;
93 }
94
95a.button {
96 width:100px;
97 height:100px;
98 display:block;
99 position:relative;
100 top:-250px;
101 left:150px;
102}
103
104a.play {
105 background: transparent url(../images/play.png) no-repeat top left;
106 opacity:0.7;
107 }
108 a.play:hover {opacity:1;}
109
110a.pause {
111 background: transparent url(../images/pause.png) no-repeat top left;
112 opacity:0.7;
113 }
114 a.pause:hover {opacity:1;}
115
116div.timeline {
117 width:360px;
118 height:20px;
119 border: 1px solid rgba(255,228,0,0.7);
120 display:block;
121 position:relative;
122 top:-140px;
123 left:20px;
124}
125div#progressbar { width: 0; height: 20px; background-color: #FA5945; }
126div#preloadbar { width: 0; height: 20px; background-color: rgba(255,228,0,0.5); }
127
128div.meta { background-color: rgba(0, 0, 0, 0.1); width:460px; padding:20px; font-size:16px; display:inline-block; }
129
130#shareTrack {
131 text-align: right;
132 margin: 20px 0 40px 0;
133}
134
135#playUrl {
136 width: 320px;
137}
138
139#footer {
140 clear:both;
141 padding:0 20px 20px;
142 color:#FFE400;
143 font-size:15px;
144 }
145 #footer a { background:#fff; padding:2px 5px; -moz-border-radius:3px;font-size: 15px;
146 padding: 3px 5px 1px;
147 position: relative;
148 top: -1px;
149 font-weight:bold;
150 text-decoration:none;
151 color:#FA5945;}
152 #footer a:hover { color:#000;}
153 #footer a span {font-weight:normal;color:#000; font-style:italic;font-size:12px;}
154 #footer a.mhd { background:transparent; top:0;}
155 #footer img { position: relative;top: 4px; }
Note: See TracBrowser for help on using the repository browser.