Subversion Repositories Sites.obs-saisons.fr

Rev

Rev 101 | Rev 116 | 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 
 
36 
 
31 aurelien 37 
/* =========================== Titres ============================ */
38 
 
39 
.titre_saisie {
40 
	padding-bottom: 10px;
41 
}
42 
 
43 
.etape {
44 
	color: #9AC343;
45 
	padding-bottom:20px;
46 
}
47 
 
48 
 
53 aurelien 49 
/* =========================== Menu et navigation ============================ */
50 
 
51 
#saisie_menu ul li {
52 
	background: none;
53 
	padding-top: 5px;
54 
}
55 
 
56 
#saisie_menu ul li.item_menu_station {
57 
	background: url("../images/station.png") no-repeat scroll 0px 0.5em transparent;
58 
}
59 
 
60 
.item_menu_station > a {
61 
	padding: 5px;
62 
}
63 
 
64 
#saisie_menu ul li.item_menu_espece {
65 
	background: url("../images/espece.png") no-repeat scroll 0px 0.5em transparent;
66 
}
67 
 
68 
.item_menu_espece > a {
69 
	padding: 5px
70 
}
71 
 
72 
#saisie_menu ul li.station_ajout {
73 
	background: url("../images/ajout.png") no-repeat scroll -9px transparent;
74 
}
75 
 
76 
li.station_en_cours {
77 
	padding-top: 10px;
78 
}
79 
 
80 
li.station_en_cours > a {
81 
	color: #FFFFFF;
82 
	font-weight: bold;
83 
	border: solid 1px #FFFFFF;
84 
	background-color: #800000;
85 
	-moz-border-radius: 0.9em;
110 aurelien 86 
	-webkit-border-radius: 0.9em;
87 
	border-radius: 0.9em;
53 aurelien 88 
}
89 
 
110 aurelien 90 
#retour_au_site {
91 
	padding-top: 30px;
92 
}
93 
 
53 aurelien 94 
#saisie_menu ul li.espece_ajout {
95 
	background: url("../images/ajout.png") no-repeat scroll -9px transparent;
96 
}
97 
 
98 
li.espece_en_cours > a {
99 
	color: #FFFFFF;
100 
	font-weight: bold;
101 
	border: solid 1px #FFFFFF;
102 
	background-color: #9AC343;
110 aurelien 103 
	-moz-border-radius: 0.9em;
104 
	-webkit-border-radius: 0.9em;
105 
	border-radius: 0.9em;
53 aurelien 106 
}
107 
 
60 aurelien 108 
ul.liste_annees_observations {
109 
	list-style-type: none;
110 
}
111 
 
112 
.liste_annees_observations li {
113 
	display: inline;
114 
	list-style: none;
115 
	background: none;
116 
}
117 
 
118 
#annee_en_cours {
119 
	font-size: 1.6em;
120 
	color: #9AC343;
121 
}
122 
 
31 aurelien 123 
 
76 aurelien 124 
 
125 
 
126 
/* =========================== Formulaires d'inscription et d'identification ============================ */
127 
 
128 
#conteneur_formulaire_identification, #conteneur_formulaire_inscription {
129 
 
130 
	width:650px;
131 
	border: 1px solid grey;
132 
	margin-top: 10px;
133 
	padding: 10px;
134 
	text-align: left !important;
110 aurelien 135 
	-moz-border-radius: 0.9em;
136 
	-webkit-border-radius: 0.9em;
137 
	border-radius: 0.9em;
76 aurelien 138 
}
139 
 
140 
#conteneur_formulaire_identification form {
141 
	text-align: left !important;
142 
}
143 
 
144 
#conteneur_formulaire_identification input {
145 
	text-align: left !important;
146 
	width: 300px;
147 
}
148 
 
149 
#conteneur_formulaire_inscription input {
150 
	text-align: left !important;
151 
	width: 300px;
152 
}
153 
 
154 
.message_identification {
155 
	font-weight: bold;
156 
	padding-top: 5px;
157 
	color: #435F06;
158 
	font-size: 1.5em;
159 
}
160 
 
161 
 
162 
/* =========================== Formulaires de l'application ============================ */
163 
 
101 aurelien 164 
#saisie_station {
165 
	width: 700px;
166 
}
167 
 
168 
.element_formulaire label {
169 
	width:150px;
170 
}
171 
 
31 aurelien 172 
.element_formulaire_en_ligne {
173 
	padding-right: 10px;
174 
}
175 
 
60 aurelien 176 
.element_formulaire, #conteneur_liens_lat_lon, #conteneur_form_liens_lat_lon {
101 aurelien 177 
	padding-bottom : 15px;
31 aurelien 178 
}
179 
 
180 
.conteneur_carte {
89 aurelien 181 
	height: 400px;
182 
	width: 725px;
31 aurelien 183 
}
184 
 
185 
.gros_bouton_validation {
186 
	height: 50px;
187 
	width: 200px;
188 
	font-size: 20px;
189 
	margin-top: 10x;
89 aurelien 190 
	margin-right:10px;
31 aurelien 191 
}
192 
 
101 aurelien 193 
#localiser_lat_lon {
194 
	background: url("../images/localiser.png") no-repeat scroll 2px transparent;
195 
}
196 
 
31 aurelien 197 
#saisie_liste_evenements {
198 
	text-align: center;
89 aurelien 199 
	width:715px;
31 aurelien 200 
}
201 
 
39 aurelien 202 
#saisie_modif_evenements tr, #saisie_liste_evenements tr {
31 aurelien 203 
	height: 40px;
204 
}
205 
 
39 aurelien 206 
.icone_s {
207 
	height: 30px;
208 
	width: 30px;
209 
}
31 aurelien 210 
 
53 aurelien 211 
.valider_formulaire {
212 
	cursor: pointer;
213 
	background-color: transparent;
214 
	background-image: url("../images/valider_s.png");
215 
	border: none;
216 
	color: rgba(0,0,0,0);
217 
	background-position: center;
218 
	background-repeat: no-repeat;
60 aurelien 219 
	padding-top: 2px;
220 
	padding-bottom: 3px;
53 aurelien 221 
}
39 aurelien 222 
 
53 aurelien 223 
.valider_formulaire:hover, .lien_modifier:hover {
224 
	background-color: #CFCFCF;
225 
}
226 
 
89 aurelien 227 
#form_saisie_espece {
228 
	margin-right: auto;
229 
	margin-left: auto;
230 
}
231 
 
53 aurelien 232 
.formulaire_informations_espece_mini {
60 aurelien 233 
	text-align: center;
53 aurelien 234 
	height:40px;
235 
	width: 500px;
236 
	border: solid 1px #999999;
237 
	background-color: #CFCFCF;
238 
	padding: 10px;
239 
	margin-bottom: 10px;
110 aurelien 240 
	-moz-border-radius: 0.9em;
241 
	-webkit-border-radius: 0.9em;
242 
	border-radius: 0.9em;
53 aurelien 243 
}
244 
 
245 
.formulaire_informations_espece_mini:hover {
246 
	background-color: #C0DF7D;
247 
}
248 
 
249 
.formulaire_informations_espece_mini img {
250 
	margin-top:-5px;
251 
}
252 
 
253 
 
31 aurelien 254 
/* =========================== Fiches ============================== */
255 
 
256 
.element_fiche {
257 
	padding-bottom : 5px;
258 
}
259 
 
260 
.intitule_fiche {
261 
 
262 
}
263 
 
264 
.valeur_fiche {
265 
	font-weight: bold;
266 
}
267 
 
268 
.titre_section_fiche {
269 
	padding-bottom : 10px;
270 
	padding-top : 10px;
271 
}
272 
 
273 
.titre_fiche {
274 
 
275 
}
276 
 
277 
hr.separation_section {
278 
	margin-top: 25px;
279 
}
280 
 
53 aurelien 281 
.informations_espece img {
282 
	margin-top:-35px;
283 
}
31 aurelien 284 
 
53 aurelien 285 
.annee_observation {
286 
	padding-left: 10px;
287 
}
288 
 
289 
.observations_individu {
290 
	display: inline;
291 
	float: left;
292 
	width: 200px;
293 
	height: 400px;
294 
}
295 
 
296 
.observations_individu {
297 
	color: #000000;
298 
}
299 
 
300 
.observations_individu li {
301 
	background: none;
302 
	padding-left: 1px;
303 
}
304 
 
305 
.observations_individu li div {
306 
	-moz-border-radius: 0.9em;
110 aurelien 307 
	-webkit-border-radius: 0.9em;
308 
	border-radius: 0.9em;
53 aurelien 309 
}
310 
 
311 
.observations_individu h4 {
312 
	padding: 5px;
313 
}
314 
 
60 aurelien 315 
.date_observation_individu {
89 aurelien 316 
 
317 
}
318 
 
319 
.calendrier {
82 aurelien 320 
 
60 aurelien 321 
}
322 
 
76 aurelien 323 
 
31 aurelien 324 
/* =========================== Tableaux d'évenements ============================ */
325 
 
39 aurelien 326 
#saisie_liste_evenements, #saisie_modif_evenements {
327 
	text-align: center;
328 
}
329 
 
31 aurelien 330 
tr:nth-child(odd) {
331 
  background-color: #CFCFCF ;
332 
}
333 
 
334 
tr:nth-child(1) {
335 
	color: #FFFFFF;
336 
}
337 
 
338 
tr:nth-child(1), tr:nth-child(2) {
339 
	background-color: #FFFFFF ;
340 
}
341 
 
342 
div.evenement {
343 
	text-align: center;
344 
}
345 
 
346 
.stade_evenement {
347 
	text-align: center;
348 
}
349 
 
76 aurelien 350 
 
31 aurelien 351 
/* =========================== Styles des différents stades ============================ */
352 
 
53 aurelien 353 
.stade_feuillaison {
31 aurelien 354 
	background-color: #9AC343;
355 
}
356 
 
53 aurelien 357 
.stade_floraison {
358 
	background-color: #C60800;
31 aurelien 359 
}
360 
 
53 aurelien 361 
.stade_fructification {
31 aurelien 362 
	background-color: #8B008B;
363 
}
364 
 
53 aurelien 365 
.stade_senescence {
31 aurelien 366 
	background-color: #800000;
367 
}
368 
 
53 aurelien 369 
.stade_1ere_apparition {
370 
	background-color: #F08080;
31 aurelien 371 
}
372 
 
76 aurelien 373 
 
53 aurelien 374 
/* ============ Styles crées par des effets javascripts automatiques ===== */
60 aurelien 375 
 
101 aurelien 376 
.chargement {
377 
	background: url("../images/chargement.gif") no-repeat center center #DCDCDC;
378 
}
379 
 
89 aurelien 380 
.erreur_valeur {
381 
	background-color: red;
382 
}
383 
 
53 aurelien 384 
.conteneur_type {
385 
	float: right;
386 
	align: center;
387 
	width: 250px;
388 
}
31 aurelien 389 
 
390 
h4.lien_pliage {
391 
	text-decoration: underline;
392 
}
393 
 
394 
h4.lien_pliage:hover {
395 
	cursor: pointer;
53 aurelien 396 
}
397 
 
398 
.element_cliquable {
399 
	cursor: pointer;
400 
}
401 
 
60 aurelien 402 
.element_cliquable:hover {
403 
	background : #9AC343;
404 
 }
405 
 
53 aurelien 406 
.element_clique {
407 
	background: #9AC343;
408 
}
409 
 
410 
ul.liste_onglets {
411 
	margin: 0;
412 
	padding: 0;
413 
	float: left;
414 
	list-style: none;
415 
	height: 32px; /*--Set height of tabs--*/
416 
	border-bottom: 1px solid #999;
417 
	border-left: 1px solid #999;
418 
}
60 aurelien 419 
 
53 aurelien 420 
ul.liste_onglets li {
421 
	float: left;
422 
	margin: 0;
423 
	padding: 0;
424 
	height: 31px; /*--Subtract 1px from the height of the unordered list--*/
425 
	line-height: 31px; /*--Vertically aligns the text within the tab--*/
426 
	border: 1px solid #999;
427 
	border-left: none;
428 
	margin-bottom: -1px; /*--Pull the list item down 1px--*/
429 
	overflow: hidden;
430 
	position: relative;
431 
	background: #e0e0e0;
432 
}
60 aurelien 433 
 
53 aurelien 434 
ul.liste_onglets li a {
435 
	text-decoration: none;
436 
	color: #000;
437 
	display: block;
438 
	font-size: 1.2em;
439 
	padding: 0 20px;
440 
	border: 1px solid #fff; /*--Gives the bevel look with a 1px white border inside the list item--*/
441 
	outline: none;
442 
}
60 aurelien 443 
 
53 aurelien 444 
ul.liste_onglets li a:hover {
445 
	background: #ccc;
446 
}
60 aurelien 447 
 
53 aurelien 448 
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--*/
449 
	background: #fff;
450 
	border-bottom: 1px solid #fff; /*--Makes the active tab look like it's connected with its content--*/
451 
}
452 
 
89 aurelien 453 
#onglets  {
454 
	margin-left: 85px;
455 
	margin-right: auto;
456 
	position: relative;
457 
	bottom: -1px;
458 
	z-index: 1;
459 
	clear:left;
460 
}
461 
 
53 aurelien 462 
.conteneur_onglets {
463 
	border: 1px solid #999;
464 
	overflow: hidden;
89 aurelien 465 
	float: left;
53 aurelien 466 
	background: #fff;
89 aurelien 467 
	position: relative;
468 
	width:565px;
53 aurelien 469 
}
470 
 
471 
.contenu_onglet {
472 
	padding: 20px;
473 
	font-size: 1.2em;
89 aurelien 474 
}
475 
 
101 aurelien 476 
 
477 
.autocompletion {
478 
	position:relative;
479 
}
480 
 
481 
.conteneur_suggestions {
482 
    position: absolute;
483 
    left: 107px;
484 
    width: 180px;
485 
    background-color: #212427;
486 
    border: 2px solid #000;
487 
    color: #fff;
488 
    z-index: 300;
110 aurelien 489 
    -moz-border-radius: 7px;
490 
	-webkit-border-radius: 7px;
491 
	border-radius: 7px;
101 aurelien 492 
}
493 
 
494 
.liste_suggestions {
495 
    margin: 0px;
496 
    padding: 0px;
497 
}
498 
 
499 
.liste_suggestions li {
500 
    margin: 0px 0px 3px 0px;
501 
    padding: 3px;
502 
    cursor: pointer;
503 
}
504 
 
505 
.liste_suggestions .element_selectionne {
506 
    background-color: #659CD8;
507 
}
508 
 
89 aurelien 509 
/* ============ Styles crées spécifiquement pour compenser les faiblesses de certains navigateurs ===== */
510 
 
511 
.clearer {
512 
	clear:both;
31 aurelien 513 
}