Subversion Repositories Sites.obs-saisons.fr

Rev

Rev 116 | Rev 140 | 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
 
31 aurelien 5
/* =========================== Style général ============================ */
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;
96
	background-color: #800000;
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
 
76 aurelien 139
 
140
/* =========================== Formulaires d'inscription et d'identification ============================ */
141
 
142
#conteneur_formulaire_identification, #conteneur_formulaire_inscription {
143
 
144
	width:650px;
145
	border: 1px solid grey;
146
	margin-top: 10px;
147
	padding: 10px;
148
	text-align: left !important;
110 aurelien 149
	-moz-border-radius: 0.9em;
150
	-webkit-border-radius: 0.9em;
151
	border-radius: 0.9em;
76 aurelien 152
}
153
 
154
#conteneur_formulaire_identification form {
155
	text-align: left !important;
156
}
157
 
158
#conteneur_formulaire_identification input {
159
	text-align: left !important;
160
	width: 300px;
161
}
162
 
163
#conteneur_formulaire_inscription input {
164
	text-align: left !important;
165
	width: 300px;
166
}
167
 
168
.message_identification {
169
	font-weight: bold;
170
	padding-top: 5px;
171
	color: #435F06;
172
	font-size: 1.5em;
173
}
174
 
175
 
176
/* =========================== Formulaires de l'application ============================ */
177
 
101 aurelien 178
#saisie_station {
139 aurelien 179
	padding-left: 20px;
101 aurelien 180
	width: 700px;
181
}
182
 
183
.element_formulaire label {
139 aurelien 184
	color: black;
185
    font-size: 1.3em;
186
    width: 150px;
101 aurelien 187
}
188
 
31 aurelien 189
.element_formulaire_en_ligne {
190
	padding-right: 10px;
191
}
192
 
60 aurelien 193
.element_formulaire, #conteneur_liens_lat_lon, #conteneur_form_liens_lat_lon {
101 aurelien 194
	padding-bottom : 15px;
31 aurelien 195
}
196
 
197
.conteneur_carte {
89 aurelien 198
	height: 400px;
199
	width: 725px;
31 aurelien 200
}
201
 
202
.gros_bouton_validation {
203
	height: 50px;
204
	width: 200px;
205
	font-size: 20px;
206
	margin-top: 10x;
89 aurelien 207
	margin-right:10px;
31 aurelien 208
}
209
 
101 aurelien 210
#localiser_lat_lon {
211
	background: url("../images/localiser.png") no-repeat scroll 2px transparent;
212
}
213
 
31 aurelien 214
#saisie_liste_evenements {
215
	text-align: center;
89 aurelien 216
	width:715px;
31 aurelien 217
}
218
 
39 aurelien 219
#saisie_modif_evenements tr, #saisie_liste_evenements tr {
31 aurelien 220
	height: 40px;
221
}
222
 
39 aurelien 223
.icone_s {
224
	height: 30px;
225
	width: 30px;
226
}
31 aurelien 227
 
53 aurelien 228
.valider_formulaire {
229
	cursor: pointer;
230
	background-color: transparent;
231
	background-image: url("../images/valider_s.png");
232
	border: none;
233
	color: rgba(0,0,0,0);
234
	background-position: center;
235
	background-repeat: no-repeat;
60 aurelien 236
	padding-top: 2px;
237
	padding-bottom: 3px;
53 aurelien 238
}
39 aurelien 239
 
53 aurelien 240
.valider_formulaire:hover, .lien_modifier:hover {
241
	background-color: #CFCFCF;
242
}
243
 
89 aurelien 244
#form_saisie_espece {
245
	margin-right: auto;
246
	margin-left: auto;
247
}
248
 
53 aurelien 249
.formulaire_informations_espece_mini {
60 aurelien 250
	text-align: center;
53 aurelien 251
	height:40px;
252
	width: 500px;
253
	border: solid 1px #999999;
254
	background-color: #CFCFCF;
255
	padding: 10px;
256
	margin-bottom: 10px;
110 aurelien 257
	-moz-border-radius: 0.9em;
258
	-webkit-border-radius: 0.9em;
259
	border-radius: 0.9em;
53 aurelien 260
}
261
 
262
.formulaire_informations_espece_mini:hover {
263
	background-color: #C0DF7D;
264
}
265
 
266
.formulaire_informations_espece_mini img {
267
	margin-top:-5px;
268
}
269
 
270
 
31 aurelien 271
/* =========================== Fiches ============================== */
272
 
273
.element_fiche {
274
	padding-bottom : 5px;
275
}
276
 
277
.intitule_fiche {
278
 
279
}
280
 
281
.valeur_fiche {
282
	font-weight: bold;
283
}
284
 
285
.titre_section_fiche {
286
	padding-bottom : 10px;
287
	padding-top : 10px;
288
}
289
 
290
.titre_fiche {
291
 
292
}
293
 
294
hr.separation_section {
295
	margin-top: 25px;
296
}
297
 
53 aurelien 298
.informations_espece img {
139 aurelien 299
	margin-top: -15px;
53 aurelien 300
}
31 aurelien 301
 
53 aurelien 302
.annee_observation {
303
	padding-left: 10px;
304
}
305
 
306
.observations_individu {
116 aurelien 307
    display: table-cell;
308
    height: 400px;
309
    width: 250px;
53 aurelien 310
}
311
 
312
.observations_individu {
313
	color: #000000;
314
}
315
 
316
.observations_individu li {
317
	background: none;
318
	padding-left: 1px;
319
}
320
 
321
.observations_individu li div {
322
	-moz-border-radius: 0.9em;
110 aurelien 323
	-webkit-border-radius: 0.9em;
324
	border-radius: 0.9em;
53 aurelien 325
}
326
 
327
.observations_individu h4 {
328
	padding: 5px;
329
}
330
 
60 aurelien 331
.date_observation_individu {
89 aurelien 332
 
333
}
334
 
335
.calendrier {
82 aurelien 336
 
60 aurelien 337
}
338
 
116 aurelien 339
#fiche_individu {
340
	background-color: #F4F2EB;
341
	padding : 10px;
342
	border: 1px solid #C6B895;
343
	margin-top: 31px;
344
}
76 aurelien 345
 
139 aurelien 346
#lien_ajout_individu {
347
	background: url("../images/ajout.png") no-repeat scroll -9px -7px transparent;
348
	padding-left: 20px;
349
	padding-top: 2px;
350
}
116 aurelien 351
 
139 aurelien 352
.description_espece {
353
    font-style: italic;
354
    text-align: justify;
355
    width: 550px;
356
}
357
 
358
 
31 aurelien 359
/* =========================== Tableaux d'évenements ============================ */
360
 
39 aurelien 361
#saisie_liste_evenements, #saisie_modif_evenements {
362
	text-align: center;
363
}
364
 
31 aurelien 365
tr:nth-child(odd) {
366
  background-color: #CFCFCF ;
367
}
368
 
369
tr:nth-child(1) {
370
	color: #FFFFFF;
371
}
372
 
373
tr:nth-child(1), tr:nth-child(2) {
374
	background-color: #FFFFFF ;
375
}
376
 
377
div.evenement {
378
	text-align: center;
379
}
380
 
381
.stade_evenement {
382
	text-align: center;
383
}
384
 
76 aurelien 385
 
31 aurelien 386
/* =========================== Styles des différents stades ============================ */
387
 
53 aurelien 388
.stade_feuillaison {
31 aurelien 389
	background-color: #9AC343;
390
}
391
 
53 aurelien 392
.stade_floraison {
393
	background-color: #C60800;
31 aurelien 394
}
395
 
53 aurelien 396
.stade_fructification {
31 aurelien 397
	background-color: #8B008B;
398
}
399
 
53 aurelien 400
.stade_senescence {
31 aurelien 401
	background-color: #800000;
402
}
403
 
53 aurelien 404
.stade_1ere_apparition {
405
	background-color: #F08080;
31 aurelien 406
}
407
 
76 aurelien 408
 
53 aurelien 409
/* ============ Styles crées par des effets javascripts automatiques ===== */
60 aurelien 410
 
101 aurelien 411
.chargement {
412
	background: url("../images/chargement.gif") no-repeat center center #DCDCDC;
413
}
414
 
89 aurelien 415
.erreur_valeur {
416
	background-color: red;
417
}
418
 
53 aurelien 419
.conteneur_type {
420
	float: right;
421
	align: center;
116 aurelien 422
	width: 230px;
53 aurelien 423
}
31 aurelien 424
 
425
h4.lien_pliage {
426
	text-decoration: underline;
116 aurelien 427
	display: inline;
31 aurelien 428
}
429
 
430
h4.lien_pliage:hover {
431
	cursor: pointer;
53 aurelien 432
}
433
 
434
.element_cliquable {
435
	cursor: pointer;
436
}
437
 
60 aurelien 438
.element_cliquable:hover {
439
	background : #9AC343;
440
 }
441
 
53 aurelien 442
.element_clique {
443
	background: #9AC343;
444
}
445
 
446
ul.liste_onglets {
447
	margin: 0;
448
	padding: 0;
449
	float: left;
450
	list-style: none;
451
	height: 32px; /*--Set height of tabs--*/
452
	border-bottom: 1px solid #999;
453
}
60 aurelien 454
 
53 aurelien 455
ul.liste_onglets li {
456
	float: left;
457
	margin: 0;
458
	padding: 0;
459
	height: 31px; /*--Subtract 1px from the height of the unordered list--*/
460
	line-height: 31px; /*--Vertically aligns the text within the tab--*/
461
	border: 1px solid #999;
462
	border-left: none;
463
	margin-bottom: -1px; /*--Pull the list item down 1px--*/
464
	overflow: hidden;
465
	position: relative;
466
	background: #e0e0e0;
467
}
60 aurelien 468
 
53 aurelien 469
ul.liste_onglets li a {
470
	text-decoration: none;
471
	color: #000;
472
	display: block;
473
	font-size: 1.2em;
474
	padding: 0 20px;
475
	outline: none;
476
}
60 aurelien 477
 
53 aurelien 478
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--*/
479
	background: #fff;
480
}
481
 
89 aurelien 482
#onglets  {
483
	margin-left: 85px;
484
	margin-right: auto;
485
	position: relative;
486
	bottom: -1px;
487
	z-index: 1;
488
	clear:left;
489
}
490
 
139 aurelien 491
#onglets ul.liste_onglets li {
492
	background: none;
493
	margin: 0;
494
	border-left: 1px solid;
495
}
496
 
497
#onglets ul.liste_onglets li a {
498
	padding-left: 20px;
499
	padding-right: 20px;
500
}
501
 
53 aurelien 502
.conteneur_onglets {
503
	border: 1px solid #999;
504
	overflow: hidden;
89 aurelien 505
	float: left;
53 aurelien 506
	background: #fff;
89 aurelien 507
	position: relative;
508
	width:565px;
53 aurelien 509
}
510
 
511
.contenu_onglet {
512
	padding: 20px;
513
	font-size: 1.2em;
89 aurelien 514
}
515
 
101 aurelien 516
 
517
.autocompletion {
518
	position:relative;
519
}
520
 
521
.conteneur_suggestions {
522
    position: absolute;
523
    left: 107px;
524
    width: 180px;
525
    background-color: #212427;
526
    border: 2px solid #000;
527
    color: #fff;
528
    z-index: 300;
110 aurelien 529
    -moz-border-radius: 7px;
530
	-webkit-border-radius: 7px;
531
	border-radius: 7px;
101 aurelien 532
}
533
 
534
.liste_suggestions {
535
    margin: 0px;
536
    padding: 0px;
537
}
538
 
539
.liste_suggestions li {
540
    margin: 0px 0px 3px 0px;
541
    padding: 3px;
542
    cursor: pointer;
543
}
544
 
545
.liste_suggestions .element_selectionne {
546
    background-color: #659CD8;
547
}
548
 
89 aurelien 549
/* ============ Styles crées spécifiquement pour compenser les faiblesses de certains navigateurs ===== */
550
 
551
.clearer {
552
	clear:both;
31 aurelien 553
}