Subversion Repositories ALCASAR

Rev

Rev 360 | Go to most recent revision | Only display areas with differences | Ignore whitespace | Details | Blame | Last modification | View Log

Rev 360 Rev 363
1
/* 	
1
/* 	
2
	Feuille de style pour les pages d'interceptions coté utilisateurs d'ALCASAR
2
	Feuille de style pour les pages d'interceptions coté utilisateurs d'ALCASAR
3
	Auteur : Stéphane ERARD
3
	Auteur : Stéphane ERARD
4
	Licence : GNU GPL
4
	Licence : GNU GPL
5
 
5
 
6
*/
6
*/
7
 
7
 
8
 
8
 
9
/* règles générales */
9
/* règles générales */
10
 
10
 
11
/* Couleurs de polices */
11
/* Couleurs de polices */
12
:link, :visited, :hover:link, :hover:visited, H2, #box_url, #box_refuse {
12
:link, :visited, :hover:link, :hover:visited, H2, #box_url, #box_refuse {
13
	COLOR: #000000;
13
	COLOR: #000000;
14
}
14
}
15
BODY, H, #boite-logon {
15
BODY, H, #boite-logon {
16
	COLOR: #666666;
16
	COLOR: #666666;
17
}
17
}
18
#acces_controle, .log_out {
18
#acces_controle, .log_out {
19
	COLOR: white;
19
	COLOR: white;
20
}
20
}
21
 
21
 
22
/* Style de police */
22
/* Style de police */
23
 
23
 
24
BODY, :link, :visited, :hover:link, :hover:visited  {
24
BODY, :link, :visited, :hover:link, :hover:visited  {
25
	FONT-FAMILY: "DejaVu Sans";
25
	FONT-FAMILY: "DejaVu Sans";
26
}
26
}
27
INPUT, #box_url {
27
INPUT, #box_url {
28
	FONT-FAMILY: Arial;
28
	FONT-FAMILY: Arial;
29
}
29
}
30
#acces_controle, #box_url, #box_bienvenue, #cadre_titre SPAN {
30
#acces_controle, #box_url, #box_bienvenue, #cadre_titre SPAN {
31
	FONT-WEIGHT: bold;
31
	FONT-WEIGHT: bold;
32
}
32
}
33
 
33
 
34
/*Couleurs de fond */
34
/*Couleurs de fond */
35
 
35
 
36
BODY {
36
BODY {
37
	BACKGROUND-COLOR: #666666;
37
	BACKGROUND-COLOR: #666666;
38
}
38
}
39
 
39
 
40
INPUT, #contenu_acces, #logon, #auth_reussi {
40
INPUT, #contenu_acces, #logon, #auth_reussi {
41
	BACKGROUND-COLOR: #ffffff;
41
	BACKGROUND-COLOR: #ffffff;
42
}
42
}
43
 
43
 
44
/* Règles des balises HTML */
44
/* Règles des balises HTML */
45
 
45
 
46
H1, H2, #aide-certif {
46
H1, H2, #aide-certif {
47
	TEXT-ALIGN: center;	
47
	TEXT-ALIGN: center;	
48
	padding: 0px;
48
	padding: 0px;
49
	margin: 3px;
49
	margin: 3px;
50
}
50
}
51
P, UL, LI{
51
P, UL, LI{
52
	TEXT-ALIGN: justify;
52
	TEXT-ALIGN: justify;
53
}
53
}
54
 
54
 
55
BODY {
55
BODY {
56
	BACKGROUND-IMAGE: url(/images/fond.png);
56
	BACKGROUND-IMAGE: url(/images/fond.png);
57
	BACKGROUND-REPEAT: repeat-x;
57
	BACKGROUND-REPEAT: repeat-x;
58
	TEXT-ALIGN: center;
58
	TEXT-ALIGN: center;
59
	FONT-SIZE: 12px;
59
	FONT-SIZE: 12px;
60
	MARGIN: 0px;
60
	MARGIN: 0px;
61
}
61
}
62
H1 {
62
H1 {
63
	FONT-SIZE: 55px;
63
	FONT-SIZE: 55px;
64
}
64
}
65
H2 {
65
H2 {
66
	FONT-SIZE: 30px;
66
	FONT-SIZE: 30px;
67
}
67
}
68
H6, #aide-certif{
68
H6, #aide-certif{
69
	FONT-SIZE: 100%;
69
	FONT-SIZE: 100%;
70
}
70
}
71
UL {
71
UL {
72
	MARGIN: 5px;
72
	MARGIN: 5px;
73
	PADDING-BOTTOM: 5px;
73
	PADDING-BOTTOM: 5px;
74
	PADDING-LEFT: 10px;
74
	PADDING-LEFT: 10px;
75
	PADDING-RIGHT: 115px;
75
	PADDING-RIGHT: 115px;
76
	PADDING-TOP: 5px;
76
	PADDING-TOP: 5px;
77
}
77
}
78
LI {
78
LI {
79
	LIST-STYLE-TYPE: square;
79
	LIST-STYLE-TYPE: square;
80
	PADDING-TOP: 2px;
80
	PADDING-TOP: 2px;
81
}
81
}
82
TABLE {
82
TABLE {
83
	FONT-SIZE: 90%;
83
	FONT-SIZE: 90%;
84
}
84
}
85
IMG {
85
IMG {
86
	HEIGHT: 150px;
86
	HEIGHT: 150px;
87
}
87
}
88
INPUT {
88
INPUT {
89
	BORDER: #666666 1px solid;
89
	BORDER: #666666 1px solid;
90
	PADDING: 2px;
90
	PADDING: 2px;
91
	FONT-FAMILY: Arial;
91
	FONT-FAMILY: Arial;
92
	HEIGHT: 22px;
92
	HEIGHT: 22px;
93
}
93
}
94
 
94
 
95
/* Taille et position des logos */
95
/* Taille et position des logos */
96
 
96
 
97
#logo-alcasar {
97
#logo-alcasar {
98
	POSITION: absolute;
98
	POSITION: absolute;
99
	BOTTOM: 25px;
99
	BOTTOM: 25px;
100
	RIGHT: 5px;
100
	RIGHT: 5px;
101
	HEIGHT: 130px;
101
	HEIGHT: 130px;
102
}
102
}
103
#logo-organ {
103
#logo-organ {
104
	POSITION: relative;
104
	POSITION: relative;
105
	TOP: 0px;
105
	TOP: 0px;
106
	RIGHT: -10px;
106
	RIGHT: -10px;
107
	MAX-WIDTH: 150px;
107
	MAX-WIDTH: 150px;
108
	MAX-HEIGHT: 150px;
108
	MAX-HEIGHT: 150px;
109
}
109
}
110
 
110
 
111
/* Placement et proportion de la boite de saisie et de l'aide */
111
/* Placement et proportion de la boite de saisie et de l'aide */
112
 
112
 
113
#logon {
113
#logon {
114
	POSITION: relative;
114
	POSITION: relative;
115
	WIDTH: 620px;
115
	WIDTH: 620px;
116
	TOP: 20px;
116
	TOP: 20px;
117
 
117
 
118
 
118
 
119
/* ombrage CSS3*/	
119
/* ombrage CSS3*/	
120
 
120
 
121
	-moz-box-shadow: 0px 0px 12px #000; 
121
	-moz-box-shadow: 0px 0px 12px #000; 
122
	-webkit-box-shadow: 0px 0px 12px #000;
122
	-webkit-box-shadow: 0px 0px 12px #000;
123
	box-shadow: 0px 0px 12px #000;
123
	box-shadow: 0px 0px 12px #000;
124
}
124
}
125
 
125
 
126
#boite-logon {
126
#boite-logon {
127
	BACKGROUND-IMAGE: url(/images/fond-bdd.png);
127
	BACKGROUND-IMAGE: url(/images/fond-bdd.png);
128
	BACKGROUND-REPEAT: repeat-x;
128
	BACKGROUND-REPEAT: repeat-x;
129
	PADDING: 10px;
129
	PADDING: 10px;
130
	WIDTH: 420px;
130
	WIDTH: 420px;
131
	HEIGHT: 189px;
131
	HEIGHT: 189px;
132
}
132
}
133
#boite-logon TD {
133
#boite-logon TD {
134
	PADDING-TOP: 10px;
134
	PADDING-TOP: 10px;
135
}
135
}
136
#boite-info {
136
#boite-info {
137
	BORDER: 0px;
137
	BORDER: 0px;
138
	MARGIN-TOP: 25px;
138
	MARGIN-TOP: 25px;
139
	WIDTH: 580px;
139
	WIDTH: 580px;
140
	PADDING-TOP: 10px;
140
	PADDING-TOP: 10px;
141
}
141
}
142
/*Boite de dialogue de deconnection*/
142
/*Boite de dialogue de deconnection*/
143
 
143
 
144
#auth_reussi {
144
#auth_reussi {
145
	WIDTH: 450px;
145
	WIDTH: 450px;
146
	MARGIN-TOP: 12px;
146
	MARGIN-TOP: 12px;
147
	PADDING-TOP: 5px;
147
	PADDING-TOP: 5px;
148
	PADDING-LEFT: 10px;
148
	PADDING-LEFT: 10px;
149
	PADDING-RIGHT: 10px;
149
	PADDING-RIGHT: 10px;
150
	PADDING-BOTTOM: 0px;
150
	PADDING-BOTTOM: 0px;
151
}
151
}
152
.text_auth {
152
.text_auth {
153
	FONT-SIZE: 20px;
153
	FONT-SIZE: 20px;
154
}
154
}
155
.lien_deco {
155
.lien_deco {
156
	TEXT-ALIGN: center;
156
	TEXT-ALIGN: center;
157
	FONT-SIZE: 18px;
157
	FONT-SIZE: 18px;
158
	MARGIN-BOTTOM: 15px;
158
	MARGIN-BOTTOM: 15px;
159
}
159
}
160
.log_out {
160
.log_out {
161
	FONT-SIZE: 24px;
161
	FONT-SIZE: 24px;
162
	TEXT-ALIGN: center;
162
	TEXT-ALIGN: center;
163
	MARGIN-TOP: 30px;
163
	MARGIN-TOP: 30px;
164
}
164
}
165
#boite-logon, #auth_reussi, #logon {
165
#boite-logon, #auth_reussi, #logon {
166
	BORDER: 1px #efefef solid;
166
	BORDER: 1px #efefef solid;
167
 
167
 
168
/* ombrage css3*/
168
/* ombrage css3*/
169
 
169
 
170
	-moz-box-shadow: 0px 0px 6px #000; 
170
	-moz-box-shadow: 0px 0px 6px #000; 
171
	-webkit-box-shadow: 0px 0px 6px #000;
171
	-webkit-box-shadow: 0px 0px 6px #000;
172
	box-shadow: 0px 0px 6px #000;
172
	box-shadow: 0px 0px 6px #000;
173
}
173
}
174
 
174
 
175
/* style de la page accès contrôlé*/
175
/* style de la page accès contrôlé*/
176
 
176
 
177
#cadre_titre{
177
#cadre_titre{
178
	POSITION: relative;
178
	POSITION: relative;
179
	WIDTH: 730px;
179
	WIDTH: 730px;
180
	HEIGHT: 98px;
180
	HEIGHT: 98px;
181
	MARGIN-TOP: 40px;
181
	MARGIN-TOP: 40px;
182
	MARGIN-LEFT: auto;
182
	MARGIN-LEFT: auto;
183
	MARGIN-RIGHT: auto;
183
	MARGIN-RIGHT: auto;
184
	Z-INDEX: 2;
184
	Z-INDEX: 2;
185
 
185
 
186
/* ombrage css3 */
186
/* ombrage css3 */
187
 
187
 
188
	-moz-box-shadow: 1px 4px 10px #000; 
188
	-moz-box-shadow: 1px 4px 10px #000; 
189
	-webkit-box-shadow: 1px 4px 10px #000;
189
	-webkit-box-shadow: 1px 4px 10px #000;
190
	box-shadow: 1px 4px 10px #000;
190
	box-shadow: 1px 4px 10px #000;
191
}
191
}
192
#cadre_titre .titre_controle {
192
#cadre_titre .titre_controle {
193
	BACKGROUND-IMAGE: url(/images/fond-bandeau.png);
193
	BACKGROUND-IMAGE: url(/images/fond-bandeau.png);
194
	BACKGROUND-REPEAT: repeat-x;
194
	BACKGROUND-REPEAT: repeat-x;
195
}
195
}
196
#cadre_titre .titre_refus  {
196
#cadre_titre .titre_refus  {
197
	BACKGROUND-IMAGE: url(/images/fond-bandeau-rouge.png);
197
	BACKGROUND-IMAGE: url(/images/fond-bandeau-rouge.png);
198
	BACKGROUND-REPEAT: repeat-x;
198
	BACKGROUND-REPEAT: repeat-x;
199
}
199
}
200
#boite_logo{
200
#boite_logo{
201
	POSITION: absolute;
201
	POSITION: absolute;
202
	TOP: -30px;
202
	TOP: -30px;
203
	LEFT: -30px;
203
	LEFT: -30px;
204
	WIDTH: 150px;
204
	WIDTH: 150px;
205
	HEIGHT: 150px;
205
	HEIGHT: 150px;
206
	Z-INDEX: 2;
206
	Z-INDEX: 2;
207
}
207
}
208
#acces_controle {
208
#acces_controle {
209
	TEXT-ALIGN: center;
209
	TEXT-ALIGN: center;
210
	FONT-SIZE: 50px;
210
	FONT-SIZE: 40px;
211
	PADDING-TOP: 20px;
211
	PADDING-TOP: 25px;
212
	PADDING-BOTTOM: 20px;
212
	PADDING-BOTTOM: 27px;
213
	MARGIN: 0px;
213
	MARGIN: 0px;
214
}
214
}
215
#logo_acces {
215
#logo_acces {
216
	POSITION: relative;
216
	POSITION: relative;
217
	TOP: 0px;
217
	TOP: 0px;
218
	LEFT: 0px;
218
	LEFT: 0px;
219
}
219
}
220
#contenu_acces {
220
#contenu_acces {
221
	POSITION: relative;
221
	POSITION: relative;
222
	WIDTH: 640px;
222
	WIDTH: 640px;
223
	HEIGHT: 400px;
223
	HEIGHT: 400px;
224
	TOP: -20px;
224
	TOP: -20px;
225
	PADDING-TOP: 0px;
225
	PADDING-TOP: 0px;
226
	MARGIN-LEFT: auto;
226
	MARGIN-LEFT: auto;
227
	MARGIN-RIGHT: auto;
227
	MARGIN-RIGHT: auto;
228
	Z-INDEX: 1;
228
	Z-INDEX: 1;
229
 
229
 
230
/* ombrage CSS3 */
230
/* ombrage CSS3 */
231
 
231
 
232
	-moz-box-shadow: 1px 1px 10px #000; 
232
	-moz-box-shadow: 1px 1px 10px #000; 
233
	-webkit-box-shadow: 1px 1px 10px #000;
233
	-webkit-box-shadow: 1px 1px 10px #000;
234
	box-shadow: 1px 1px 10px #000;
234
	box-shadow: 1px 1px 10px #000;
235
}
235
}
236
#logo_acces IMG, #box_refuse IMG {
236
#logo_acces IMG, #box_refuse IMG {
237
	WIDTH: 95px;
237
	WIDTH: 95px;
238
	HEIGHT: 95px;
238
	HEIGHT: 95px;
239
}
239
}
240
 
240
 
241
/* Boite des liens*/
241
/* Boite des liens*/
242
 
242
 
243
#box_url {
243
#box_url {
244
	POSITION: relative;
244
	POSITION: relative;
245
	TOP: 35px;
245
	TOP: 35px;
246
	TEXT-ALIGN: right;
246
	TEXT-ALIGN: right;
247
	FONT-SIZE: 14px;
247
	FONT-SIZE: 14px;
248
	MARGIN-RIGHT: 20px;
248
	MARGIN-RIGHT: 20px;
249
}
249
}
250
#box_bienvenue {
250
#box_bienvenue {
251
	FONT-SIZE: 18px;
251
	FONT-SIZE: 18px;
252
}
252
}
253
#cadre_titre SPAN {
253
#cadre_titre SPAN {
254
	POSITION: absolute;
254
	POSITION: absolute;
255
	TOP: 80px;
255
	TOP: 70px;
256
	WIDTH: 540px;
256
	WIDTH: 510px;
257
	LEFT: 100px;
257
	LEFT: 110px;
258
	FONT-SIZE: 14px;
258
	FONT-SIZE: 14px;
259
	COLOR: red;
259
	COLOR: red;
260
	TEXT-ALIGN: center;
260
	TEXT-ALIGN: center;
-
 
261
	BORDER: 2px red solid;
-
 
262
	PADDING: 2px;
-
 
263
	BACKGROUND-COLOR: white;
-
 
264
}
-
 
265
#contenu_acces SPAN {
-
 
266
	POSITION: relative;
-
 
267
	BOTTOM: -150px;
-
 
268
	FONT-FAMILY: "courier new";
261
}
269
}
262
#box_refuse {
270
#box_refuse {
263
	FONT-SIZE: 16px;
271
	FONT-SIZE: 16px;
264
	MARGIN-LEFT: 130px;
272
	MARGIN-LEFT: 130px;
265
	MARGIN-RIGHT: 20px;
273
	MARGIN-RIGHT: 20px;
266
	MARGIN-TOP: 40px;
274
	MARGIN-TOP: 40px;
267
	WIDTH: 460px;
275
	WIDTH: 460px;
268
}
276
}
269
#box_refuse IMG {
277
#box_refuse IMG {
270
	POSITION: absolute;
278
	POSITION: absolute;
271
	TOP: -10px;
279
	TOP: -10px;
272
	LEFT: -110px;
280
	LEFT: -110px;
273
}
281
}
274
#box_refuse, #box_bienvenue {
282
#box_refuse, #box_bienvenue {
275
	POSITION: relative;
283
	POSITION: relative;
276
	TOP: 55px;
284
	TOP: 55px;
277
}
285
}
278
#box_1 {
286
#box_1 {
279
	LEFT: 40px;
287
	LEFT: 40px;
280
}
288
}
281
#box_2 {
289
#box_2 {
282
	LEFT: 350px;
290
	LEFT: 350px;
283
}
291
}
284
#box_3 {
292
#box_3 {
285
	WIDTH: 575px;
293
	WIDTH: 575px;
286
	LEFT: 40px;
294
	LEFT: 40px;
287
	BOTTOM: 20px;
295
	BOTTOM: 20px;
288
}
296
}
289
#box_1 P, #box_2 P, #box_3 P {
297
#box_1 P, #box_2 P, #box_3 P {
290
	MARGIN-LEFT: 80px;
298
	MARGIN-LEFT: 80px;
291
	MARGIN-RIGHT: 25px;
299
	MARGIN-RIGHT: 25px;
292
	MARGIN-TOP: 8px;
300
	MARGIN-TOP: 8px;
293
	FONT-SIZE: 10px;
301
	FONT-SIZE: 10px;
294
}
302
}
295
#box_1 SPAN, #box_2 SPAN, #box_3 SPAN {
303
#box_1 SPAN, #box_2 SPAN, #box_3 SPAN {
296
	POSITION: relative;
304
	POSITION: relative;
297
	MARGIN-LEFT: 75px;
305
	MARGIN-LEFT: 75px;
298
	MARGIN-RIGHT: 10px;
306
	MARGIN-RIGHT: 10px;
299
	FONT-SIZE: 12px;
307
	FONT-SIZE: 12px;
300
	TOP: 2px;
308
	TOP: 2px;
301
}
309
}
302
.box_menu_courte, .box_menu_large {
310
.box_menu_courte, .box_menu_large {
303
	POSITION: absolute;
311
	POSITION: absolute;
304
	HEIGHT: 80px;
312
	HEIGHT: 80px;
305
	BACKGROUND-IMAGE: url(/images/fond-bdd.png);
313
	BACKGROUND-IMAGE: url(/images/fond-bdd.png);
306
	BACKGROUND-REPEAT: repeat-x;
314
	BACKGROUND-REPEAT: repeat-x;
307
	VERTICAL-ALIGN: bottom;
315
	VERTICAL-ALIGN: bottom;
308
	TEXT-ALIGN: left;
316
	TEXT-ALIGN: left;
309
	BORDER: 2px #efefef solid;
317
	BORDER: 2px #efefef solid;
310
 
318
 
311
/* ombrage CSS3 */
319
/* ombrage CSS3 */
312
	-moz-box-shadow: 1px 1px 6px #666; 
320
	-moz-box-shadow: 1px 1px 6px #666; 
313
	-webkit-box-shadow: 1px 1px 6px #666;
321
	-webkit-box-shadow: 1px 1px 6px #666;
314
	box-shadow: 1px 1px 6px #666;
322
	box-shadow: 1px 1px 6px #666;
315
}
323
}
316
.box_menu_courte {
324
.box_menu_courte {
317
	WIDTH: 265px;
325
	WIDTH: 265px;
318
	TOP: 150px;
326
	TOP: 150px;
319
}
327
}
320
.box_menu_courte IMG, .box_menu_large IMG {
328
.box_menu_courte IMG, .box_menu_large IMG {
321
	POSITION: absolute;
329
	POSITION: absolute;
322
	WIDTH: 100px;
330
	WIDTH: 100px;
323
	HEIGHT: 100px;
331
	HEIGHT: 100px;
324
	TOP: -40px;
332
	TOP: -40px;
325
	LEFT: -30px;
333
	LEFT: -30px;
326
}
334
}
327
.box_menu_courte, .box_menu_large, #logon , #contenu_acces, #acces_controle, #cadre_titre {
335
.box_menu_courte, .box_menu_large, #logon , #contenu_acces, #acces_controle, #cadre_titre {
328
/* Arrondi CSS3 Firefox*/
336
/* Arrondi CSS3 Firefox*/
329
	-moz-border-radius: 10px;
337
	-moz-border-radius: 10px;
330
/* Arrondi CSS3 Autres Nav*/
338
/* Arrondi CSS3 Autres Nav*/
331
	border-radius: 10px;
339
	border-radius: 10px;
332
}
340
}
333
#liens_redir {
341
#liens_redir {
334
	POSITION: relative;
342
	POSITION: relative;
335
	BOTTOM: -100px;
343
	BOTTOM: -100px;
336
	LEFT: 90px;
344
	LEFT: 90px;
337
	TEXT-ALIGN: center;
345
	TEXT-ALIGN: center;
338
}
346
}
339
#liens_redir P A {
347
#liens_redir P A {
340
	FONT-SIZE: 12px;
348
	FONT-SIZE: 12px;
341
	TEXT-ALIGN: center;
349
	TEXT-ALIGN: center;
342
	MARGIN: 15px;
350
	MARGIN: 15px;
343
}
351
}
344
 
352