Subversion Repositories ALCASAR

Rev

Rev 369 | Go to most recent revision | Show entire file | Ignore whitespace | Details | Blame | Last modification | View Log

Rev 369 Rev 509
Line 1... Line 1...
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
}
-
 
33
.box_menu :link , .box_menu :visited, .box_menu :hover:link, .box_menu :hover:visited  {
-
 
34
	text-decoration: none;
32
}
35
}
33
 
-
 
34
/*Couleurs de fond */
36
/*Couleurs de fond */
35
 
37
 
36
BODY {
38
BODY {
37
	BACKGROUND-COLOR: #666666;
39
	background-color: #666666;
38
}
40
}
39
 
41
 
40
INPUT, #contenu_acces, #logon, #auth_reussi {
42
INPUT, #contenu_acces, #logon, #auth_reussi {
41
	BACKGROUND-COLOR: #ffffff;
43
	background-color: #ffffff;
42
}
44
}
43
 
45
 
44
/* Règles des balises HTML */
46
/* R�gles des balises HTML */
45
 
47
 
46
H1, H2, #aide-certif {
48
H1, H2, #aide-certif {
47
	TEXT-ALIGN: center;	
49
	text-align: center;	
48
	padding: 0px;
50
	padding: 0px;
49
	margin: 3px;
51
	margin: 3px;
50
}
52
}
51
P, UL, LI{
53
P, UL, LI{
52
	TEXT-ALIGN: justify;
54
	text-align: justify;
53
}
55
}
54
 
56
 
55
BODY {
57
BODY {
56
	BACKGROUND-IMAGE: url(/images/fond.png);
58
	background-image: url(../images/fond.png);
57
	BACKGROUND-REPEAT: repeat-x;
59
	background-repeat: repeat-x;
58
	TEXT-ALIGN: center;
60
	text-align: center;
59
	FONT-SIZE: 12px;
61
	font-size: 12px;
60
	MARGIN: 0px;
62
	margin: 0px;
61
}
63
}
62
H1 {
64
H1 {
63
	FONT-SIZE: 55px;
65
	font-size: 55px;
64
}
66
}
65
H2 {
67
H2 {
66
	FONT-SIZE: 30px;
68
	font-size: 30px;
67
}
69
}
68
H6, #aide-certif{
70
H6, #aide-certif{
69
	FONT-SIZE: 100%;
71
	font-size: 100%;
70
}
72
}
71
UL {
73
UL {
72
	MARGIN: 5px;
74
	margin: 5px;
73
	PADDING-BOTTOM: 5px;
75
	padding-bottom: 5px;
74
	PADDING-LEFT: 10px;
76
	padding-left: 10px;
75
	PADDING-RIGHT: 115px;
77
	padding-right: 115px;
76
	PADDING-TOP: 5px;
78
	padding-top: 5px;
77
}
79
}
78
LI {
80
LI {
79
	LIST-STYLE-TYPE: square;
81
	list-style-type: square;
80
	PADDING-TOP: 2px;
82
	padding-top: 2px;
81
}
83
}
82
TABLE {
84
TABLE {
83
	FONT-SIZE: 90%;
85
	font-size: 90%;
84
}
86
}
85
IMG {
87
IMG {
86
	HEIGHT: 150px;
88
	height: 150px;
87
}
89
}
88
INPUT {
90
INPUT {
89
	BORDER: #666666 1px solid;
91
	border: #666666 1px solid;
90
	PADDING: 2px;
92
	padding: 2px;
91
	FONT-FAMILY: Arial;
93
	font-family: arial;
92
	HEIGHT: 22px;
94
	height: 22px;
93
}
95
}
94
 
96
 
95
/* Taille et position des logos */
97
/* taille et position des logos */
96
 
98
 
97
#logo-alcasar {
99
#logo-alcasar {
98
	POSITION: absolute;
100
	position: absolute;
99
	BOTTOM: 25px;
101
	bottom: 25px;
100
	RIGHT: 5px;
102
	right: 5px;
101
	HEIGHT: 130px;
103
	height: 130px;
102
}
104
}
103
#logo-organ {
105
#logo-organ {
104
	POSITION: relative;
106
	position: relative;
105
	TOP: 0px;
107
	top: 0px;
106
	RIGHT: -10px;
108
	right: -10px;
107
	MAX-WIDTH: 150px;
109
	max-width: 150px;
108
	MAX-HEIGHT: 150px;
110
	max-height: 150px;
109
}
111
}
110
 
112
 
111
/* Placement et proportion de la boite de saisie et de l'aide */
113
/* placement et proportion de la boite de saisie et de l'aide */
112
 
114
 
113
#logon {
115
#logon {
114
	POSITION: relative;
116
	position: relative;
115
	WIDTH: 620px;
117
	width: 620px;
116
	TOP: 20px;
118
	top: 20px;
117
 
119
 
118
 
120
 
119
/* ombrage CSS3*/	
121
/* ombrage css3*/	
120
 
122
 
121
	-moz-box-shadow: 0px 0px 12px #000; 
123
	-moz-box-shadow: 0px 0px 12px #000; 
122
	-webkit-box-shadow: 0px 0px 12px #000;
124
	-webkit-box-shadow: 0px 0px 12px #000;
123
	box-shadow: 0px 0px 12px #000;
125
	box-shadow: 0px 0px 12px #000;
124
}
126
}
125
 
127
 
126
#boite-logon {
128
#boite-logon {
127
	BACKGROUND-IMAGE: url(/images/fond-bdd.png);
129
	background-image: url(../images/fond-bdd_grand.png);
128
	BACKGROUND-REPEAT: repeat-x;
130
	background-repeat: repeat-x;
129
	PADDING: 10px;
131
	padding: 10px;
130
	WIDTH: 420px;
132
	width: 420px;
131
	HEIGHT: 189px;
133
	height: 189px;
132
}
134
}
133
#boite-logon TD {
135
#boite-logon TD {
134
	PADDING-TOP: 10px;
136
	padding-top: 10px;
135
}
137
}
136
#boite-info {
138
#boite-info {
137
	BORDER: 0px;
139
	border: 0px;
138
	MARGIN-TOP: 25px;
140
	margin-top: 25px;
139
	WIDTH: 580px;
141
	width: 580px;
140
	PADDING-TOP: 10px;
142
	padding-top: 10px;
141
}
143
}
142
/*Boite de dialogue de deconnection*/
144
/*boite de dialogue de deconnection*/
143
 
145
 
144
#auth_reussi {
146
#auth_reussi {
145
	WIDTH: 450px;
147
	width: 450px;
146
	MARGIN-TOP: 12px;
148
	margin-top: 12px;
147
	PADDING-TOP: 5px;
149
	padding-top: 5px;
148
	PADDING-LEFT: 10px;
150
	padding-left: 10px;
149
	PADDING-RIGHT: 10px;
151
	padding-right: 10px;
150
	PADDING-BOTTOM: 0px;
152
	padding-bottom: 0px;
151
}
153
}
152
.text_auth {
154
.text_auth {
153
	FONT-SIZE: 20px;
155
	font-size: 20px;
154
}
156
}
155
.lien_deco {
157
.lien_deco {
156
	TEXT-ALIGN: center;
158
	text-align: center;
157
	FONT-SIZE: 18px;
159
	font-size: 18px;
158
	MARGIN-BOTTOM: 15px;
160
	margin-bottom: 15px;
159
}
161
}
160
.log_out {
162
.log_out {
161
	FONT-SIZE: 24px;
163
	font-size: 24px;
162
	TEXT-ALIGN: center;
164
	text-align: center;
163
	MARGIN-TOP: 30px;
165
	margin-top: 30px;
164
}
166
}
165
#boite-logon, #auth_reussi, #logon {
167
#boite-logon, #auth_reussi, #logon {
166
	BORDER: 1px #efefef solid;
168
	border: 1px #efefef solid;
167
 
169
 
168
/* ombrage css3*/
170
/* ombrage css3*/
169
 
171
 
170
	-moz-box-shadow: 0px 0px 6px #000; 
172
	-moz-box-shadow: 0px 0px 6px #000; 
171
	-webkit-box-shadow: 0px 0px 6px #000;
173
	-webkit-box-shadow: 0px 0px 6px #000;
172
	box-shadow: 0px 0px 6px #000;
174
	box-shadow: 0px 0px 6px #000;
173
}
175
}
-
 
176
#liens_redir {
-
 
177
	position: relative;
-
 
178
	bottom: -100px;
-
 
179
	left: 90px;
-
 
180
	text-align: center;
174
 
181
}
-
 
182
#liens_redir P A {
-
 
183
	font-size: 12px;
-
 
184
	text-align: center;
-
 
185
	margin: 15px;
-
 
186
}
175
/* style de la page accès contrôlé*/
187
/* style de la page accès controlé*/
176
 
188
 
177
#cadre_titre{
189
#cadre_titre{
178
	POSITION: relative;
190
	position: relative;
179
	WIDTH: 730px;
191
	width: 730px;
180
	HEIGHT: 98px;
192
	height: 98px;
181
	MARGIN-TOP: 40px;
193
	margin-top: 40px;
182
	MARGIN-LEFT: auto;
194
	margin-left: auto;
183
	MARGIN-RIGHT: auto;
195
	margin-right: auto;
184
	Z-INDEX: 2;
196
	z-index: 2;
185
 
197
 
186
/* ombrage css3 */
198
/* ombrage css3 */
187
 
199
 
188
	-moz-box-shadow: 1px 4px 10px #000; 
200
	-moz-box-shadow: 1px 4px 10px #000; 
189
	-webkit-box-shadow: 1px 4px 10px #000;
201
	-webkit-box-shadow: 1px 4px 10px #000;
190
	box-shadow: 1px 4px 10px #000;
202
	box-shadow: 1px 4px 10px #000;
191
}
203
}
192
#cadre_titre .titre_controle {
204
#cadre_titre .titre_controle {
193
	BACKGROUND-IMAGE: url(/images/fond-bandeau.png);
205
	background-image: url(../images/fond-bandeau.png);
194
	BACKGROUND-REPEAT: repeat-x;
206
	background-repeat: repeat-x;
195
}
207
}
196
#cadre_titre .titre_refus  {
208
#cadre_titre .titre_refus  {
197
	BACKGROUND-IMAGE: url(/images/fond-bandeau-rouge.png);
209
	background-image: url(../images/fond-bandeau-rouge.png);
198
	BACKGROUND-REPEAT: repeat-x;
210
	background-repeat: repeat-x;
199
}
211
}
200
#boite_logo{
212
#boite_logo{
201
	POSITION: absolute;
213
	position: absolute;
202
	TOP: -30px;
214
	top: -30px;
203
	LEFT: -30px;
215
	left: -50px;
204
	WIDTH: 150px;
216
	width: 150px;
205
	HEIGHT: 150px;
217
	height: 150px;
206
	Z-INDEX: 2;
218
	z-index: 2;
207
}
219
}
208
#acces_controle {
220
#acces_controle {
209
	TEXT-ALIGN: center;
221
	text-align: center;
210
	FONT-SIZE: 40px;
222
	font-size: 40px;
211
	PADDING-TOP: 25px;
223
	padding-top: 25px;
212
	PADDING-BOTTOM: 27px;
224
	padding-bottom: 27px;
213
	MARGIN: 0px;
225
	margin: 0px;
214
}
226
}
215
#logo_acces {
227
#logo_acces {
216
	POSITION: relative;
228
	position: relative;
217
	TOP: 0px;
229
	top: 0px;
218
	LEFT: 0px;
230
	left: 0px;
219
}
231
}
220
#contenu_acces {
232
#contenu_acces {
221
	POSITION: relative;
233
	position: relative;
222
	WIDTH: 640px;
234
	width: 640px;
223
	HEIGHT: 400px;
235
	height: 400px;
224
	TOP: -20px;
236
	top: -20px;
225
	PADDING-TOP: 0px;
237
	padding-top: 0px;
226
	MARGIN-LEFT: auto;
238
	margin-left: auto;
227
	MARGIN-RIGHT: auto;
239
	margin-right: auto;
228
	Z-INDEX: 1;
240
	z-index: 1;
229
 
241
 
230
/* ombrage CSS3 */
242
/* ombrage CSS3 */
231
 
243
 
232
	-moz-box-shadow: 1px 1px 10px #000; 
244
	-moz-box-shadow: 1px 1px 10px #000; 
233
	-webkit-box-shadow: 1px 1px 10px #000;
245
	-webkit-box-shadow: 1px 1px 10px #000;
234
	box-shadow: 1px 1px 10px #000;
246
	box-shadow: 1px 1px 10px #000;
235
}
247
}
236
#logo_acces IMG, #box_refuse IMG {
248
#logo_acces IMG, #box_refuse IMG {
237
	WIDTH: 95px;
249
	width: 95px;
238
	HEIGHT: 95px;
250
	height: 95px;
239
}
251
}
240
 
252
 
241
/* Boite des liens*/
253
/* Boite des liens*/
242
 
254
 
243
#box_url {
255
#box_url {
244
	POSITION: relative;
256
	position: relative;
245
	TOP: 35px;
257
	top: 35px;
246
	TEXT-ALIGN: right;
258
	text-align: right;
247
	FONT-SIZE: 14px;
259
	font-size: 14px;
248
	MARGIN-RIGHT: 20px;
260
	margin-right: 20px;
249
}
261
}
250
#box_bienvenue {
262
#box_bienvenue {
251
	FONT-SIZE: 18px;
263
	font-size: 18px;
252
}
264
}
253
#cadre_titre SPAN {
265
#cadre_titre SPAN {
254
	POSITION: absolute;
266
	position: absolute;
255
	TOP: 70px;
267
	top: 70px;
256
	WIDTH: 510px;
268
	width: 510px;
257
	LEFT: 110px;
269
	left: 110px;
258
	FONT-SIZE: 14px;
270
	font-size: 14px;
259
	COLOR: red;
271
	color: red;
260
	TEXT-ALIGN: center;
272
	text-align: center;
261
	BORDER: 2px red solid;
273
	border: 2px red solid;
262
	PADDING: 2px;
274
	padding: 2px;
263
	BACKGROUND-COLOR: white;
275
	background-color: white;
264
}
276
}
265
#contenu_acces SPAN {
277
#contenu_acces SPAN {
266
	POSITION: relative;
278
	position: relative;
267
	BOTTOM: -150px;
279
	bottom: -150px;
268
	FONT-FAMILY: "courier new";
280
	font-family: "courier new";
269
}
281
}
270
#box_refuse {
282
#box_refuse {
271
	FONT-SIZE: 16px;
283
	font-size: 16px;
272
	MARGIN-LEFT: 130px;
284
	margin-left: 130px;
273
	MARGIN-RIGHT: 20px;
285
	margin-right: 20px;
274
	MARGIN-TOP: 40px;
286
	margin-top: 40px;
275
	WIDTH: 460px;
287
	width: 460px;
276
}
288
}
277
#box_refuse IMG {
289
#box_refuse IMG {
278
	POSITION: absolute;
290
	position: absolute;
279
	TOP: -10px;
291
	top: -10px;
280
	LEFT: -110px;
292
	left: -110px;
281
}
293
}
282
#box_refuse, #box_bienvenue {
294
#box_refuse, #box_bienvenue {
283
	POSITION: relative;
295
	position: relative;
284
	TOP: 55px;
296
	top: 55px;
285
}
297
}
-
 
298
 
286
#box_1 {
299
.box_menu IMG {
-
 
300
	position: absolute;
287
	LEFT: 40px;
301
	width: 70px;
-
 
302
	height: 70px;
-
 
303
	top: -25px;
288
}
304
}
-
 
305
.box_menu, #logon , #contenu_acces, #acces_controle, #cadre_titre, #box_info{
-
 
306
/* Arrondi CSS3 Firefox*/
289
#box_2 {
307
	-moz-border-radius: 10px;
-
 
308
/* Arrondi CSS3 Autres Nav*/
290
	LEFT: 350px;
309
	border-radius: 10px;
291
}
310
}
292
#box_3 {
311
.box_menu {
293
	WIDTH: 575px;
-
 
294
	LEFT: 40px;
-
 
295
	BOTTOM: 20px;
-
 
296
}
-
 
297
#box_1 P, #box_2 P, #box_3 P {
-
 
298
	MARGIN-LEFT: 80px;
-
 
299
	MARGIN-RIGHT: 25px;
-
 
300
	MARGIN-TOP: 8px;
-
 
301
	FONT-SIZE: 10px;
-
 
302
}
-
 
303
#box_1 SPAN, #box_2 SPAN, #box_3 SPAN {
-
 
304
	POSITION: relative;
312
	position: absolute;
305
	MARGIN-LEFT: 75px;
-
 
306
	MARGIN-RIGHT: 5px;
-
 
307
	FONT-SIZE: 12px;
-
 
308
	TOP: 2px;
313
	height: 35px;
309
}
-
 
310
.box_menu_courte, .box_menu_large {
-
 
311
	POSITION: absolute;
-
 
312
	HEIGHT: 80px;
314
	width: 310px;
313
	BACKGROUND-IMAGE: url(/images/fond-bdd.png);
315
	background-image: url(../images/fond-bdd.png);
314
	BACKGROUND-REPEAT: repeat-x;
316
	background-repeat: repeat-x;
315
	VERTICAL-ALIGN: bottom;
-
 
316
	TEXT-ALIGN: left;
-
 
317
	BORDER: 2px #efefef solid;
-
 
318
 
317
 
319
/* ombrage CSS3 */
318
/* ombrage CSS3 */
320
	-moz-box-shadow: 1px 1px 6px #666; 
319
	-moz-box-shadow: 1px 1px 6px #666; 
321
	-webkit-box-shadow: 1px 1px 6px #666;
320
	-webkit-box-shadow: 1px 1px 6px #666;
322
	box-shadow: 1px 1px 6px #666;
321
	box-shadow: 1px 1px 6px #666;
323
}
322
}
324
.box_menu_courte {
323
.div-cache {
325
	WIDTH: 265px;
324
	visibility: hidden;
326
	TOP: 150px;
-
 
327
}
-
 
328
.box_menu_courte IMG, .box_menu_large IMG {
-
 
329
	POSITION: absolute;
325
	position: absolute;
330
	WIDTH: 100px;
-
 
331
	HEIGHT: 100px;
-
 
332
	TOP: -40px;
326
	top: -1000px;
333
	LEFT: -30px;
-
 
334
}
327
}
335
.box_menu_courte, .box_menu_large, #logon , #contenu_acces, #acces_controle, #cadre_titre {
-
 
336
/* Arrondi CSS3 Firefox*/
328
#box_conn {
337
	-moz-border-radius: 10px;
-
 
338
/* Arrondi CSS3 Autres Nav*/
-
 
339
	border-radius: 10px;
329
	top: 120px;
340
}
330
}
341
#liens_redir {
331
#box_certif {
342
	POSITION: relative;
-
 
343
	BOTTOM: -100px;
-
 
344
	LEFT: 90px;
332
	top: 190px;
345
	TEXT-ALIGN: center;
-
 
346
}
333
}
-
 
334
#box_mdp {
-
 
335
	top: 260px;
-
 
336
}
-
 
337
#box_acc {
-
 
338
	top: 330px;
-
 
339
}
-
 
340
#box_certif, #box_acc {
-
 
341
	left: 60px;
-
 
342
	text-align: right;
-
 
343
}
347
#liens_redir P A {
344
#box_conn, #box_mdp {
-
 
345
	left: 20px;
-
 
346
	text-align: left;
-
 
347
}
-
 
348
#box_conn IMG, #box_mdp IMG {
-
 
349
	left: 5px;
-
 
350
}
-
 
351
#box_certif IMG, #box_acc IMG {
-
 
352
	right: 5px;
-
 
353
}
-
 
354
#box_conn SPAN, #box_certif SPAN, #box_mdp SPAN, #box_acc SPAN {
-
 
355
	position: relative;
348
	FONT-SIZE: 12px;
356
	font-size: 12px;
-
 
357
	font-weight: bold;
-
 
358
	top: 10px;
-
 
359
}
-
 
360
#box_conn SPAN, #box_mdp SPAN {
-
 
361
	margin-left: 80px;
-
 
362
}
-
 
363
#box_certif SPAN, #box_acc SPAN {
-
 
364
	margin-right: 80px;
-
 
365
}
-
 
366
 
-
 
367
/*Animation visuel des cadres liens (Gecko et ie9)*/
-
 
368
#box_conn:hover, #box_certif:hover, #box_mdp:hover, #box_acc:hover  {
349
	TEXT-ALIGN: center;
369
/*	cursor: pointer;*/
-
 
370
	background-image: url(../images/fond-bdd_rouge.png);
-
 
371
	background-repeat: repeat-x;
-
 
372
 
-
 
373
/* ombrage CSS3 */
-
 
374
	-moz-box-shadow: 0px 0px 0px #fff; 
-
 
375
	-webkit-box-shadow: 0px 0px 0px #fff;
-
 
376
	box-shadow: 0px 0px 0px #fff;
-
 
377
}
-
 
378
#box_conn:hover a, #box_certif:hover a, #box_mdp:hover a, #box_acc:hover a .box_menu a:hover, .box_menu a:visited:hover, #box_info :link:hover, #box_info :visited:hover {
-
 
379
	color: red;
-
 
380
 
-
 
381
}
-
 
382
 
-
 
383
/*Mise en page de la bulle d'info (coté droit)*/
-
 
384
#box_info H2 {
-
 
385
	font-size: 14px;
-
 
386
	margin: 10px auto;
-
 
387
}
-
 
388
#box_info P {
-
 
389
	font-size: 11px;
350
	MARGIN: 15px;
390
	margin: 10px;
-
 
391
}
-
 
392
#box_info IMG {
-
 
393
	position: absolute;
-
 
394
	bottom: -60px;
-
 
395
	right: 10px;
-
 
396
	height: 120px;
-
 
397
}
-
 
398
#box_info {
-
 
399
	position: absolute;
-
 
400
	top: 118px;
-
 
401
	right: 20px;
-
 
402
	width: 230px;
-
 
403
	height: 250px;
-
 
404
	background-color: #efefef;
-
 
405
	
-
 
406
/* ombrage CSS3 */
-
 
407
	-moz-box-shadow: 1px 1px 6px #666; 
-
 
408
	-webkit-box-shadow: 1px 1px 6px #666;
-
 
409
	box-shadow: 1px 1px 6px #666;
-
 
410
}
-
 
411
#box_info :link, #box_info :visited  {
-
 
412
	text-decoration: none;
351
}
413
}