Subversion Repositories ALCASAR

Rev

Details | Last modification | View Log

Rev Author Line No. Line
2809 rexy 1 
 
2 
/*
3 
	CSS for ALCASAR interception page
4 
	Auteur : Stéphane ERARD
5 
	Licence : GNU GPL
6 
*/
7 
 
8 
 
9 
/* règles générales */
10 
 
11 
/* Couleurs de polices */
12 
:link, :visited, :hover:link, :hover:visited, H2, #box_url, #box_refuse {
13 
	color: #000000;
14 
}
15 
BODY, H, #boite-logon {
16 
	color: #666666;
17 
}
18 
#acces_controle, .log_out {
19 
	color: white;
20 
}
21 
 
22 
/* Style de police */
23 
 
24 
BODY, :link, :visited, :hover:link, :hover:visited  {
25 
	font-family: "DejaVu Sans";
26 
}
27 
INPUT, #box_url {
28 
	font-family: arial;
29 
}
30 
#acces_controle, #box_url, #cadre_titre SPAN {
31 
	font-weight: bold;
32 
}
33 
.box_menu :link , .box_menu :visited, .box_menu :hover:link, .box_menu :hover:visited  {
34 
	text-decoration: none;
35 
}
36 
/*Couleurs de fond */
37 
 
38 
BODY {
39 
	background-color: #666666;
40 
}
41 
 
42 
INPUT, #contenu_acces, #contenu_error, #logon, #auth_reussi {
43 
	background-color: #ffffff;
44 
}
45 
 
46 
/* Règles des balises HTML */
47 
 
48 
H1, H2, #aide-certif {
49 
	text-align: center;
50 
	padding: 0px;
51 
	margin: 3px;
52 
}
53 
P, UL, LI{
54 
	text-align: justify;
55 
}
56 
 
57 
BODY {
58 
	background-image: url(/images/fond.png);
59 
	background-repeat: repeat-x;
60 
	text-align: center;
61 
	font-size: 12px;
62 
	margin: 0px;
63 
}
64 
H1 {
65 
	font-size: 55px;
66 
}
67 
H2 {
68 
	font-size: 30px;
69 
}
70 
H6, #aide-certif{
71 
	font-size: 100%;
72 
}
73 
UL {
74 
	margin: 5px;
75 
	padding-bottom: 5px;
76 
	padding-left: 10px;
77 
	padding-right: 115px;
78 
	padding-top: 5px;
79 
}
80 
LI {
81 
	list-style-type: square;
82 
	padding-top: 2px;
83 
}
84 
TABLE {
85 
	font-size: 90%;
86 
}
87 
IMG {
88 
	height: 150px;
89 
}
90 
INPUT {
91 
	border: #666666 1px solid;
92 
	padding: 2px;
93 
	font-family: arial;
94 
	height: 22px;
95 
}
96 
 
97 
/* taille et position des logos */
98 
#logo-alcasar {
99 
	position: absolute;
100 
	bottom: 25px;
101 
	right: 5px;
102 
	height: 130px;
103 
}
104 
#logo-organ {
105 
	position: relative;
106 
	top: 0px;
107 
	right: -10px;
108 
	max-width: 150px;
109 
	max-height: 150px;
110 
}
111 
 
112 
/* placement et proportion de la boite de saisie et de l'aide */
113 
/* pour desktop */
114 
.mobile-only {
115 
	display: none;
116 
}
117 
#logon {
118 
	position: relative;
119 
	width: 620px;
120 
	top: 20px;
121 
/* ombrage css3*/
122 
	-moz-box-shadow: 0px 0px 12px #000;
123 
	-webkit-box-shadow: 0px 0px 12px #000;
124 
	box-shadow: 0px 0px 12px #000;
125 
}
126 
#boite-logon {
127 
	background-image: linear-gradient(#efefef, #d5d5d5);
128 
	padding: 10px;
129 
	width: 420px;
130 
	height: 189px;
131 
}
132 
#boite-logon TD {
133 
	padding-top: 10px;
134 
	padding-left: 30px;
135 
}
136 
#boite-info {
137 
	border: 0px;
138 
	margin-top: 25px;
139 
	width: 580px;
140 
	padding-top: 10px;
141 
}
142 
#username_input,
143 
#password_input {
144 
	align: left;
145 
}
146 
/* hide placeholders for desktops */
147 
::-webkit-input-placeholder {
148 
/* WebKit browsers */
149 
	color: transparent;
150 
}
151 
:-moz-placeholder {
152 
/* Mozilla Firefox 4 to 18 */
153 
	color: transparent;
154 
}
155 
::-moz-placeholder {
156 
/* Mozilla Firefox 19+ */
157 
	color: transparent;
158 
}
159 
:-ms-input-placeholder {
160 
/* Internet Explorer 10+ */
161 
	color: transparent;
162 
}
163 
input::placeholder {
164 
	color: transparent;
165 
}
166 
textarea::-webkit-input-placeholder {
167 
/* WebKit browsers */
168 
	color: transparent;
169 
}
170 
textarea:-moz-placeholder {
171 
/* Mozilla Firefox 4 to 18 */
172 
	color: transparent;
173 
}
174 
textarea::-moz-placeholder {
175 
/* Mozilla Firefox 19+ */
176 
	color: transparent;
177 
}
178 
textarea:-ms-input-placeholder {
179 
/* Internet Explorer 10+ */
180 
	color: transparent;
181 
}
182 
textarea::placeholder {
183 
	color: transparent;
184 
}
185 
/* pour mobile */
186 
@media (max-width: 900px)
187 
{
188 
	.desktop-only {
189 
		display: none;
190 
	}
191 
 
192 
	#logon {
193 
		position: relative;
194 
		width: 100%;
195 
		top: 10px;
196 
	/* ombrage css3*/
197 
		-moz-box-shadow: 0px 0px 12px #000;
198 
		-webkit-box-shadow: 0px 0px 12px #000;
199 
		box-shadow: 0px 0px 12px #000;
200 
	}
201 
	#boite-logon {
202 
		background-image: linear-gradient(#efefef, #d5d5d5);
203 
		padding: 10px;
204 
		width: 90%;
205 
		height: 189px;
206 
	}
207 
	#boite-logon TD {
208 
		padding-top: 10px;
209 
	}
210 
	input[type="text"]
211 
	{
212 
	    font-size:30px;
213 
	    color: grey;
214 
	}
215 
	input[type="password"]
216 
	{
217 
	    font-size:30px;
218 
	    color: grey;
219 
	}
220 
	#boite-logon INPUT {
221 
		border: #666666 1px solid;
222 
		padding: 2px;
223 
		font-family: arial;
224 
		height: 30px;
225 
	}
226 
	#authenticate-button {
227 
		font-size: 30px;
228 
	}
229 
	#boite-info {
230 
		border: 0px;
231 
		margin-top: 25px;
232 
		width: 580px;
233 
		padding-top: 10px;
234 
	}
235 
	#username_input,
236 
	#password_input {
237 
		align: center;
238 
	}
239 
 
240 
	/* Placeholders */
241 
	::-webkit-input-placeholder {
242 
	/* WebKit browsers */
243 
	 color: lightgrey;
244 
	}
245 
	:-moz-placeholder {
246 
	/* Mozilla Firefox 4 to 18 */
247 
		color: lightgrey;
248 
	}
249 
	::-moz-placeholder {
250 
	/* Mozilla Firefox 19+ */
251 
		color: lightgrey;
252 
	}
253 
	:-ms-input-placeholder {
254 
	/* Internet Explorer 10+ */
255 
		color: lightgrey;
256 
	}
257 
	input::placeholder {
258 
		color: lightgrey;
259 
	}
260 
	textarea::-webkit-input-placeholder {
261 
	/* WebKit browsers */
262 
		color: lightgrey;
263 
	}
264 
	textarea:-moz-placeholder {
265 
	/* Mozilla Firefox 4 to 18 */
266 
		color: lightgrey;
267 
	}
268 
	textarea::-moz-placeholder {
269 
	/* Mozilla Firefox 19+ */
270 
		color: lightgrey;
271 
	}
272 
	textarea:-ms-input-placeholder {
273 
	/* Internet Explorer 10+ */
274 
		color: lightgrey;
275 
	}
276 
	textarea::placeholder {
277 
		color: lightgrey;
278 
	}
279 
}
280 
/*boite de dialogue de deconnection*/
281 
/* pour desktop */
282 
.mobile-only {
283 
	display: none;
284 
}
285 
#contenu_acces {
286 
	position: relative;
287 
	width: 640px;
288 
	height: 400px;
289 
	top: -20px;
290 
	padding-top: 0px;
291 
	margin-left: auto;
292 
	margin-right: auto;
293 
	z-index: 1;
294 
 
295 
/* ombrage CSS3 */
296 
 
297 
	-moz-box-shadow: 1px 1px 10px #000;
298 
	-webkit-box-shadow: 1px 1px 10px #000;
299 
	box-shadow: 1px 1px 10px #000;
300 
}
301 
#cadre_titre{
302 
	position: relative;
303 
	width: 730px;
304 
	height: 98px;
305 
	margin-top: 40px;
306 
	margin-left: auto;
307 
	margin-right: auto;
308 
	z-index: 2;
309 
 
310 
/* ombrage css3 */
311 
 
312 
	-moz-box-shadow: 1px 4px 10px #000;
313 
	-webkit-box-shadow: 1px 4px 10px #000;
314 
	box-shadow: 1px 4px 10px #000;
315 
}
316 
#boite_logo{
317 
	position: absolute;
318 
	top: -30px;
319 
	left: -50px;
320 
	width: 150px;
321 
	height: 150px;
322 
	z-index: 2;
323 
}
324 
/* pour mobile */
325 
@media (max-width: 900px)
326 
{
327 
	.desktop-only {
328 
		display: none;
329 
	}
330 
	.mobile-only {
331 
		display: inline;
332 
	}
333 
	#contenu_acces {
334 
		position: relative;
335 
		width: 90%;
336 
		height: 400px;
337 
		top: -20px;
338 
		padding-top: 0px;
339 
		margin-left: auto;
340 
		margin-right: auto;
341 
		z-index: 1;
342 
 
343 
	/* ombrage CSS3 */
344 
 
345 
		-moz-box-shadow: 1px 1px 10px #000;
346 
		-webkit-box-shadow: 1px 1px 10px #000;
347 
		box-shadow: 1px 1px 10px #000;
348 
	}
349 
	#cadre_titre{
350 
		position: relative;
351 
		width: 100%;
352 
		height: 98px;
353 
		margin-top: 40px;
354 
		margin-left: auto;
355 
		margin-right: auto;
356 
		z-index: 2;
357 
 
358 
	/* ombrage css3 */
359 
 
360 
		-moz-box-shadow: 1px 4px 10px #000;
361 
		-webkit-box-shadow: 1px 4px 10px #000;
362 
		box-shadow: 1px 4px 10px #000;
363 
	}
364 
	#boite_logo{
365 
		position: absolute;
366 
		top: -30px;
367 
		left: -10px;
368 
		width: 150px;
369 
		height: 150px;
370 
		z-index: 2;
371 
	}
372 
}
373 
 
374 
#auth_reussi {
375 
	width: 450px;
376 
	margin-top: 12px;
377 
	padding-top: 5px;
378 
	padding-left: 10px;
379 
	padding-right: 10px;
380 
	padding-bottom: 0px;
381 
}
382 
.text_auth {
383 
	font-size: 20px;
384 
}
385 
.lien_deco {
386 
	text-align: center;
387 
	font-size: 18px;
388 
	margin-bottom: 15px;
389 
}
390 
.log_out {
391 
	font-size: 24px;
392 
	text-align: center;
393 
	margin-top: 30px;
394 
}
395 
#boite-logon, #auth_reussi, #logon {
396 
	border: 1px #efefef solid;
397 
 
398 
/* ombrage css3*/
399 
 
400 
	-moz-box-shadow: 0px 0px 6px #000;
401 
	-webkit-box-shadow: 0px 0px 6px #000;
402 
	box-shadow: 0px 0px 6px #000;
403 
}
404 
#liens_redir {
405 
	position: relative;
406 
	bottom: -100px;
407 
	left: 90px;
408 
	text-align: center;
409 
}
410 
#liens_redir P A {
411 
	font-size: 12px;
412 
	text-align: center;
413 
	margin: 15px;
414 
}
415 
/* style de la page accès controlé*/
416 
 
417 
#cadre_titre .titre_controle {
418 
	background-image: url(/images/fond-bandeau.png);
419 
	background-repeat: repeat-x;
420 
}
421 
#cadre_titre .titre_refus  {
422 
	background-image: url(/images/fond-bandeau-rouge.png);
423 
	background-repeat: repeat-x;
424 
}
425 
#acces_controle {
426 
	text-align: center;
427 
	font-size: 40px;
428 
	padding-top: 25px;
429 
	padding-bottom: 27px;
430 
	margin: 0px;
431 
}
432 
#logo_acces {
433 
	position: relative;
434 
	top: 0px;
435 
	left: 0px;
436 
}
437 
#contenu_error {
438 
	position: relative;
439 
	width: 640px;
440 
	height: auto;
441 
	top: -20px;
442 
	padding-top: 40px;
443 
	padding-bottom: 40px;
444 
	padding-left: 40px;
445 
	padding-right: 40px;
446 
	margin-left: auto;
447 
	margin-right: auto;
448 
	z-index: 1;
449 
 
450 
/* ombrage CSS3 */
451 
 
452 
	-moz-box-shadow: 1px 1px 10px #000;
453 
	-webkit-box-shadow: 1px 1px 10px #000;
454 
	box-shadow: 1px 1px 10px #000;
455 
}
456 
 
457 
#logo_acces IMG, #box_refuse IMG {
458 
	width: 95px;
459 
	height: 95px;
460 
}
461 
 
462 
/* Boite des liens*/
463 
 
464 
#box_url {
465 
	position: relative;
466 
	top: 35px;
467 
	text-align: right;
468 
	font-size: 14px;
469 
	margin-right: 20px;
470 
}
471 
#cadre_titre SPAN {
472 
	position: absolute;
473 
	top: 70px;
474 
	width: 510px;
475 
	left: 110px;
476 
	font-size: 14px;
477 
	color: red;
478 
	text-align: center;
479 
	border: 2px red solid;
480 
	padding: 2px;
481 
	background-color: white;
482 
}
483 
#contenu_acces SPAN {
484 
	position: relative;
485 
	bottom: -150px;
486 
	font-family: "courier new";
487 
}
488 
#contenu_error SPAN {
489 
	position: relative;
490 
	bottom: -150px;
491 
	font-family: "courier new";
492 
}
493 
#box_refuse {
494 
	font-size: 16px;
495 
	margin-left: 130px;
496 
	margin-right: 20px;
497 
	margin-top: 40px;
498 
	width: 460px;
499 
}
500 
#box_refuse IMG {
501 
	position: absolute;
502 
	top: -10px;
503 
	left: -110px;
504 
}
505 
#box_refuse {
506 
	position: relative;
507 
	top: 55px;
508 
}
509 
 
510 
.box_menu IMG {
511 
	position: absolute;
512 
	width: 70px;
513 
	height: 70px;
514 
	top: -25px;
515 
}
516 
.box_menu, #logon , #contenu_acces, #contenu_error, #acces_controle, #cadre_titre, #box_info{
517 
/* Arrondi CSS3 Firefox*/
518 
	-moz-border-radius: 10px;
519 
/* Arrondi CSS3 Autres Nav*/
520 
	border-radius: 10px;
521 
}
522 
.box_menu {
523 
	position: absolute;
524 
	height: 35px;
525 
	width: 310px;
526 
	background-image: url(/images/fond-bdd.png);
527 
	background-repeat: repeat-x;
528 
 
529 
/* ombrage CSS3 */
530 
	-moz-box-shadow: 1px 1px 6px #666;
531 
	-webkit-box-shadow: 1px 1px 6px #666;
532 
	box-shadow: 1px 1px 6px #666;
533 
}
534 
.div-cache {
535 
	visibility: hidden;
536 
	position: absolute;
537 
	top: -1000px;
538 
}
539 
#box_conn {
540 
	top: 120px;
541 
}
542 
#box_certif {
543 
	top: 190px;
544 
}
545 
#box_mdp {
546 
	top: 260px;
547 
}
548 
#box_acc {
549 
	top: 330px;
550 
}
551 
#box_certif, #box_acc {
552 
	left: 60px;
553 
	text-align: right;
554 
}
555 
#box_conn, #box_mdp {
556 
	left: 20px;
557 
	text-align: left;
558 
}
559 
#box_conn IMG, #box_mdp IMG {
560 
	left: 5px;
561 
}
562 
#box_certif IMG, #box_acc IMG {
563 
	right: 5px;
564 
}
565 
#box_conn SPAN, #box_certif SPAN, #box_mdp SPAN, #box_acc SPAN {
566 
	position: relative;
567 
	font-size: 12px;
568 
	font-weight: bold;
569 
	top: 10px;
570 
}
571 
#box_conn SPAN, #box_mdp SPAN {
572 
	margin-left: 80px;
573 
}
574 
#box_certif SPAN, #box_acc SPAN {
575 
	margin-right: 80px;
576 
}
577 
 
578 
/*Animation visuel des cadres liens (Gecko et ie9)*/
579 
#box_conn:hover, #box_certif:hover, #box_mdp:hover, #box_acc:hover  {
580 
/*	cursor: pointer;*/
581 
	background-image: url(/images/fond-bdd_rouge.png);
582 
	background-repeat: repeat-x;
583 
 
584 
/* ombrage CSS3 */
585 
	-moz-box-shadow: 0px 0px 0px #fff;
586 
	-webkit-box-shadow: 0px 0px 0px #fff;
587 
	box-shadow: 0px 0px 0px #fff;
588 
}
589 
#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 {
590 
	color: red;
591 
}
592 
 
593 
/* overwrite default rules for disabled menu boxes */
594 
.box_menu.box-menu-disabled {
595 
	opacity: .2;
596 
}
597 
.box_menu.box-menu-disabled:hover a {
598 
	color: #000000 !important;
599 
	cursor: not-allowed !important;
600 
}
601 
.box_menu.box-menu-disabled:hover {
602 
	cursor: not-allowed !important;
603 
	background-image: url(/images/fond-bdd.png) !important;
604 
	background-repeat: repeat-x !important;
605 
 
606 
/* ombrage CSS3 */
607 
	-moz-box-shadow: 1px 1px 6px #666 !important;
608 
	-webkit-box-shadow: 1px 1px 6px #666 !important;
609 
	box-shadow: 1px 1px 6px #666 !important;
610 
}
611 
 
612 
/*Mise en page de la bulle d'info (coté droit)*/
613 
#box_info H2 {
614 
	font-size: 14px;
615 
	margin: 10px auto;
616 
}
617 
#box_info P {
618 
	font-size: 11px;
619 
	margin: 10px;
620 
}
621 
#box_info IMG {
622 
	position: absolute;
623 
	bottom: -60px;
624 
	right: 10px;
625 
	height: 120px;
626 
}
627 
#box_info {
628 
	position: absolute;
629 
	top: 118px;
630 
	right: 20px;
631 
	width: 230px;
632 
	height: 250px;
633 
	background-color: #efefef;
634 
 
635 
/* ombrage CSS3 */
636 
	-moz-box-shadow: 1px 1px 6px #666;
637 
	-webkit-box-shadow: 1px 1px 6px #666;
638 
	box-shadow: 1px 1px 6px #666;
639 
}
640 
#box_info :link, #box_info :visited  {
641 
	text-decoration: none;
642 
}
643 
#box_info UL{
644 
	text-align: left;
645 
	padding : 0 0 0 15px;
646 
	margin : 10px;
647 
}
648 
#box_info LI{
649 
	text-align: left;
650 
	font-size: 10px;
651 
	list-style-type : disc;
652 
	padding : 0 0 0 0;
653 
}
654 
#authorized_domain{
655 
	height: 40px;
656 
	width: 450px;
657 
	text-align: left;
658 
	display: block;
659 
/*	border: 1px solid red;*/
660 
	margin-right: 50px;
661 
}
662 
#authorized_domain LI{
663 
	text-align: center;
664 
	list-style-type : none;
665 
	margin-right : 10px;
666 
	display: block;
667 
	float: left;
668 
}
669 
 
670 
#corner {
671 
	position: fixed;
672 
	bottom: 0;
673 
	right: 0;
674 
 
675 
}
676 
 
677 
#adm {
678 
	display: block;
679 
	width: 100px;
680 
	height: 100px;
681 
}
682 
.corn IMG:hover {
683 
	position: absolute;
684 
	width: 100px;
685 
	height: 100px;
686 
	top: 0px;
687 
	left: 0px;
688 
}
689 
 
690 
.corn IMG {
691 
	position: absolute;
692 
	width: 50px;
693 
	height: 50px;
694 
	top: 75px;
695 
	left: 75px;
696 
	transition: .2s;
697 
}