Subversion Repositories Sites.obs-saisons.fr

Rev

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