Subversion Repositories Sites.obs-saisons.fr

Rev

Rev 139 | Rev 161 | 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 
 
140 aurelien 408 
.observations_individu > ul h4 {
409 
	color: black;
410 
}
76 aurelien 411 
 
53 aurelien 412 
/* ============ Styles crées par des effets javascripts automatiques ===== */
60 aurelien 413 
 
101 aurelien 414 
.chargement {
415 
	background: url("../images/chargement.gif") no-repeat center center #DCDCDC;
416 
}
417 
 
89 aurelien 418 
.erreur_valeur {
419 
	background-color: red;
420 
}
421 
 
53 aurelien 422 
.conteneur_type {
423 
	float: right;
424 
	align: center;
116 aurelien 425 
	width: 230px;
53 aurelien 426 
}
31 aurelien 427 
 
428 
h4.lien_pliage {
429 
	text-decoration: underline;
116 aurelien 430 
	display: inline;
31 aurelien 431 
}
432 
 
433 
h4.lien_pliage:hover {
434 
	cursor: pointer;
53 aurelien 435 
}
436 
 
437 
.element_cliquable {
438 
	cursor: pointer;
439 
}
440 
 
60 aurelien 441 
.element_cliquable:hover {
442 
	background : #9AC343;
443 
 }
444 
 
53 aurelien 445 
.element_clique {
446 
	background: #9AC343;
447 
}
448 
 
449 
ul.liste_onglets {
450 
	margin: 0;
451 
	padding: 0;
452 
	float: left;
453 
	list-style: none;
454 
	height: 32px; /*--Set height of tabs--*/
455 
	border-bottom: 1px solid #999;
456 
}
60 aurelien 457 
 
53 aurelien 458 
ul.liste_onglets li {
459 
	float: left;
460 
	margin: 0;
461 
	padding: 0;
462 
	height: 31px; /*--Subtract 1px from the height of the unordered list--*/
463 
	line-height: 31px; /*--Vertically aligns the text within the tab--*/
464 
	border: 1px solid #999;
465 
	border-left: none;
466 
	margin-bottom: -1px; /*--Pull the list item down 1px--*/
467 
	overflow: hidden;
468 
	position: relative;
469 
	background: #e0e0e0;
470 
}
60 aurelien 471 
 
53 aurelien 472 
ul.liste_onglets li a {
473 
	text-decoration: none;
474 
	color: #000;
475 
	display: block;
476 
	font-size: 1.2em;
477 
	padding: 0 20px;
478 
	outline: none;
479 
}
60 aurelien 480 
 
53 aurelien 481 
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--*/
482 
	background: #fff;
483 
}
484 
 
89 aurelien 485 
#onglets  {
486 
	margin-left: 85px;
487 
	margin-right: auto;
488 
	position: relative;
489 
	bottom: -1px;
490 
	z-index: 1;
491 
	clear:left;
492 
}
493 
 
139 aurelien 494 
#onglets ul.liste_onglets li {
495 
	background: none;
496 
	margin: 0;
497 
	border-left: 1px solid;
498 
}
499 
 
500 
#onglets ul.liste_onglets li a {
501 
	padding-left: 20px;
502 
	padding-right: 20px;
503 
}
504 
 
53 aurelien 505 
.conteneur_onglets {
506 
	border: 1px solid #999;
507 
	overflow: hidden;
89 aurelien 508 
	float: left;
53 aurelien 509 
	background: #fff;
89 aurelien 510 
	position: relative;
511 
	width:565px;
53 aurelien 512 
}
513 
 
514 
.contenu_onglet {
515 
	padding: 20px;
516 
	font-size: 1.2em;
89 aurelien 517 
}
518 
 
101 aurelien 519 
 
520 
.autocompletion {
521 
	position:relative;
522 
}
523 
 
524 
.conteneur_suggestions {
525 
    position: absolute;
526 
    left: 107px;
527 
    width: 180px;
528 
    background-color: #212427;
529 
    border: 2px solid #000;
530 
    color: #fff;
531 
    z-index: 300;
110 aurelien 532 
    -moz-border-radius: 7px;
533 
	-webkit-border-radius: 7px;
534 
	border-radius: 7px;
101 aurelien 535 
}
536 
 
537 
.liste_suggestions {
538 
    margin: 0px;
539 
    padding: 0px;
540 
}
541 
 
542 
.liste_suggestions li {
543 
    margin: 0px 0px 3px 0px;
544 
    padding: 3px;
545 
    cursor: pointer;
546 
}
547 
 
548 
.liste_suggestions .element_selectionne {
549 
    background-color: #659CD8;
550 
}
551 
 
89 aurelien 552 
/* ============ Styles crées spécifiquement pour compenser les faiblesses de certains navigateurs ===== */
553 
 
554 
.clearer {
555 
	clear:both;
31 aurelien 556 
}