Subversion Repositories Sites.obs-saisons.fr

Rev

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