Subversion Repositories Sites.obs-saisons.fr

Rev

Rev 218 | Rev 292 | Go to most recent revision | Details | Compare with Previous | Last modification | View Log | RSS feed

Rev Author Line No. Line
31 aurelien 1
/* =========================== Balises ============================
2
 
76 aurelien 3
 
4
 
210 aurelien 5
/* =========================== Style général ============================ */
31 aurelien 6
 
39 aurelien 7
#wrapper #container {
60 aurelien 8
	max-width:1650px;
39 aurelien 9
}
10
 
31 aurelien 11
.gauche {
12
	float:left;
13
}
14
 
15
.droite {
16
	float:right;
17
}
18
 
76 aurelien 19
.information {
20
 
101 aurelien 21
	padding-left:40px;
76 aurelien 22
	border:1px solid #FF420F;
23
	max-width:600px;
24
	height: 50px;
25
	text-align: center;
26
	font-size: 1.3em;
27
	color: #000000;
28
	background: url("../images/attention.png") no-repeat scroll 1em 0.5em transparent;
29
	background-color:#EF9C86;
30
}
31 aurelien 31
 
76 aurelien 32
.information div {
33
	margin-top: 15px
34
}
35
 
116 aurelien 36
span.erreur {
37
	color: red;
38
}
76 aurelien 39
 
116 aurelien 40
input.erreur {
41
	border: 1px solid red;
42
}
43
 
44
#center {
45
	width: 720px;
46
}
47
 
48
 
31 aurelien 49
/* =========================== Titres ============================ */
50
 
51
.titre_saisie {
52
	padding-bottom: 10px;
53
}
54
 
55
.etape {
56
	color: #9AC343;
57
	padding-bottom:20px;
58
}
59
 
60
 
53 aurelien 61
/* =========================== Menu et navigation ============================ */
62
 
63
#saisie_menu ul li {
64
	background: none;
65
	padding-top: 5px;
66
}
67
 
68
#saisie_menu ul li.item_menu_station {
69
	background: url("../images/station.png") no-repeat scroll 0px 0.5em transparent;
70
}
71
 
72
.item_menu_station > a {
73
	padding: 5px;
74
}
75
 
76
#saisie_menu ul li.item_menu_espece {
77
	background: url("../images/espece.png") no-repeat scroll 0px 0.5em transparent;
78
}
79
 
80
.item_menu_espece > a {
81
	padding: 5px
82
}
83
 
84
#saisie_menu ul li.station_ajout {
85
	background: url("../images/ajout.png") no-repeat scroll -9px transparent;
86
}
87
 
88
li.station_en_cours {
89
	padding-top: 10px;
90
}
91
 
92
li.station_en_cours > a {
93
	color: #FFFFFF;
94
	font-weight: bold;
95
	border: solid 1px #FFFFFF;
162 vio 96
	background-color: #BF3600;
53 aurelien 97
	-moz-border-radius: 0.9em;
110 aurelien 98
	-webkit-border-radius: 0.9em;
99
	border-radius: 0.9em;
53 aurelien 100
}
101
 
110 aurelien 102
#retour_au_site {
103
	padding-top: 30px;
104
}
105
 
53 aurelien 106
#saisie_menu ul li.espece_ajout {
107
	background: url("../images/ajout.png") no-repeat scroll -9px transparent;
108
}
109
 
110
li.espece_en_cours > a {
111
	color: #FFFFFF;
112
	font-weight: bold;
113
	border: solid 1px #FFFFFF;
114
	background-color: #9AC343;
110 aurelien 115
	-moz-border-radius: 0.9em;
116
	-webkit-border-radius: 0.9em;
117
	border-radius: 0.9em;
53 aurelien 118
}
119
 
60 aurelien 120
ul.liste_annees_observations {
121
	list-style-type: none;
122
}
123
 
124
.liste_annees_observations li {
125
	display: inline;
126
	list-style: none;
127
	background: none;
128
}
129
 
130
#annee_en_cours {
131
	font-size: 1.6em;
132
	color: #9AC343;
133
}
134
 
116 aurelien 135
#retour_au_site ul li {
136
	background: url("../images/retour.png") no-repeat scroll 0 30% transparent
137
}
31 aurelien 138
 
218 aurelien 139
.export_observation {
140
    background: url("../images/csv.png") no-repeat scroll 2px 4px transparent;
141
    padding-left: 17px;
142
    padding-top: 3px;
143
    padding-right: 6px;
144
}
76 aurelien 145
 
146
/* =========================== Formulaires d'inscription et d'identification ============================ */
147
 
148
#conteneur_formulaire_identification, #conteneur_formulaire_inscription {
149
 
150
	width:650px;
151
	border: 1px solid grey;
152
	margin-top: 10px;
153
	padding: 10px;
154
	text-align: left !important;
110 aurelien 155
	-moz-border-radius: 0.9em;
156
	-webkit-border-radius: 0.9em;
157
	border-radius: 0.9em;
76 aurelien 158
}
159
 
160
#conteneur_formulaire_identification form {
161
	text-align: left !important;
162
}
163
 
164
#conteneur_formulaire_identification input {
165
	text-align: left !important;
166
	width: 300px;
167
}
168
 
169
#conteneur_formulaire_inscription input {
170
	text-align: left !important;
171
	width: 300px;
172
}
173
 
174
.message_identification {
175
	font-weight: bold;
176
	padding-top: 5px;
177
	color: #435F06;
178
	font-size: 1.5em;
179
}
180
 
181
 
182
/* =========================== Formulaires de l'application ============================ */
183
 
101 aurelien 184
#saisie_station {
185
	width: 700px;
186
}
187
 
188
.element_formulaire label {
166 aurelien 189
	font-weight: bold;
161 vio 190
	width:150px;
101 aurelien 191
}
192
 
31 aurelien 193
.element_formulaire_en_ligne {
194
	padding-right: 10px;
195
}
196
 
60 aurelien 197
.element_formulaire, #conteneur_liens_lat_lon, #conteneur_form_liens_lat_lon {
101 aurelien 198
	padding-bottom : 15px;
31 aurelien 199
}
200
 
201
.conteneur_carte {
89 aurelien 202
	height: 400px;
203
	width: 725px;
31 aurelien 204
}
205
 
206
.gros_bouton_validation {
207
	height: 50px;
208
	width: 200px;
209
	font-size: 20px;
210
	margin-top: 10x;
210 aurelien 211
	margin-right: 0px;
31 aurelien 212
}
213
 
101 aurelien 214
#localiser_lat_lon {
215
	background: url("../images/localiser.png") no-repeat scroll 2px transparent;
216
}
217
 
31 aurelien 218
#saisie_liste_evenements {
219
	text-align: center;
89 aurelien 220
	width:715px;
31 aurelien 221
}
222
 
39 aurelien 223
#saisie_modif_evenements tr, #saisie_liste_evenements tr {
31 aurelien 224
	height: 40px;
225
}
226
 
39 aurelien 227
.icone_s {
228
	height: 30px;
229
	width: 30px;
230
}
31 aurelien 231
 
210 aurelien 232
.formulaire_en_ligne {
233
  display: inline;
234
}
235
 
53 aurelien 236
.valider_formulaire {
237
	cursor: pointer;
238
	background-color: transparent;
239
	background-image: url("../images/valider_s.png");
240
	border: none;
241
	color: rgba(0,0,0,0);
242
	background-position: center;
243
	background-repeat: no-repeat;
60 aurelien 244
	padding-top: 2px;
245
	padding-bottom: 3px;
53 aurelien 246
}
39 aurelien 247
 
53 aurelien 248
.valider_formulaire:hover, .lien_modifier:hover {
249
	background-color: #CFCFCF;
250
}
251
 
89 aurelien 252
#form_saisie_espece {
253
	margin-right: auto;
254
	margin-left: auto;
255
}
256
 
53 aurelien 257
.formulaire_informations_espece_mini {
60 aurelien 258
	text-align: center;
166 aurelien 259
	height:50px;
53 aurelien 260
	width: 500px;
261
	border: solid 1px #999999;
262
	background-color: #CFCFCF;
263
	padding: 10px;
264
	margin-bottom: 10px;
110 aurelien 265
	-moz-border-radius: 0.9em;
266
	-webkit-border-radius: 0.9em;
267
	border-radius: 0.9em;
53 aurelien 268
}
269
 
270
.formulaire_informations_espece_mini:hover {
271
	background-color: #C0DF7D;
272
}
273
 
274
.formulaire_informations_espece_mini img {
275
	margin-top:-5px;
276
}
277
 
210 aurelien 278
#form_afficher_modification {
279
	margin-top: 10px;
280
}
53 aurelien 281
 
210 aurelien 282
.formulaire_suppression_station {
283
	margin-top: 10px;
284
	margin-left: 2px;
285
}
286
 
287
.formulaire_suppression_individu {
288
    margin-left: 2px;
289
    margin-top: 10px;
290
}
291
 
31 aurelien 292
/* =========================== Fiches ============================== */
293
 
294
.element_fiche {
295
	padding-bottom : 5px;
296
}
297
 
298
.intitule_fiche {
299
 
300
}
301
 
302
.valeur_fiche {
303
	font-weight: bold;
304
}
305
 
306
.titre_section_fiche {
307
	padding-bottom : 10px;
308
	padding-top : 10px;
309
}
310
 
311
.titre_fiche {
312
 
313
}
314
 
315
hr.separation_section {
316
	margin-top: 25px;
317
}
318
 
53 aurelien 319
.informations_espece img {
161 vio 320
	margin-top:-35px;
166 aurelien 321
	padding: 15px;
53 aurelien 322
}
31 aurelien 323
 
53 aurelien 324
.annee_observation {
325
	padding-left: 10px;
326
}
327
 
328
.observations_individu {
116 aurelien 329
    display: table-cell;
330
    height: 400px;
331
    width: 250px;
53 aurelien 332
}
333
 
334
.observations_individu {
335
	color: #000000;
336
}
337
 
166 aurelien 338
#fiche_individu .observations_individu li {
53 aurelien 339
	background: none;
340
	padding-left: 1px;
166 aurelien 341
	list-style-type: none;
342
	margin-left: 0px;
343
	padding-left: 0px;
53 aurelien 344
}
345
 
346
.observations_individu li div {
347
	-moz-border-radius: 0.9em;
110 aurelien 348
	-webkit-border-radius: 0.9em;
349
	border-radius: 0.9em;
53 aurelien 350
}
351
 
166 aurelien 352
#center .observations_individu h4 {
53 aurelien 353
	padding: 5px;
166 aurelien 354
	color: black;
53 aurelien 355
}
356
 
60 aurelien 357
.date_observation_individu {
89 aurelien 358
 
359
}
360
 
361
.calendrier {
82 aurelien 362
 
60 aurelien 363
}
364
 
116 aurelien 365
#fiche_individu {
366
	background-color: #F4F2EB;
367
	padding : 10px;
368
	margin-top: 31px;
369
}
76 aurelien 370
 
116 aurelien 371
 
210 aurelien 372
/* =========================== Tableaux d'évenements ============================ */
31 aurelien 373
 
39 aurelien 374
#saisie_liste_evenements, #saisie_modif_evenements {
375
	text-align: center;
376
}
377
 
197 aurelien 378
#saisie_liste_evenements .information_individu, #saisie_modif_evenements.information_individu {
379
	text-align: left;
380
}
381
 
31 aurelien 382
tr:nth-child(odd) {
383
  background-color: #CFCFCF ;
384
}
385
 
386
tr:nth-child(1) {
387
	color: #FFFFFF;
388
}
389
 
390
tr:nth-child(1), tr:nth-child(2) {
391
	background-color: #FFFFFF ;
392
}
393
 
394
div.evenement {
395
	text-align: center;
396
}
397
 
398
.stade_evenement {
399
	text-align: center;
400
}
401
 
76 aurelien 402
 
210 aurelien 403
/* =========================== Styles des différents stades ============================ */
31 aurelien 404
 
53 aurelien 405
.stade_feuillaison {
161 vio 406
	background-color: #ACC700;
31 aurelien 407
}
408
 
53 aurelien 409
.stade_floraison {
161 vio 410
	background-color: #B549B9;
31 aurelien 411
}
412
 
53 aurelien 413
.stade_fructification {
161 vio 414
	background-color: #FF7F00;
31 aurelien 415
}
416
 
53 aurelien 417
.stade_senescence {
161 vio 418
	background-color: #BF3600;
31 aurelien 419
}
420
 
53 aurelien 421
.stade_1ere_apparition {
161 vio 422
	background-color: #B549B9;
31 aurelien 423
}
424
 
210 aurelien 425
/* ============ Style pour l'administration ============================== */
76 aurelien 426
 
210 aurelien 427
#barre_admin {
428
    -moz-border-radius: 10px 10px 10px 10px;
429
    background-color: #F4F2EB;
430
    border: 1px solid #D1C6A8;
287 aurelien 431
    height: 60px;
210 aurelien 432
    margin-bottom: 10px;
433
    padding: 5px;
434
}
60 aurelien 435
 
210 aurelien 436
#form_changement_identite {
437
	width: 330px;
438
	display: inline;
439
}
440
 
218 aurelien 441
.export_observation_admin {
442
	background: url("../images/csv.png") no-repeat scroll 28px 0 transparent;
443
    padding-left: 46px;
444
    padding-top: 3px;
287 aurelien 445
}
210 aurelien 446
 
287 aurelien 447
.gestion_espece_admin {
448
	background: url("../images/espece.png") no-repeat scroll 28px 0 transparent;
449
    padding-left: 46px;
450
    padding-top: 3px;
451
}
452
 
453
.saisie_liste_especes_admin {
454
	width: 100%;
455
}
456
 
457
.saisie_liste_especes_admin tr:nth-child(1) {
458
    color: #494949;
459
    background-color: #CFCFCF;
460
}
461
 
462
.saisie_liste_especes_admin .espece_inactive {
463
    color: #494949;
464
    background-color: #FF7D73;
465
}
466
 
467
#form_modification_espece_admin label {
468
	width: 150px;
469
	padding-right: 50px;
470
}
471
 
210 aurelien 472
/* ============ Styles créés par des effets javascripts automatiques ===== */
473
 
101 aurelien 474
.chargement {
475
	background: url("../images/chargement.gif") no-repeat center center #DCDCDC;
476
}
477
 
89 aurelien 478
.erreur_valeur {
479
	background-color: red;
480
}
481
 
53 aurelien 482
.conteneur_type {
483
	float: right;
484
	align: center;
116 aurelien 485
	width: 230px;
53 aurelien 486
}
31 aurelien 487
 
488
h4.lien_pliage {
489
	text-decoration: underline;
116 aurelien 490
	display: inline;
31 aurelien 491
}
492
 
166 aurelien 493
.pliage {
494
	padding: 5px;
495
}
496
 
31 aurelien 497
h4.lien_pliage:hover {
498
	cursor: pointer;
53 aurelien 499
}
500
 
501
.element_cliquable {
502
	cursor: pointer;
503
}
504
 
60 aurelien 505
.element_cliquable:hover {
506
	background : #9AC343;
507
 }
508
 
53 aurelien 509
.element_clique {
510
	background: #9AC343;
511
}
512
 
166 aurelien 513
#saisie_espece ul.liste_onglets {
53 aurelien 514
	margin: 0;
515
	padding: 0;
516
	float: left;
517
	list-style: none;
518
	height: 32px; /*--Set height of tabs--*/
519
	border-bottom: 1px solid #999;
161 vio 520
	border-left: 1px solid #999;
53 aurelien 521
}
60 aurelien 522
 
166 aurelien 523
#saisie_espece ul.liste_onglets li {
524
	-moz-border-radius-topleft: 0px;
525
    -moz-border-radius-topright: 0px;
53 aurelien 526
	float: left;
527
	margin: 0;
528
	padding: 0;
529
	height: 31px; /*--Subtract 1px from the height of the unordered list--*/
530
	line-height: 31px; /*--Vertically aligns the text within the tab--*/
531
	border: 1px solid #999;
532
	border-left: none;
533
	margin-bottom: -1px; /*--Pull the list item down 1px--*/
534
	overflow: hidden;
535
	position: relative;
536
	background: #e0e0e0;
537
}
60 aurelien 538
 
166 aurelien 539
#saisie_espece ul.liste_onglets li a {
53 aurelien 540
	text-decoration: none;
541
	color: #000;
542
	display: block;
543
	font-size: 1.2em;
544
	padding: 0 20px;
161 vio 545
	border: 1px solid #fff; /*--Gives the bevel look with a 1px white border inside the list item--*/
53 aurelien 546
	outline: none;
547
}
60 aurelien 548
 
166 aurelien 549
#saisie_espece ul.liste_onglets li a:hover {
161 vio 550
	background: #ccc;
551
}
552
 
53 aurelien 553
html ul.liste_onglets li.active, html ul.tabs li.active a:hover  { /*--Makes sure that the active tab does not listen to the hover properties--*/
554
	background: #fff;
161 vio 555
	border-bottom: 1px solid #fff; /*--Makes the active tab look like it's connected with its content--*/
53 aurelien 556
}
557
 
166 aurelien 558
#saisie_espece #onglets  {
89 aurelien 559
	margin-left: 85px;
560
	margin-right: auto;
561
	position: relative;
562
	bottom: -1px;
563
	z-index: 1;
564
	clear:left;
565
}
566
 
166 aurelien 567
#saisie_espece .conteneur_onglets {
53 aurelien 568
	border: 1px solid #999;
569
	overflow: hidden;
89 aurelien 570
	float: left;
53 aurelien 571
	background: #fff;
89 aurelien 572
	position: relative;
573
	width:565px;
53 aurelien 574
}
575
 
166 aurelien 576
#saisie_espece .contenu_onglet {
53 aurelien 577
	padding: 20px;
578
	font-size: 1.2em;
89 aurelien 579
}
580
 
101 aurelien 581
 
582
.autocompletion {
583
	position:relative;
584
}
585
 
210 aurelien 586
.conteneur_suggestions, .conteneur_suggestions_utilisateur {
101 aurelien 587
    position: absolute;
588
    left: 107px;
589
    width: 180px;
590
    background-color: #212427;
591
    border: 2px solid #000;
592
    color: #fff;
593
    z-index: 300;
110 aurelien 594
    -moz-border-radius: 7px;
595
	-webkit-border-radius: 7px;
596
	border-radius: 7px;
101 aurelien 597
}
210 aurelien 598
 
599
.conteneur_suggestions_utilisateur {
600
	left: 188px;
601
}
101 aurelien 602
 
603
.liste_suggestions {
604
    margin: 0px;
605
    padding: 0px;
606
}
607
 
608
.liste_suggestions li {
609
    margin: 0px 0px 3px 0px;
610
    padding: 3px;
611
    cursor: pointer;
612
}
197 aurelien 613
 
210 aurelien 614
.liste_suggestions li {
197 aurelien 615
	list-style-type: none;
616
	margin-left: 5px;
617
	margin-right: 5px;
618
}
619
 
101 aurelien 620
 
621
.liste_suggestions .element_selectionne {
622
    background-color: #659CD8;
623
}
624
 
210 aurelien 625
/* ============ Styles crées spécifiquement pour compenser les faiblesses de certains navigateurs ===== */
89 aurelien 626
 
627
.clearer {
628
	clear:both;
31 aurelien 629
}