source: spip-zone/_squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/stylesportailcognac.css.html @ 103418

Last change on this file since 103418 was 103418, checked in by real3t@…, 4 years ago

Positionnement du lien sur le carrousel du mode Cognac

File size: 14.3 KB
Line 
1#CACHE{24*3600,cache-client}
2#HTTP_HEADER{Content-Type: text/css; charset=iso-8859-15}
3#HTTP_HEADER{Vary: Accept-Encoding}
4
5#SET{c_vignettes_bk,(#CONFIG{soyezcreateurs_couleurs/vignettes_bk,#ffffff})}
6#SET{c_navigation,(#CONFIG{soyezcreateurs_couleurs/navigation,#017ca5})}
7        #SET{c_navigation_bk,(#CONFIG{soyezcreateurs_couleurs/navigation_bk,#ffffff})}
8#SET{c_menuhaut,(#CONFIG{soyezcreateurs_couleurs/menuhaut,#017ca5})}
9        #SET{c_menuhaut_bk,(#CONFIG{soyezcreateurs_couleurs/menuhaut_bk,#ffffff})}
10#SET{c_extra,(#CONFIG{soyezcreateurs_couleurs/extra,#017ca5})}
11        #SET{c_extra_bk,(#CONFIG{soyezcreateurs_couleurs/extra_bk,#ffffff})}
12#SET{c_menu_a,(#CONFIG{soyezcreateurs_couleurs/menu_a,#005e7a})}
13        #SET{c_menu_a_bk,(#CONFIG{soyezcreateurs_couleurs/menu_a_bk,#ffffff})}
14
15#SET{LargeurContaineur,(#CONFIG{soyezcreateurs_layout/largeurconteneur,960})}
16#SET{LargeurMenuGauche,(#CONFIG{soyezcreateurs_layout/largeurmenugauche,180})}
17#SET{LargeurMenuDroit,(#CONFIG{soyezcreateurs_layout/largeurmenudroit,180})}
18#SET{LargeurMilieu,(#GET{LargeurContaineur}|moins{#GET{LargeurMenuGauche}}|moins{#GET{LargeurMenuDroit}}|div{2})}
19
20div#content { width: 100%; }
21
22
23.portailcognac {
24  /* clearfix */
25  /* ---- grid ---- */
26  /* ---- grid-item ---- */
27}
28.portailcognac iframe {
29  width: 100%!important;
30}
31.portailcognac img {
32  display: inline-block;
33  vertical-align: middle;
34  max-width: 100%;
35  height: auto;
36  -ms-interpolation-mode: bicubic;
37}
38.portailcognac :focus {
39  outline: none;
40}
41.portailcognac select {
42  cursor: pointer;
43}
44.portailcognac .spip_logo {
45  max-width: 100%;
46}
47.portailcognac .ariaformprop {
48  padding: 0;
49  margin: 0;
50  position: relative;
51  z-index: 99;
52  background-color: white;
53  font-size: 80%;
54}
55.portailcognac .ajaxbloc {
56  height: 100%!important;
57}
58.portailcognac .row {
59  margin-right: auto;
60  margin-left: auto;
61}
62.portailcognac .text-center {
63  text-align: center!important;
64}
65.portailcognac .text-right {
66  text-align: right!important;
67}
68.portailcognac .text-left {
69  text-align: left!important;
70}
71.portailcognac .menu {
72  margin: 0;
73  list-style-type: none;
74}
75.portailcognac .menu > li {
76  display: table-cell;
77  vertical-align: middle;
78}
79.portailcognac .vertical > li {
80  display: block;
81  vertical-align: middle;
82}
83.portailcognac .flexbox-flex {
84  display: flex;
85  align-items: baseline;
86  margin-bottom: .5em;
87}
88.portailcognac .flexbox-center-center {
89  display: flex;
90  align-items: center;
91  justify-content: center;
92  flex-wrap: wrap;
93}
94.portailcognac .flexbox-center-top {
95  display: flex!important;
96  align-items: stretch;
97  justify-content: center;
98  flex-wrap: wrap;
99}
100.portailcognac .flexbox--center {
101  display: flex;
102  align-items: center;
103}
104.portailcognac .flexbox-flex-row-reverse {
105  display: flex;
106  flex-direction: row-reverse;
107}
108.portailcognac .flex-nowrap {
109  flex-wrap: nowrap;
110}
111.portailcognac .flexbox-wrap-space-between {
112  display: flex;
113  flex-wrap: wrap;
114  align-content: space-between;
115}
116.portailcognac .flexbox-wrap-space-around {
117  display: flex;
118  flex-wrap: wrap;
119  justify-content: space-around;
120}
121.portailcognac .flexbox-center-space-between {
122  display: flex;
123  align-items: center;
124  justify-content: space-between;
125}
126.portailcognac .flexbox-start-space-between {
127  display: flex;
128  align-items: flex-start;
129  justify-content: space-between;
130}
131@media screen and (max-width: 47.9375em) {
132  .portailcognac .flex-nowrap {
133    flex-wrap: wrap;
134  }
135}
136.portailcognac .flexbox-stretch {
137  display: flex;
138  align-items: stretch;
139}
140@media screen and (max-width: 40em) {
141  .portailcognac .flexbox-stretch {
142    display: block;
143  }
144}
145.portailcognac .hide {
146  display: none!important;
147}
148.portailcognac .sans-border {
149  border: 0!important;
150}
151.portailcognac .avec-border {
152  border: 1px solid #aaa!important;
153}
154.portailcognac .avec-border-top {
155  border-top: 1px solid #aaa!important;
156}
157.portailcognac .avec-border-bottom {
158  border-bottom: 1px solid #aaa!important;
159}
160.portailcognac .avec-border-left {
161  border-left: 1px solid #aaa!important;
162}
163.portailcognac .sans-margin {
164  margin: 0!important;
165}
166.portailcognac .avec-margin {
167  margin: 1.5em!important;
168}
169.portailcognac .avec-margin-top {
170  margin-top: 1.5em!important;
171}
172.portailcognac .avec-margin-right {
173  margin-right: 1.5em!important;
174}
175.portailcognac .avec-margin-bottom {
176  margin-bottom: 1.5em!important;
177}
178.portailcognac .avec-margin-bottom05 {
179  margin-bottom: .5em!important;
180}
181.portailcognac .avec-margin-bottom015 {
182  margin-bottom: .15em!important;
183}
184.portailcognac .avec-margin-left {
185  margin-left: 1.5em!important;
186}
187@media screen and (min-width: 40em) {
188  .portailcognac .avec-margin-bottom-for-medium {
189    margin-bottom: 1.5em!important;
190  }
191}
192.portailcognac .sans-padding {
193  padding: 0!important;
194}
195@media screen and (max-width: 40em) {
196  .portailcognac .sans-padding-for-small {
197    padding: 0!important;
198  }
199}
200.portailcognac .avec-padding {
201  padding: 1em!important;
202}
203.portailcognac .avec-padding05 {
204  padding: .5em!important;
205}
206.portailcognac .avec-padding-top {
207  padding-top: 1em!important;
208}
209.portailcognac .avec-padding-top05 {
210  padding-top: .5em!important;
211}
212.portailcognac .avec-padding-top15 {
213  padding-top: 1.5em!important;
214}
215.portailcognac .avec-padding-right {
216  padding-right: 1em!important;
217}
218.portailcognac .avec-padding-right05 {
219  padding-right: .5em!important;
220}
221.portailcognac .avec-padding-bottom {
222  padding-bottom: 1em!important;
223}
224.portailcognac .avec-padding-left {
225  padding-left: 1em!important;
226}
227.portailcognac .avec-padding-leftright {
228  display: block;
229  padding-right: 1em!important;
230  padding-left: 1em!important;
231}
232.portailcognac .display-block {
233  display: block!important;
234}
235.portailcognac .text-transform-none {
236  text-transform: none!important;
237}
238.portailcognac .text-uppercase {
239  text-transform: uppercase!important;
240}
241.portailcognac .font-style-italic {
242  font-style: italic!important;
243}
244.portailcognac .position-relative {
245  position: relative!important;
246}
247.portailcognac .float-left {
248  float: left !important;
249}
250.portailcognac .float-right {
251  float: right !important;
252}
253.portailcognac .float-center {
254  display: table;
255  margin-right: auto !important;
256  margin-left: auto !important;
257}
258.portailcognac .z-index-999 {
259  z-index: 999!important;
260}
261.portailcognac .cursor-pointer {
262  cursor: pointer;
263}
264.portailcognac .slick-slider {
265  margin-bottom: 4em;
266}
267
268.portailcognac #liens-diaporama {
269  position: absolute;
270  top: 100px;
271  right: 0;
272}
273@media only screen and (max-width:[(#GET{LargeurContaineur})]px) {
274  .portailcognac #liens-diaporama {
275    top: 5vw;
276  }
277}
278@media only screen and (max-width: 767px) {
279  .portailcognac #liens-diaporama {
280    position: relative;
281    top: 50px;
282  }
283}
284.portailcognac #liens-diaporama ul {
285  width: 220px;
286  text-align: right;
287}
288@media only screen and (max-width: 767px) {
289  .portailcognac #liens-diaporama ul {
290    display: flex;
291    width: 100%;
292    flex-wrap: wrap;
293  }
294}
295.portailcognac #liens-diaporama li {
296  background-color: rgba(255, 255, 255, 0.75);
297  margin-bottom: .5em;
298}
299@media only screen and (max-width: 767px) {
300  .portailcognac #liens-diaporama li {
301    flex-grow: 1;
302  }
303}
304.portailcognac #liens-diaporama li a {
305  display: flex;
306  font-size: 1.2em;
307  color: #GET{c_menu_a};
308  justify-content: flex-end;
309  line-height: 1 !important;
310  align-items: center;
311}
312.portailcognac #liens-diaporama li a span {
313  padding: .5em .25em .5em .5em;
314}
315@media only screen and (max-width: 767px) {
316  .portailcognac #liens-diaporama li a span {
317    padding: .25em .5em;
318  }
319}
320.portailcognac #liens-diaporama li a span.icon {
321  margin-left: .25em;
322  padding-left: .25em;
323  font-size: 1.8em;
324  border-left: 1px solid;
325  border-left-color: inherit;
326}
327@media only screen and (max-width: 767px) {
328  .portailcognac #liens-diaporama li a {
329    background-color: #eae9e5;
330    margin-left: .5em;
331  }
332}
333
334.portailcognac .slick-slide img {
335  margin: 0 auto;
336}
337.portailcognac .slick-slide .row {
338  max-width: none!important;
339}
340.portailcognac .slick-dots {
341  bottom: -45px;
342}
343.portailcognac .slick-dots li {
344  width: 30px;
345  height: 30px;
346}
347.portailcognac .slick-dots li button {
348  width: 30px;
349  height: 30px;
350}
351.portailcognac .slick-dots li button::before {
352  font-size: 20px;
353  line-height: 30px;
354  width: 30px;
355  height: 30px;
356}
357.portailcognac .slick-dots li.slick-active button::before {
358  color: black;
359}
360.portailcognac #content img {
361  padding: 0;
362}
363.portailcognac .slider-pratique {
364  margin: 0 4rem;
365}
366.portailcognac .slider-pratique .slick-prev,
367.portailcognac .slider-pratique .slick-next {
368  width: 40px;
369  height: 40px;
370}
371.portailcognac .slider-pratique .slick-prev {
372  left: -40px;
373}
374.portailcognac .slider-pratique .slick-next {
375  right: -40px;
376}
377.portailcognac .slider-pratique .slick-prev:before,
378.portailcognac .slider-pratique .slick-next:before {
379  font-size: 40px;
380  color: #777;
381  opacity: 1;
382}
383.portailcognac .slider-pratique .slick-prev:hover:before,
384.portailcognac .slider-pratique .slick-prev:focus:before,
385.portailcognac .slider-pratique .slick-next:hover:before,
386.portailcognac .slider-pratique .slick-next:focus:before {
387  opacity: 1;
388  color: #333 !important;
389}
390.portailcognac .slider-pratique button:hover,
391.portailcognac .slider-pratique button:focus {
392  background-color: transparent!important;
393}
394.portailcognac .slider-pratique .content-pratique {
395  background-color: #aaa;
396  width: 280px;
397  margin: 0 12px;
398  -webkit-transition: all .25s ease!important;
399  transition: all .25s ease!important;
400}
401.portailcognac .slider-pratique .content-pratique:hover,
402.portailcognac .slider-pratique .content-pratique:focus {
403  -webkit-transition: all .25s ease!important;
404  transition: all .25s ease!important;
405}
406.portailcognac .slider-pratique h2 {
407  display: flex;
408  height: 50px;
409  margin: 0!important;
410  color: white!important;
411  text-align: right;
412}
413.portailcognac .slider-pratique h2 .titre-pratique {
414  width: 100%;
415  align-self: center;
416  text-align: center;
417}
418.portailcognac .slider-pratique h2 .icon {
419  align-self: center;
420  padding: 7px 15px 7px 7px;
421  font-size: 30px;
422}
423@media only screen and (max-width: 400px) {
424  .portailcognac .slider-pratique {
425    margin: 0 2.8rem;
426  }
427  .portailcognac .slider-pratique .content-pratique {
428    width: 240px;
429  }
430  .portailcognac .slider-pratique h2 {
431    height: 130px;
432  }
433}
434.portailcognac .clearfix:after,
435.portailcognac .grid:after {
436  content: '';
437  display: block;
438  clear: both;
439}
440.portailcognac #masonry {
441  max-width: 1200px;
442  margin: 0 auto;
443  padding-left: 20px;
444  text-align: center;
445}
446.portailcognac .grid {
447  text-align: center;
448}
449.portailcognac .grid-item {
450  background-color: #ccc;
451  width: calc(25% - 20px);
452  height: calc(340px + 65px);
453}
454.portailcognac .grid-item:hover,
455.portailcognac .grid-item:focus {
456  background-color: #eee;
457}
458.portailcognac .grid-item .content-actus:nth-child(2) {
459  margin-top: 20px;
460  border-top: 20px solid white;
461}
462.portailcognac .grid-item header {
463  font-size: 18px;
464  overflow: auto;
465}
466.portailcognac .grid-item header strong {
467  font-size: inherit;
468}
469.portailcognac .grid-item header time {
470  padding: .75em .5em;
471}
472.portailcognac .grid-item header img {
473  max-width: 65%!important;
474}
475.portailcognac .grid-item h2 {
476  display: flex;
477  flex-direction: column;
478  width: 100%;
479  height: 50px;
480  margin: 0!important;
481  padding: 10px;
482  text-align: center;
483  border: none!important;
484}
485.portailcognac .grid-item h2 .icon {
486  align-self: center;
487  padding: 7px;
488  font-size: 30px;
489}
490.portailcognac .grid-item h2 .titre-actus {
491  width: 100%;
492  padding: 10px;
493}
494.portailcognac .grid-item img {
495  max-width: 100%;
496}
497.portailcognac .grid-item-x2 {
498  width: calc(50% - 20px);
499}
500.portailcognac .grid-item-x3 {
501  width: calc(75% - 20px);
502}
503.portailcognac .grid-item {
504  margin-bottom: 20px;
505}
506@media only screen and (max-width: 1200px) {
507  .portailcognac .grid-item {
508    height: calc(26vw + 90px);
509  }
510}
511@media only screen and (max-width:[(#GET{LargeurContaineur})]px) {
512  .portailcognac .grid-item {
513    width: calc(33.333% - 20px);
514    height: calc(34.5vw + 90px);
515  }
516  .portailcognac .grid-item-x2 {
517    width: calc(66.666% - 20px);
518  }
519  .portailcognac .grid-item-x3 {
520    width: calc(100% - 20px);
521  }
522}
523@media only screen and (max-width: 680px) {
524  .portailcognac .grid-item {
525    width: calc(50% - 20px);
526    height: auto;
527  }
528  .portailcognac .grid-item-x2 {
529    width: calc(100% - 20px);
530  }
531}
532@media only screen and (max-width: 540px) {
533  .portailcognac .grid-item {
534    width: calc(100% - 20px);
535  }
536}
537.portailcognac #lesprojets {
538  margin-top: 5em;
539  margin-bottom: 4em;
540}
541.portailcognac #projets {
542  margin: 0;
543  padding: 0;
544}
545.portailcognac #projets article {
546  background-color: #777;
547  width: 50%;
548  float: left;
549}
550.portailcognac #projets article:hover {
551  background-color: #aaa!important;
552}
553.portailcognac #projets a {
554  display: flex;
555  flex-direction: column;
556  height: 10vw;
557  color: white;
558  border: 4px solid white;
559}
560.portailcognac #projets a:hover {
561  color: #333!important;
562}
563.portailcognac #projets h2 {
564  width: 100%;
565  height: auto;
566  margin: auto;
567  padding: 0 10px;
568  color: inherit;
569  text-align: center;
570  border: none;
571}
572.portailcognac #projets .suite {
573  background-color: rgba(100, 100, 100, 0.5);
574  height: auto;
575  padding: 25px;
576}
577.portailcognac #projets .suite .icon {
578  margin: auto;
579}
580@media only screen and (max-width:[(#GET{LargeurContaineur})]px) {
581  .portailcognac #projets h2 {
582    font-size: 36px;
583    line-height: 38px;
584  }
585}
586@media only screen and (max-width: 768px) {
587  .portailcognac #projets h2 {
588    font-size: 30px;
589    line-height: 34px;
590  }
591}
592@media only screen and (max-width: 640px) {
593  .portailcognac #projets article {
594    width: 100%;
595    float: none;
596  }
597  .portailcognac #projets article a {
598    height: auto;
599  }
600  .portailcognac #projets h2 {
601    padding: 1rem;
602    font-size: 26px;
603    line-height: 30px;
604  }
605  .portailcognac #projets .suite .icon {
606    font-size: 25px;
607  }
608}
609
610.portailcognac #pratique {
611  margin-bottom: 4em;
612}
613
614
615
616
617[(#CHEMIN{images/stylesportailcognac_perso.css}|?{'/* Surcharge eventuelle */'})
618[(#INCLURE{#CHEMIN{images/stylesportailcognac_perso.css}|url_absolue_css}|compacte{css})]
619]
Note: See TracBrowser for help on using the repository browser.