Subversion Repositories eFlore/Applications.cel

Rev

Go to most recent revision | Details | Last modification | View Log | RSS feed

Rev Author Line No. Line
3120 delphine 1
@CHARSET "UTF-8";
2
 
3
body {
3208 idir 4
  font-family: Muli,sans-serif;
5
  font-size: 0.8rem;
6
  font-weight: 300;
3120 delphine 7
}
3208 idir 8
 
3239 idir 9
#zone-appli {
10
  padding: 2rem;
11
  border-radius: 0.3rem;
12
  background-color: rgba(255, 255, 255, 0.9);
13
  margin-top: 2rem;
14
}
15
 
3240 idir 16
#zone-appli .zone-alerte{
17
  width: 100%;
18
}
19
 
3260 idir 20
#logo {
21
  max-width: 100%;
22
}
23
 
3120 delphine 24
h1, h2, h3, h4, h5 {
3208 idir 25
  font-family: Muli,sans-serif;
3120 delphine 26
}
27
 
28
form {
3208 idir 29
  font-family: Muli,sans-serif;
30
  float: none;
3120 delphine 31
}
32
 
33
h1 {
3208 idir 34
  font-weight: 700;
35
  font-size: 2rem;
3120 delphine 36
}
37
 
3208 idir 38
#zone-appli .form-block {
39
  margin-bottom: 2rem;
40
}
41
 
3120 delphine 42
h2 {
3208 idir 43
  font-weight: 700;
44
  line-height: 1.15;
45
  font-size: 1.5rem;
3120 delphine 46
}
47
 
3208 idir 48
h3 {
49
  font-size: 1.2rem;
50
}
51
 
52
#zone-appli .obligatoire::before {
53
  content: '*';
54
  position: absolute;
55
  left: 0;
56
}
57
 
58
.btn.focus,
59
.btn:focus {
60
  box-shadow: none;
61
}
62
 
63
.btn.btn-primary,
64
.btn.btn-info,
65
.btn.btn-success,
66
.btn.btn-danger,
67
.btn.btn-inverse {
68
  color: #fff !important;
69
}
70
 
3120 delphine 71
button {
3208 idir 72
  -moz-border-bottom-colors: none;
73
  -moz-border-left-colors: none;
74
  -moz-border-right-colors: none;
75
  -moz-border-top-colors: none;
76
  background-color: #a2b93b;
77
  border-bottom-color: currentcolor;
78
  border-bottom-left-radius: 0.2rem;
79
  border-bottom-right-radius: 0.2rem;
80
  border-bottom-style: none;
81
  border-bottom-width: 0;
82
  border-image-outset: 0 0 0 0;
83
  border-image-repeat: stretch stretch;
84
  border-image-slice: 100% 100% 100% 100%;
85
  border-image-source: none;
86
  border-image-width: 1 1 1 1;
87
  border-left-color: currentcolor;
88
  border-left-style: none;
89
  border-left-width: 0;
90
  border-right-color: currentcolor;
91
  border-right-style: none;
92
  border-right-width: 0;
93
  border-top-color: currentcolor;
94
  border-top-left-radius: 0.2rem;
95
  border-top-right-radius: 0.2rem;
96
  border-top-style: none;
97
  border-top-width: 0;
98
  color: #fff;
99
  cursor: pointer;
100
  display: inline-block;
101
  font-family: Ubuntu,sans-serif;
102
  font-size: 1.3rem;
103
  font-weight: 500;
104
  letter-spacing: 0.1rem;
105
  line-height: 1.5rem;
106
  padding-bottom: 1.25rem;
107
  padding-left: 2rem;
108
  padding-right: 2rem;
109
  padding-top: 1.25rem;
110
  text-align: center;
111
  text-decoration-color: currentcolor;
112
  text-decoration-line: none;
113
  text-decoration-style: solid;
114
  text-transform: uppercase;
115
  transition-delay: 0s;
116
  transition-duration: 0.2s;
117
  transition-property: background;
118
  transition-timing-function: ease;
3120 delphine 119
}
120
 
3208 idir 121
.mb2,
122
.mb-3 {
123
  align-self: start;
3120 delphine 124
}
125
 
3208 idir 126
label,
127
#zone-appli  .list-label {
128
  color: #606060;
129
  display: block;
130
  font-size: 0.9rem;
131
  font-weight: 700;
132
}
133
 
134
#zone-appli .form-inline label,
135
#zone-appli .form-inline .list-label {
136
  align-items: start;
137
  align-self: start;
138
  justify-content: left;
139
  align-content: flex-start;
140
}
141
 
3120 delphine 142
h1#widget-titre::before {
3208 idir 143
  content: "";
144
  display: block;
145
  height: 100%;
146
  left: -5rem;
147
  position: absolute;
148
  width: 0.4rem;
3120 delphine 149
}
150
 
151
h1#widget-titre {
3208 idir 152
  font-size: 2.6rem;
153
  font-weight: 700;
154
  line-height: 3.2rem;
155
  margin-bottom: 0;
156
  margin-left: 0;
157
  margin-right: 0;
158
  margin-top: 0;
159
  position: relative;
160
  color: #232323;
161
  font-family: Ubuntu,sans-serif;
3120 delphine 162
}
163
 
3208 idir 164
#zone-appli .hidden {
165
  display: none !important;
3120 delphine 166
}
167
 
3208 idir 168
#zone-appli .warning {
169
  color: #ff5d55;
170
  font-weight: 700;
171
}
172
 
3270 idir 173
#photos-conteneur label.label-file.error,
3274 idir 174
.control-group.error #connexion,
175
.control-group.error #bouton-inscription,
176
.control-group.error #bouton-anonyme,
177
.control-group.error #geoloc,
3208 idir 178
.control-group.error input,
179
.control-group.error select,
180
.control-group.error textarea {
181
  box-shadow: 0 0 1.5px 1px red;
182
  border-color: #b94a48;
183
  color: #b94a48;
184
}
185
 
186
.control-group.error {
187
  color: #b94a48;
188
}
189
 
190
#zone-appli .centre {
191
  margin: 0 auto !important;
192
  justify-content: center !important;
193
}
194
 
195
#zone-appli .droite {
196
  float: right;
197
}
198
 
199
#zone-appli .info {
200
  padding: 1rem;
201
  background-color: #ccecf1;
202
  border-color: #7ccedb;
203
  color: #006979;
204
  fill: #006979;
205
  border-radius: 0.2rem;
206
}
207
 
208
#zone-appli .clear {
3120 delphine 209
  clear: both;
210
  height: 0; overflow: hidden; /* Précaution pour IE 7 */
211
}
212
 
3208 idir 213
#zone-appli .ui-widget{
214
  font-family: Muli,sans-serif;
215
}
216
 
217
#zone-appli .form-inline .form-control {
218
  width: 100%;
219
}
220
 
221
#zone-appli #logo_hires {
222
  display: none;
223
}
224
#zone-appli .logo-tb {
225
  position:absolute;
226
  left: 10px;
227
  top: 10px;
228
}
229
 
230
#zone-appli .bloc-top {
231
  border-top: 1px solid rgba(0,0,0,.1);
232
  padding-top: 1rem;
233
}
234
 
235
#zone-appli .bloc-bottom {
236
  border-bottom: 1px solid rgba(0,0,0,.1);
237
  padding-bottom: 1rem;
238
}
239
 
240
.unstyled {
241
  list-style-type: none;
242
}
243
 
244
#zone-appli #formulaire form {
245
  margin-bottom: 1.5rem;
246
}
247
 
248
input[type="checkbox"],
249
input[type="radio"],
250
input.radio,
251
input.checkbox {
252
  vertical-align:text-top;
253
  padding: 0;
254
  margin-right: 10px;
255
  position:relative;
256
  overflow:hidden;
257
  top:2px;
258
}
259
 
260
#zone-appli #formulaire #form-supp #zone-supp .checkbox label,
261
#zone-appli #formulaire #form-supp #zone-supp .checkboxes label,
262
#zone-appli #formulaire #form-supp #zone-supp .radio label {
263
  align-items: center;
264
  display: flex;
265
  font-weight: 400;
266
}
267
 
268
/*************************************************************************/
269
 
270
form#form-observateur,
271
form#form-observation,
272
form#form-supp,
273
#tb-navigation,
274
#tb-navbar{
275
  min-width: 100%;
276
  margin-left: 0;
277
  margin-right: 0;
278
}
279
 
280
.navbar-nav,
281
.nav {
282
  display: -ms-flexbox;
283
  display: flex;
284
  -ms-flex-wrap: wrap;
285
  flex-wrap: wrap;
286
  margin-right: -15px;
287
  margin-left: -15px;
288
  flex-direction: row;
289
}
290
 
291
.navbar.navbar-default {
292
  margin-bottom: 0;
293
}
294
 
3239 idir 295
.volet {
3208 idir 296
  height: 5rem;
297
}
298
 
299
#anonyme {
300
  height: auto;
301
}
302
 
303
#bouton-connexion,
304
#creation-compte {
305
  display: -ms-flexbox;
306
  display: flex;
307
  height: 5rem;
308
  -webkit-box-flex: 1;
309
  -webkit-flex: 0 0 50%;
310
  -ms-flex: 0 0 50%;
311
  flex: 0 0 50%;
312
  max-width: 50%;
313
  -ms-flex-flow: row wrap;
314
  flex-flow: row wrap;
315
  min-height: 1px;
316
  padding-right: 15px;
317
  padding-left: 15px;
318
  justify-content: left;
319
  align-items: flex-start;
320
  align-content: flex-middle;
321
}
322
 
323
#bouton-connexion label,
324
#creation-compte label {
325
  width: 100%;
326
}
327
 
3239 idir 328
.navbar-default .navbar-nav > .volet #bouton-anonyme,
329
.navbar-default .navbar-nav > .volet #bouton-inscription {
3208 idir 330
  width: auto;
331
}
332
 
3239 idir 333
.navbar-default .navbar-nav > .volet > a  {
3208 idir 334
  margin-left: 0.2rem;
335
}
336
 
3269 idir 337
.navbar-default .navbar-nav #bouton-connexion a,
338
#ajouter-obs,
339
#transmettre-obs {
3208 idir 340
  color: #fff;
341
  background-color: #b2cb43;
342
  border-color: #a1b92e;;
343
}
344
 
345
.navbar-default .navbar-nav #bouton-connexion a:focus,
3269 idir 346
.navbar-default .navbar-nav #bouton-connexion a:hover,
347
#transmettre-obs:focus,
348
#transmettre-obs:hover,
349
#ajouter-obs:focus,
350
#ajouter-obs:hover {
3208 idir 351
  background-color: #a2b93b;
352
  border-color: #9ab227;
353
}
354
 
3239 idir 355
.navbar-default .navbar-nav #utilisateur-connecte.volet {
3208 idir 356
  padding-left: 2rem;
357
}
358
 
3239 idir 359
.navbar-default .navbar-nav #utilisateur-connecte.volet > a {
3208 idir 360
  margin-left: 0;
361
}
362
 
3239 idir 363
.navbar-default .navbar-nav #utilisateur-connecte.volet #profil-utilisateur,
364
.navbar-default .navbar-nav #utilisateur-connecte.volet #deconnexion {
365
  padding: 0 0.75rem;
366
  margin: 0.2rem 0;
367
}
368
 
369
.navbar-default .navbar-nav #utilisateur-connecte.volet .volet-menu a {
3208 idir 370
  font-size: 0.8rem;
371
  font-weight: 400;
372
  color: #606060;
373
  background: inherit;
374
  text-decoration: none;
375
  display: block;
376
  width: 100%;
377
  padding-left: 5px;
378
  line-height: 25px;
3239 idir 379
  outline: 0;
3208 idir 380
}
381
 
3239 idir 382
.navbar-default .navbar-nav #utilisateur-connecte.volet #profil-utilisateur:hover,
383
.navbar-default .navbar-nav #utilisateur-connecte.volet #deconnexion:hover,
384
.navbar-default .navbar-nav #utilisateur-connecte.volet #profil-utilisateur:focus,
385
.navbar-default .navbar-nav #utilisateur-connecte.volet #deconnexion:focus {
3208 idir 386
  background: #1e90ff;
387
}
388
 
3239 idir 389
.navbar-default .navbar-nav #utilisateur-connecte.volet .volet-menu a:hover,
390
.navbar-default .navbar-nav #utilisateur-connecte.volet .volet-menu a:focus {
391
  color: #fff;
3208 idir 392
}
393
 
3239 idir 394
.navbar-nav .volet-menu {
3208 idir 395
  position: absolute;
396
  z-index: 1000;
397
  min-width: auto;
398
  list-style: none;
399
  background-color: #fff;
400
  border: 1px solid #ccc;
401
  border: 1px solid rgba(0, 0, 0, 0.15);
402
  border-radius: 4px;
403
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
404
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
405
}
406
 
3239 idir 407
.volet-menu div a {
3208 idir 408
  color: #222;
409
}
410
 
3239 idir 411
.navbar-default .navbar-nav #utilisateur-connecte .volet-toggle::after {
412
  font-family: "Font Awesome 5 Free";
413
  font-size: 0.8rem;
414
  font-weight: 900;
415
  content: '\f0d7'
416
}
417
 
3208 idir 418
/*************************************************************************/
419
 
3352 idir 420
#zone-appli #formulaire .multiselect.list-checkbox {
3208 idir 421
  padding: 0;
422
  margin: 0;
423
}
424
 
425
#zone-appli #formulaire #form-supp #zone-supp select,
3352 idir 426
#zone-appli #formulaire .list-checkbox select,
427
#zone-appli #formulaire .selectBox select {
3208 idir 428
  background-color: #fff;
429
  border: 1px solid #ced4da;
430
}
431
 
432
#form-supp select,
3352 idir 433
.list-checkbox select,
434
.selectBox select{
3208 idir 435
  border-radius: 0.3rem;
436
}
437
 
438
#form-supp .select-wrapper,
3352 idir 439
.list-checkbox .select-wrapper,
440
#zone-appli #formulaire .selectBox {
3208 idir 441
  position: relative;
442
  z-index: 1000;
443
  border-radius: 0.3rem;
444
}
445
 
3352 idir 446
#zone-appli #formulaire .selectBox .focus {
3208 idir 447
  border-color: #80bdff;
448
  box-shadow: 0 0 0 .2rem rgba(0,123,255,.25);
449
}
450
 
3352 idir 451
#zone-appli #formulaire .input-group .select-wrapper {
3208 idir 452
  border:none;
453
}
454
 
3352 idir 455
#zone-appli #formulaire .overSelect {
3208 idir 456
  position: absolute;
457
  z-index: 999;
458
  left: 0;
459
  right: 0;
460
  top: 0;
461
  bottom: 0;
462
}
463
 
3352 idir 464
#zone-appli #formulaire .checkboxes {
3208 idir 465
  position: absolute;
3240 idir 466
  z-index: 1001;
467
  top: 120%;
3208 idir 468
  left: 1rem;
469
  right: 1rem;
470
  background-color: #fff;
471
  border: 1px solid #ced4da;
3240 idir 472
  border-top: 0;
3208 idir 473
  border-radius: 0 0 0.3rem 0.3rem;
474
  margin-top: -0.3rem;
475
}
476
 
477
#zone-appli #formulaire #form-supp #zone-supp .label label,
3352 idir 478
#zone-appli #formulaire .list-checkbox .label label,
479
#zone-appli #formulaire .checkboxes label {
3208 idir 480
  display: block;
481
  padding: 0.5rem;
482
  font-weight: 400;
483
  margin:0;
484
}
485
 
3352 idir 486
#zone-appli #formulaire .checkboxes label:hover {
3208 idir 487
  background: #1e90ff;
488
  color: #fff;
489
}
490
 
3352 idir 491
#zone-appli #formulaire .selectBox select option {
3208 idir 492
  padding-block-start: 0;
493
  padding-block-end: 0;
494
  padding-inline-start: 0;
495
  padding-inline-end: 0;
496
}
497
 
3352 idir 498
#zone-appli #formulaire .collect-other {
3208 idir 499
  margin: 0.5rem;
3242 idir 500
  width: 90%;
3208 idir 501
}
502
 
503
/*************************************************************************/
504
 
3240 idir 505
.range-values {
3239 idir 506
  color: #606060;
507
}
508
 
509
.range-live-value {
510
  padding-top: 1rem;
511
  font-size: 1rem;
512
}
513
 
3208 idir 514
/*******************************************/
515
 
516
.label-file {
517
  overflow: hidden;
518
  position: relative;
519
  cursor: pointer;
520
  border-radius: 0.25rem;
521
  font-weight: 400;
522
  font-size: 0.9rem;
523
  text-align: center;
524
  white-space: nowrap;
525
  vertical-align: middle;
526
  -webkit-user-select: none;
527
  -moz-user-select: none;
528
  -ms-user-select: none;
529
  user-select: none;
530
  border: 1px solid transparent;
531
  padding: .375rem .75rem;
532
  line-height: 1.5;
533
  transition:
534
    color .15s ease-in-out,
535
    background-color .15s ease-in-out,
536
    border-color .15s ease-in-out,
537
    box-shadow .15s ease-in-out;
538
  margin: 0;
539
}
540
 
541
.label-file [type=file] {
542
  cursor: inherit;
543
  display: block;
544
  font-size: 999px;
545
  filter: alpha(opacity=0);
546
  min-height: 100%;
547
  min-width: 100%;
548
  opacity: 0;
549
  position: absolute;
550
  right: 0;
551
  text-align: right;
552
  top: 0;
553
}
554
 
555
.label-file [type=file] {
556
  cursor: pointer;
557
}
558
 
559
/*************************************/
560
 
561
#miniatures .miniature {
562
  position: relative;
563
  display: inline-block;
564
 
565
}
566
 
567
#miniatures .miniature .miniature-img {
568
  vertical-align: top;
569
  width: 10rem;
570
  height: 100%;
571
}
572
 
573
#miniatures .miniature .effacer-miniature {
574
  display: flex;
575
  position: absolute;
576
  left: 0;
577
  right: 0;
578
  top: 0;
579
  bottom: 0;
580
  font-size: 2rem;
581
  background-color: rgba(0, 0, 0, 0.3);
582
  opacity: 0;
583
  color: #fff;
584
  padding: 0;
585
  margin: 0;
586
  height: 100%;
587
  width: 100%;
588
  align-items:center;
589
  justify-content: center;
590
  cursor: pointer;
591
}
592
 
593
#miniatures .miniature .effacer-miniature:hover,
594
#miniatures .miniature .effacer-miniature:focus {
595
  opacity: 1;
596
}
597
 
598
.obs {
599
  height: 10rem;
600
  padding: 1rem;
601
  border-radius: 0.25rem;
602
  background-color: #fbfbfb;
603
  border: 1px solid #eee;
604
}
605
 
606
.obs .nom-sci {
607
  font-size: 1rem;
608
}
609
 
610
.defilement-miniatures .defilement-miniatures-cache,
611
.defilement-miniatures .miniature-cachee {
612
  display: none;
613
}
614
 
615
.defilement-miniatures {
616
  display: flex;
617
  align-items:center;
618
  justify-content: center;
619
  height: 8rem;
620
}
621
.defilement-miniatures figure {
622
  display: inline-block;
623
  min-height: 8rem;
624
  line-height: 8rem;
625
  text-align: center;
626
  min-width: 80%;
627
  width: 80%;
628
  margin:0 auto;
629
  padding: 0;
630
}
631
 
632
.miniature-selectionnee {
633
  vertical-align: middle;
634
  max-height: 8rem;
635
  max-width: 80%;
636
}
637
 
638
.defilement-miniatures-gauche,
639
.defilement-miniatures-droite {
640
  display: inline-block;
641
  color: #5bc0de;
642
  vertical-align: middle;
643
  outline-style: none;
644
}
645
 
646
.defilement-miniatures-gauche:active,
647
.defilement-miniatures-droite:active,
648
.defilement-miniatures-gauche:focus,
649
.defilement-miniatures-droite:focus {
650
  color: #499fb7;
651
}
652
 
653
.defilement-miniatures-gauche:hover,
654
.defilement-miniatures-droite:hover {
655
  color: #499fb7;
656
}
657
 
3239 idir 658
#zone-prenom-nom #prenom,
659
#zone-prenom-nom #nom {
660
  z-index: 0;
661
}
3208 idir 662
 
663
#transmettre-obs{
664
  text-align: right;
665
}
666
 
667
#zone-liste-obs h2.transmission-title {
668
  display: inline-block;
669
}
670
 
671
footer a {
672
  display: inline-block;
673
}
674
 
3217 idir 675
.help-button {
676
  float: right;
677
}
678
 
3239 idir 679
#image-fond {
680
  position: fixed;
681
  top:0;
682
  bottom: 0;
683
  left: 0;
684
  right: 0;
685
  z-index: -1;
686
  min-width: 100%;
687
  background-attachment: fixed;
688
  margin: 0;
689
  padding: 0;
690
}
691
 
692
.modal-open, body.modal-open {
693
  overflow: inherit !important;
694
}
3260 idir 695
 
3242 idir 696
.custom-range {
697
  border: none;
698
}
3239 idir 699
 
3208 idir 700
/*************************************/
701
 
3240 idir 702
@media screen and ( max-width: 768px ) {
703
 
3260 idir 704
  #titre-projet {
705
    font-size: 1.5rem;
706
  }
707
 
708
  h2 {
709
    font-size: 1.3rem;
710
  }
711
 
712
  #logo {
713
    max-width: 80%;
714
  }
715
 
3208 idir 716
  #bouton-connexion, #creation-compte {
717
    display: block;
718
    width: 100%;
3240 idir 719
    position: static;
3208 idir 720
  }
3240 idir 721
 
722
  .navbar-nav, .nav {
723
    flex-direction: column;
724
  }
725
 
726
  #transmettre-obs.droite {
727
    float: none;
728
  }
729
 
730
  .obs {
731
    height: auto;
732
  }
733
 
734
  .obs .unstyled {
735
    font-size: 0.6rem;
736
  }
737
 
738
  .obs .nom-sci {
739
    font-size: 0.8rem;
740
  }
741
 
742
  .supprimer-obs {
743
    overflow: hidden;
744
  }
745
 
746
  #image-fond {
747
    display: none;
748
  }
3208 idir 749
}
750
 
3240 idir 751