Subversion Repositories Sites.obs-saisons.fr

Rev

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