forked from Chapril/www.chapril.org-spip
1295 lines
19 KiB
CSS
1295 lines
19 KiB
CSS
@font-face
|
|
{
|
|
font-family:'dejavu_sanscondensed';
|
|
src:url(webfonts/DejaVuSansCondensed-webfont.eot);
|
|
src:url(webfonts/DejaVuSansCondensed-webfont.eot?#iefix) format("embedded-opentype"),url(webfonts/DejaVuSansCondensed-webfont.woff) format("woff"),url(webfonts/DejaVuSansCondensed-webfont.svg#dejavu_sanscondensed) format("svg");
|
|
font-weight:400;
|
|
font-style:normal
|
|
}
|
|
|
|
@font-face
|
|
{
|
|
font-family:'dejavu_sanscondensed_oblique';
|
|
src:url(webfonts/DejaVuSansCondensed-Oblique-webfont.eot);
|
|
src:url(webfonts/DejaVuSansCondensed-Oblique-webfont.eot?#iefix) format("embedded-opentype"),url(webfonts/DejaVuSansCondensed-Oblique-webfont.woff) format("woff"),url(webfonts/DejaVuSansCondensed-Oblique-webfont.svg#dejavu_sanscondensed_oblique) format("svg");
|
|
font-weight:400;
|
|
font-style:normal
|
|
}
|
|
|
|
@font-face
|
|
{
|
|
font-family:'dejavu_sanscondensed_bold';
|
|
src:url(webfonts/DejaVuSansCondensed-Bold-webfont.eot);
|
|
src:url(webfonts/DejaVuSansCondensed-Bold-webfont.eot?#iefix) format("embedded-opentype"),url(webfonts/DejaVuSansCondensed-Bold-webfont.woff) format("woff"),url(webfonts/DejaVuSansCondensed-Bold-webfont.svg#dejavu_sanscondensed_bold) format("svg");
|
|
font-weight:400;
|
|
font-style:normal
|
|
}
|
|
|
|
*
|
|
{
|
|
margin:0;
|
|
padding:0
|
|
}
|
|
|
|
a
|
|
{
|
|
text-decoration:none;
|
|
color:#2e5281
|
|
}
|
|
|
|
a:hover
|
|
{
|
|
color:#ff5e00
|
|
}
|
|
|
|
a:active
|
|
{
|
|
color:#5bc6f2
|
|
}
|
|
|
|
body
|
|
{
|
|
font-family:'dejavu_sanscondensed',sans-serif;
|
|
color:#5f5f5f;
|
|
background-color:#f7f7f9
|
|
}
|
|
|
|
p,li
|
|
{
|
|
font-size:14px;
|
|
line-height:24px
|
|
}
|
|
|
|
h1,h2,h3,H4
|
|
{
|
|
color:#2e5281;
|
|
font-weight:400
|
|
}
|
|
|
|
h1
|
|
{
|
|
font-size:32px
|
|
}
|
|
|
|
h2
|
|
{
|
|
font-size:24px
|
|
}
|
|
|
|
h3
|
|
{
|
|
font-size:21px
|
|
}
|
|
|
|
H4
|
|
{
|
|
font-size:19px
|
|
}
|
|
|
|
a[href*]
|
|
{
|
|
color:#2e5281
|
|
}
|
|
|
|
header
|
|
{
|
|
display:grid;
|
|
grid-template-rows:75px;
|
|
grid-template-columns:15% 70% 15%;
|
|
background-color:#005184;
|
|
color:#fff
|
|
}
|
|
|
|
header > a
|
|
{
|
|
grid-row-start:1;
|
|
grid-row-end:-1;
|
|
grid-column-start:1;
|
|
grid-column-end:2;
|
|
justify-self:flex-end;
|
|
align-self:center;
|
|
margin:10px
|
|
}
|
|
|
|
header p a
|
|
{
|
|
color:#fff
|
|
}
|
|
|
|
header .spip_logos, header .spip_logo
|
|
{
|
|
width:auto;
|
|
height:45px
|
|
}
|
|
|
|
#navigation
|
|
{
|
|
grid-column-start:2;
|
|
grid-column-end:3;
|
|
list-style-type:none;
|
|
text-transform:uppercase;
|
|
font-size:12px;
|
|
letter-spacing:1px;
|
|
display:grid;
|
|
grid-template-columns:repeat(auto-fit,minmax(0,1fr));
|
|
justify-items:center;
|
|
align-content:center;
|
|
align-items:center;
|
|
justify-content:center;
|
|
margin-right:6rem
|
|
}
|
|
|
|
header #navigation a
|
|
{
|
|
text-align:center
|
|
}
|
|
|
|
.menu-mobile-ouvre
|
|
{
|
|
display:none
|
|
}
|
|
|
|
.menu-mobile-ferme
|
|
{
|
|
display:none
|
|
}
|
|
|
|
header p
|
|
{
|
|
grid-row-start:1;
|
|
grid-row-end:-1;
|
|
grid-column-start:3;
|
|
grid-column-end:-1;
|
|
justify-self:flex-end;
|
|
align-self:center;
|
|
padding-right:2rem
|
|
}
|
|
|
|
header nav a
|
|
{
|
|
color:#fff
|
|
}
|
|
|
|
header a:hover
|
|
{
|
|
color:#ff9759
|
|
}
|
|
|
|
header p
|
|
{
|
|
margin:0 10px 0 0;
|
|
color:#e2edf9;
|
|
font-size:11px;
|
|
line-height:15px
|
|
}
|
|
|
|
.banniere
|
|
{
|
|
display:grid;
|
|
grid-template-rows:440px;
|
|
grid-template-columns:1fr;
|
|
background:url(../img/bann-2-ecrans.png),url(../img/bann-3-ecrans.png),url(../img/bann-fond.png),linear-gradient(to right,#1878c3,#538ce8,#81c1ff);
|
|
background-repeat:no-repeat,no-repeat,no-repeat,no-repeat;
|
|
background-position:bottom -240px right -50%,bottom -190px left 10%,bottom -230px center,center center;
|
|
background-size:800px,800px,650px,100%
|
|
}
|
|
|
|
.banniere article
|
|
{
|
|
grid-column-start:1;
|
|
grid-column-end:-1;
|
|
grid-row-start:1;
|
|
grid-row-end:-1;
|
|
justify-self:center;
|
|
padding-top:100px
|
|
}
|
|
|
|
.banniere article h1
|
|
{
|
|
color:#fff;
|
|
font-size:35px
|
|
}
|
|
|
|
.banniere article p
|
|
{
|
|
display:flex;
|
|
justify-content:center;
|
|
flex-direction:row;
|
|
padding-top:20px
|
|
}
|
|
|
|
.banniere article a
|
|
{
|
|
margin:1rem 3rem 0 0;
|
|
color:#fff;
|
|
font-size:11px;
|
|
text-transform:uppercase;
|
|
letter-spacing:1px;
|
|
font-family:'dejavu_sanscondensed_bold';
|
|
padding:.3rem 1rem;
|
|
background-color:#2e5281;
|
|
border-radius:5px;
|
|
box-shadow:0 0 5px 0 rgba(0,81,132,0.5)
|
|
}
|
|
|
|
.banniere article a ~ a
|
|
{
|
|
color:#2e5281;
|
|
background-color:#fff;
|
|
margin-right:0
|
|
}
|
|
|
|
.banniere article a:hover
|
|
{
|
|
color:#fff;
|
|
background-color:#ff5e00
|
|
}
|
|
|
|
.presentation
|
|
{
|
|
display:grid;
|
|
grid-template-rows:1fr;
|
|
grid-template-columns:10% 40% 40% 10%
|
|
}
|
|
|
|
.presentation article
|
|
{
|
|
grid-row-start:1;
|
|
grid-row-end:-1;
|
|
grid-column-start:2;
|
|
grid-column-end:3;
|
|
margin:0 50px
|
|
}
|
|
|
|
.presentation article + article
|
|
{
|
|
grid-row-start:1;
|
|
grid-row-end:-1;
|
|
grid-column-start:3;
|
|
grid-column-end:4;
|
|
padding-bottom: 100px;
|
|
}
|
|
|
|
.presentation article h2
|
|
{
|
|
padding:3rem 0
|
|
}
|
|
.presentation h3
|
|
{
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
|
|
.bouton-simple
|
|
{
|
|
text-transform:uppercase;
|
|
font-size:13px;
|
|
font-family:'dejavu_sanscondensed';
|
|
letter-spacing:1px;
|
|
padding:10px 0;
|
|
margin:1rem 0;
|
|
display:block;
|
|
color:#416687
|
|
}
|
|
|
|
articles div
|
|
{
|
|
margin-bottom:1.5rem
|
|
}
|
|
|
|
.bouton-utilise
|
|
{
|
|
display:block;
|
|
max-width:200px;
|
|
min-width:100px;
|
|
margin-top:.7rem;
|
|
text-align:center;
|
|
color:#fff;
|
|
font-size:12px;
|
|
text-transform:uppercase;
|
|
letter-spacing:1px;
|
|
font-family:'dejavu_sanscondensed_bold';
|
|
background-color:#2e5281;
|
|
box-shadow:0 0 5px 0 rgba(0,81,132,0.5);
|
|
border-radius:7px;
|
|
padding:.7rem 1rem
|
|
}
|
|
|
|
.bouton-utilise:hover
|
|
{
|
|
color:#fff;
|
|
background-color:#ff5e00
|
|
}
|
|
|
|
.presentation blockquote.postscriptum p
|
|
{
|
|
font-family:dejavu_sanscondensed_oblique;
|
|
font-size:12px;
|
|
line-height:17px;
|
|
margin:0;
|
|
padding:.5rem 0
|
|
}
|
|
|
|
.derniers-services
|
|
{
|
|
display:grid;
|
|
grid-template-rows:1fr;
|
|
grid-template-columns:10% 40% 40% 10%;
|
|
margin:4rem 0
|
|
}
|
|
|
|
.sous-titre
|
|
{
|
|
grid-row-start:1;
|
|
grid-row-end:2;
|
|
grid-column-start:1;
|
|
grid-column-end:-1;
|
|
text-align:center
|
|
}
|
|
|
|
.derniers-services article
|
|
{
|
|
grid-row-start:2;
|
|
grid-row-end:3;
|
|
grid-column-start:2;
|
|
grid-column-end:3;
|
|
margin:20px 40px;
|
|
text-align:center;
|
|
background-color:#fff;
|
|
border-radius:8px;
|
|
border-top:14px #b0cbe8 solid;
|
|
box-shadow:0 0 5px 0 rgba(0,81,132,0.5)
|
|
}
|
|
|
|
.derniers-services article + article
|
|
{
|
|
grid-row-start:2;
|
|
grid-row-end:3;
|
|
grid-column-start:3;
|
|
grid-column-end:4
|
|
}
|
|
|
|
.derniers-services article + article + article
|
|
{
|
|
grid-row-start:3;
|
|
grid-row-end:4;
|
|
grid-column-start:2;
|
|
grid-column-end:3
|
|
}
|
|
|
|
.derniers-services article + article + article + article
|
|
{
|
|
grid-row-start:3;
|
|
grid-row-end:4;
|
|
grid-column-start:3;
|
|
grid-column-end:4
|
|
}
|
|
|
|
.derniers-services .bouton-appel
|
|
{
|
|
grid-column-start:1;
|
|
grid-column-end:-1;
|
|
margin:5rem auto;
|
|
text-align:center;
|
|
color:#fff;
|
|
font-size:14px;
|
|
text-transform:uppercase;
|
|
letter-spacing:1px;
|
|
font-family:'dejavu_sanscondensed_bold';
|
|
background-color:#2e5281;
|
|
box-shadow:0 0 5px 0 rgba(0,81,132,0.5);
|
|
border-radius:10px;
|
|
padding:1.2rem 2.5rem;
|
|
min-width:250px;
|
|
max-width:300px
|
|
}
|
|
|
|
.derniers-services blockquote.postscriptum p
|
|
{
|
|
font-family:'dejavu_sanscondensed_oblique';
|
|
font-size:12px;
|
|
line-height:17px;
|
|
padding:.5rem 1rem 1rem
|
|
}
|
|
|
|
.master-rubrique .derniers-services
|
|
{
|
|
display:grid;
|
|
grid-template-rows:1fr;
|
|
grid-template-columns:10% 80% 10%;
|
|
margin:4rem 0
|
|
}
|
|
|
|
.master-rubrique .sous-titre
|
|
{
|
|
grid-row-start:1;
|
|
grid-row-end:2;
|
|
grid-column-start:1;
|
|
grid-column-end:-1
|
|
}
|
|
|
|
.master-rubrique .tous-les-services
|
|
{
|
|
grid-row-start:2;
|
|
grid-row-end:-1;
|
|
grid-column-start:2;
|
|
grid-column-end:3;
|
|
display:flex;
|
|
flex-flow:row wrap;
|
|
justify-content:space-between
|
|
}
|
|
|
|
.master-rubrique .derniers-services article
|
|
{
|
|
width:45%;
|
|
margin:1rem;
|
|
text-align:center;
|
|
background-color:#fff;
|
|
border-radius:8px;
|
|
border-top:14px #b0cbe8 solid;
|
|
box-shadow:0 0 5px 0 rgba(0,81,132,0.5)
|
|
}
|
|
|
|
.master-rubrique .derniers-services h2
|
|
{
|
|
padding:1rem 0;
|
|
height:2rem
|
|
}
|
|
|
|
.derniers-services .bouton-appel:hover
|
|
{
|
|
color:#fff;
|
|
background-color:#ff5e00
|
|
}
|
|
|
|
.derniers-services h2,.derniers-services h1
|
|
{
|
|
text-transform:lowercase;
|
|
height:4rem
|
|
}
|
|
|
|
.derniers-services h2::first-letter,.derniers-services h1::first-letter
|
|
{
|
|
text-transform:uppercase
|
|
}
|
|
|
|
.derniers-services h3
|
|
{
|
|
text-align:center;
|
|
margin:2rem auto .7rem
|
|
}
|
|
|
|
.derniers-services p
|
|
{
|
|
text-align:left;
|
|
padding:1rem
|
|
}
|
|
|
|
.derniers-services img
|
|
{
|
|
width:90%;
|
|
box-shadow:0 0 5px 0 rgba(0,81,132,0.5);
|
|
height:auto;
|
|
margin:.5rem auto
|
|
}
|
|
|
|
.derniers-services .bouton-utilise
|
|
{
|
|
max-width:120px;
|
|
margin:1rem auto 1.5rem
|
|
}
|
|
|
|
.engagements
|
|
{
|
|
display:grid;
|
|
grid-template-rows:1fr;
|
|
grid-template-columns:10% 26.6666666% 26.6666666% 26.6666666% 10%;
|
|
margin-bottom:4rem
|
|
}
|
|
|
|
.engagements article
|
|
{
|
|
grid-row-start:1;
|
|
grid-row-end:-1;
|
|
grid-column-start:2;
|
|
grid-column-end:3;
|
|
margin:0 1rem
|
|
}
|
|
|
|
.engagements article + article
|
|
{
|
|
grid-column-start:3;
|
|
grid-column-end:4
|
|
}
|
|
|
|
.engagements article + article + article
|
|
{
|
|
grid-column-start:4;
|
|
grid-column-end:5
|
|
}
|
|
|
|
.engagements article img
|
|
{
|
|
margin:0 auto 2rem;
|
|
display:block;
|
|
width:auto;
|
|
height:60px
|
|
}
|
|
|
|
.engagements h2
|
|
{
|
|
padding-bottom:1.5rem;
|
|
text-align:center
|
|
}
|
|
|
|
footer
|
|
{
|
|
display:grid;
|
|
grid-template-rows:80px;
|
|
grid-template-columns:15% 42.5% 42.5%;
|
|
background-color:#005184;
|
|
color:#fff;
|
|
margin-top:6rem
|
|
}
|
|
|
|
footer ul
|
|
{
|
|
grid-row-start:1;
|
|
grid-row-end:-1;
|
|
grid-column-start:2;
|
|
grid-column-end:3;
|
|
align-self:center;
|
|
list-style-type:none;
|
|
font-size:10px;
|
|
text-transform:uppercase;
|
|
letter-spacing:1px
|
|
}
|
|
|
|
footer .signature-april
|
|
{
|
|
grid-row-start:1;
|
|
grid-row-end:-1;
|
|
grid-column-start:3;
|
|
grid-column-end:-1;
|
|
justify-self:flex-end;
|
|
align-self:center;
|
|
display:flex;
|
|
margin-right:right;
|
|
height:20px
|
|
}
|
|
|
|
.signature-april p
|
|
{
|
|
font-size:11px;
|
|
line-height:30px
|
|
}
|
|
|
|
footer img
|
|
{
|
|
margin:0 2rem 0 1rem;
|
|
width:auto;
|
|
height:30px
|
|
}
|
|
|
|
footer ul a
|
|
{
|
|
color:#fff;
|
|
font-size:10px
|
|
}
|
|
|
|
footer ul a:hover
|
|
{
|
|
color:#ff9759
|
|
}
|
|
|
|
.contenu-texte
|
|
{
|
|
display:grid;
|
|
grid-template-rows:1fr;
|
|
grid-template-columns:15% 70% 15%
|
|
}
|
|
|
|
.contenu-texte article
|
|
{
|
|
grid-row-start:1;
|
|
grid-row-end:-1;
|
|
grid-column-start:2;
|
|
grid-column-end:3
|
|
}
|
|
|
|
.contenu-texte h1
|
|
{
|
|
grid-row-start:1;
|
|
grid-row-end:2;
|
|
grid-column-start:2;
|
|
grid-column-end:3;
|
|
margin:4rem 0 0
|
|
}
|
|
|
|
.contenu-texte h3
|
|
{
|
|
margin:3rem 0 1rem
|
|
}
|
|
|
|
.contenu-texte strong
|
|
{
|
|
margin:2rem 0 .5rem;
|
|
display:block;
|
|
font-size:17px;
|
|
color:#2e5281;
|
|
font-family:'dejavu_sanscondensed'
|
|
}
|
|
|
|
.contenu-texte ul
|
|
{
|
|
list-style:none;
|
|
padding-left:20px;
|
|
padding-bottom:6px
|
|
}
|
|
|
|
.contenu-texte ul li
|
|
{
|
|
list-style-image:url(../img/fleche.png);
|
|
list-style-position:inside;
|
|
text-indent:-20px;
|
|
padding:4px 0
|
|
}
|
|
|
|
.contenu-texte li:first-child
|
|
{
|
|
padding-top:10px
|
|
}
|
|
|
|
.contenu-texte ol
|
|
{
|
|
padding-left:20px;
|
|
padding-bottom:6px
|
|
}
|
|
|
|
.contenu-texte ol li
|
|
{
|
|
padding:4px 0
|
|
}
|
|
|
|
.contenu-texte .suitedarticles
|
|
{
|
|
grid-row-start:2;
|
|
grid-row-end:-1;
|
|
grid-column-start:2;
|
|
grid-column-end:3;
|
|
min-height:800px;
|
|
text-align:left
|
|
}
|
|
|
|
.contenu-texte h2
|
|
{
|
|
margin:3rem 0 1rem
|
|
}
|
|
|
|
.contenu-texte p
|
|
{
|
|
padding-bottom:6px
|
|
}
|
|
|
|
@media screen and (max-width: 1240px) {
|
|
.banniere
|
|
{
|
|
background-position:bottom -240px right -1fr,bottom -190px left 10%,bottom -230px center,center center
|
|
}
|
|
|
|
.presentation article
|
|
{
|
|
margin:0 25px
|
|
}
|
|
|
|
.derniers-services article
|
|
{
|
|
margin:20px
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 1080px) {
|
|
.banniere
|
|
{
|
|
background-position:bottom -240px left 290%,bottom -190px left -50%,bottom -230px center,center center
|
|
}
|
|
|
|
.derniers-services article
|
|
{
|
|
margin:10px
|
|
}
|
|
|
|
header p
|
|
{
|
|
padding-right:5px
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 980px) {
|
|
header
|
|
{
|
|
grid-template-rows:85px;
|
|
grid-template-columns:100px auto 100px;
|
|
margin-top:-85px
|
|
}
|
|
|
|
#navigation
|
|
{
|
|
transition:all .5s ease-in;
|
|
grid-column-start:1;
|
|
grid-column-end:-1;
|
|
text-align:center;
|
|
justify-items:stretch;
|
|
background-color:#153A6A
|
|
}
|
|
|
|
header #navigation a
|
|
{
|
|
padding:1.5rem
|
|
}
|
|
|
|
header > a
|
|
{
|
|
grid-row-start:2;
|
|
grid-row-end:-1;
|
|
grid-column-start:1;
|
|
grid-column-end:2;
|
|
justify-self:center;
|
|
padding:10px;
|
|
margin:0
|
|
}
|
|
|
|
header p
|
|
{
|
|
grid-row-start:2;
|
|
grid-row-end:-1;
|
|
grid-column-start:2;
|
|
grid-column-end:3;
|
|
padding-right:20px;
|
|
margin:0
|
|
}
|
|
|
|
.menu-mobile-ouvre,.menu-mobile-ferme
|
|
{
|
|
grid-row-start:2;
|
|
grid-row-end:-1;
|
|
grid-column-start:3;
|
|
grid-column-end:-1;
|
|
color:#6ae;
|
|
font-size:inherit;
|
|
text-transform:uppercase;
|
|
border:1px solid #6ae;
|
|
padding:5px
|
|
}
|
|
|
|
#navigation
|
|
{
|
|
margin-top:0;
|
|
margin-right:0;
|
|
justify-content:initial
|
|
}
|
|
|
|
#menu:target
|
|
{
|
|
margin-top:0
|
|
}
|
|
|
|
.menu-mobile-ouvre
|
|
{
|
|
display:none
|
|
}
|
|
|
|
.menu-mobile-ferme
|
|
{
|
|
display:block
|
|
}
|
|
|
|
#menu:target a.menu-mobile-ferme
|
|
{
|
|
display:none
|
|
}
|
|
|
|
#menu:target a.menu-mobile-ouvre
|
|
{
|
|
display:block
|
|
}
|
|
|
|
#navigation:target + a.menu-mobile-ouvre
|
|
{
|
|
display:none
|
|
}
|
|
|
|
header nav a:hover,.menu-mobile:hover,.menu-mobile-ouvre:hover,.menu-mobile-ferme:hover
|
|
{
|
|
color:#fff;
|
|
background-color:#ff5e00;
|
|
border-color:#ff5e00
|
|
}
|
|
|
|
.banniere
|
|
{
|
|
background-position:bottom -240px left 440%,bottom -190px left -120%,bottom -230px center,center center
|
|
}
|
|
|
|
.presentation
|
|
{
|
|
grid-template-columns:5% 45% 45% 5%
|
|
}
|
|
|
|
.presentation article
|
|
{
|
|
margin:0 25px
|
|
}
|
|
|
|
.presentation article + article
|
|
{
|
|
margin:0 0 0 40px
|
|
}
|
|
|
|
.derniers-services
|
|
{
|
|
grid-template-columns:5% 45% 45% 5%
|
|
}
|
|
|
|
.contenu-texte,.apropos .contenu-texte
|
|
{
|
|
grid-template-columns:5% 90% 5%
|
|
}
|
|
|
|
.engagements
|
|
{
|
|
grid-template-columns:5% 30% 30% 30% 5%
|
|
}
|
|
|
|
footer
|
|
{
|
|
grid-template-columns:5% 47.5% 47.5%
|
|
}
|
|
|
|
footer .signature-april p
|
|
{
|
|
line-height:15px;
|
|
text-align:right;
|
|
font-size:10px
|
|
}
|
|
|
|
.master-rubrique .derniers-services
|
|
{
|
|
grid-template-columns:5% 90% 5%
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 760px) {
|
|
.banniere
|
|
{
|
|
grid-template-rows:400px;
|
|
background-position:bottom -290px right 60%,bottom -210px left -120%,bottom -270px center,center top
|
|
}
|
|
|
|
.banniere article
|
|
{
|
|
padding-top:50px
|
|
}
|
|
|
|
.banniere article h1
|
|
{
|
|
color:#fff;
|
|
margin:0 2rem;
|
|
text-align:center;
|
|
line-height:50px;
|
|
font-size:30px
|
|
}
|
|
|
|
.banniere article p
|
|
{
|
|
padding-top:20px
|
|
}
|
|
|
|
.presentation
|
|
{
|
|
grid-template-columns:7% 86% 7%
|
|
}
|
|
|
|
.presentation article
|
|
{
|
|
grid-row-start:1;
|
|
grid-row-end:2;
|
|
grid-column-start:2;
|
|
grid-column-end:3;
|
|
margin:0 auto;
|
|
background-image:url(../img/chat-marche-bleu-ciel-filet.svg);
|
|
background-repeat:no-repeat;
|
|
background-position:bottom 0 center;
|
|
background-size:1fr
|
|
}
|
|
|
|
.presentation article + article
|
|
{
|
|
grid-row-start:2;
|
|
grid-row-end:-1;
|
|
grid-column-start:2;
|
|
grid-column-end:3;
|
|
margin:2rem auto;
|
|
background-image:url(../img/chat-course-bleu-ciel-filet.svg);
|
|
display:grid;
|
|
grid-template-rows:100px 140px 140px 100px 140px;
|
|
grid-template-columns:50% 50%;
|
|
justify-content:space-between;
|
|
align-items:flex-start;
|
|
column-gap:1rem;
|
|
row-gap:1rem
|
|
}
|
|
|
|
.presentation article h2
|
|
{
|
|
grid-row-start:1;
|
|
grid-row-end:2;
|
|
grid-column-start:1;
|
|
grid-column-end:-1
|
|
}
|
|
|
|
.presentation article + article h2
|
|
{
|
|
padding:1rem 0 3rem
|
|
}
|
|
|
|
.presentation blockquote.postscriptum p
|
|
{
|
|
padding:.5rem 0 5rem
|
|
}
|
|
|
|
article > div
|
|
{
|
|
grid-row-start:2;
|
|
grid-row-end:3;
|
|
grid-column-start:1;
|
|
grid-column-end:2;
|
|
background-color:#fff;
|
|
border-radius:5px;
|
|
padding:1rem
|
|
}
|
|
|
|
article div + div
|
|
{
|
|
grid-row-start:2;
|
|
grid-row-end:3;
|
|
grid-column-start:2;
|
|
grid-column-end:-1
|
|
}
|
|
|
|
article div + div + div
|
|
{
|
|
grid-row-start:3;
|
|
grid-row-end:4;
|
|
grid-column-start:1;
|
|
grid-column-end:2
|
|
}
|
|
|
|
.presentation article + article .postscriptum
|
|
{
|
|
grid-row-start:3;
|
|
grid-row-end:4;
|
|
grid-column-start:2;
|
|
grid-column-end:-1
|
|
}
|
|
|
|
.presentation article + article .bouton-simple
|
|
{
|
|
grid-row-start:4;
|
|
grid-row-end:-1;
|
|
grid-column-start:1;
|
|
grid-column-end:-1;
|
|
margin:3rem auto 0;
|
|
text-align:center;
|
|
color:#fff;
|
|
font-size:14px;
|
|
letter-spacing:1px;
|
|
font-family:'dejavu_sanscondensed_bold';
|
|
background-color:#2e5281;
|
|
box-shadow:0 0 5px 0 rgba(0,81,132,0.5);
|
|
border-radius:10px;
|
|
padding:1.2rem 2.5rem;
|
|
min-width:250px;
|
|
max-width:300px
|
|
}
|
|
|
|
.presentation article + article .bouton-simple:hover
|
|
{
|
|
color:#fff;
|
|
background-color:#ff5e00
|
|
}
|
|
|
|
.bouton-utilise
|
|
{
|
|
max-width:180px;
|
|
padding:.7rem
|
|
}
|
|
|
|
.derniers-services
|
|
{
|
|
grid-template-rows:1fr;
|
|
grid-template-columns:1fr;
|
|
margin:2rem 0 1rem
|
|
}
|
|
|
|
.derniers-services article
|
|
{
|
|
grid-row-start:2;
|
|
grid-row-end:3;
|
|
grid-column-start:1;
|
|
grid-column-end:-1
|
|
}
|
|
|
|
.derniers-services article + article
|
|
{
|
|
grid-row-start:3;
|
|
grid-row-end:4;
|
|
grid-column-start:1;
|
|
grid-column-end:-1
|
|
}
|
|
|
|
.derniers-services article + article + article
|
|
{
|
|
grid-row-start:4;
|
|
grid-row-end:5;
|
|
grid-column-start:1;
|
|
grid-column-end:-1
|
|
}
|
|
|
|
.derniers-services article + article + article + article
|
|
{
|
|
grid-row-start:5;
|
|
grid-row-end:6;
|
|
grid-column-start:1;
|
|
grid-column-end:-1
|
|
}
|
|
|
|
.derniers-services .bouton-appel
|
|
{
|
|
grid-column-start:1;
|
|
grid-column-end:-1;
|
|
margin:2rem auto 5rem
|
|
}
|
|
|
|
.derniers-services img
|
|
{
|
|
width:70%
|
|
}
|
|
|
|
.derniers-services article
|
|
{
|
|
margin:2rem 4rem
|
|
}
|
|
|
|
.engagements
|
|
{
|
|
grid-template-rows:1fr 1fr 1fr;
|
|
grid-template-columns:1fr
|
|
}
|
|
|
|
.engagements article
|
|
{
|
|
grid-row-start:1;
|
|
grid-row-end:2;
|
|
grid-column-start:1;
|
|
grid-column-end:-1;
|
|
margin:3rem 5rem .5rem
|
|
}
|
|
|
|
.engagements article + article
|
|
{
|
|
grid-row-start:2;
|
|
grid-row-end:3;
|
|
grid-column-start:1;
|
|
grid-column-end:-1
|
|
}
|
|
|
|
.engagements article + article + article
|
|
{
|
|
grid-row-start:3;
|
|
grid-row-end:-1;
|
|
grid-column-start:1;
|
|
grid-column-end:-1
|
|
}
|
|
|
|
.master-rubrique .derniers-services
|
|
{
|
|
margin-top:4rem
|
|
}
|
|
|
|
.master-rubrique .tous-les-services
|
|
{
|
|
flex-flow:column wrap
|
|
}
|
|
|
|
.master-rubrique .derniers-services article
|
|
{
|
|
width:initial
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 640px) {
|
|
header #navigation a
|
|
{
|
|
padding:1.5rem .2rem
|
|
}
|
|
|
|
header #navigation a:first-child
|
|
{
|
|
margin-left:0
|
|
}
|
|
|
|
header #navigation a:last-child
|
|
{
|
|
margin-right:0
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 512px) {
|
|
#navigation
|
|
{
|
|
grid-template-columns:auto
|
|
}
|
|
|
|
header #navigation a:first-child
|
|
{
|
|
margin-left:0
|
|
}
|
|
|
|
header #navigation a:last-child
|
|
{
|
|
margin-right:0
|
|
}
|
|
|
|
header #navigation a
|
|
{
|
|
padding:0.65rem;
|
|
border-bottom:1px solid #2e5281;
|
|
font-size:14px
|
|
}
|
|
|
|
.banniere
|
|
{
|
|
background-position:bottom -290px right 100%,bottom -180px left -20%,bottom -190px center,center center;
|
|
background-size:700px,700px,550px,400%
|
|
}
|
|
|
|
.banniere article a
|
|
{
|
|
margin:1rem 1rem 0 0
|
|
}
|
|
|
|
.presentation article + article .spip_out,.bouton-utilise
|
|
{
|
|
margin:1rem auto 0
|
|
}
|
|
|
|
.presentation article + article .bouton-simple,.derniers-services .bouton-appel
|
|
{
|
|
padding:1rem .1rem
|
|
}
|
|
|
|
.bouton-simple
|
|
{
|
|
font-size:11px;
|
|
padding:7px 0;
|
|
margin:2rem auto;
|
|
text-align:center;
|
|
border:1px solid #97b0c6;
|
|
max-width:150px;
|
|
border-radius:5px
|
|
}
|
|
|
|
.bouton-simple:hover
|
|
{
|
|
background-color:#ff5e00;
|
|
border-color:#ff5e00;
|
|
color:#fff
|
|
}
|
|
|
|
.presentation article
|
|
{
|
|
background-size:170%
|
|
}
|
|
|
|
.presentation article + article
|
|
{
|
|
display: block;
|
|
}
|
|
|
|
.presentation article h2
|
|
{
|
|
text-align:center
|
|
grid-row-start:1;
|
|
grid-row-end:2;
|
|
grid-column-start:1;
|
|
grid-column-end:-1
|
|
}
|
|
|
|
article div
|
|
{
|
|
grid-row-start:2;
|
|
grid-row-end:3;
|
|
grid-column-start:1;
|
|
grid-column-end:-1;
|
|
text-align:center
|
|
}
|
|
|
|
article div + div
|
|
{
|
|
grid-row-start:3;
|
|
grid-row-end:4;
|
|
grid-column-start:1;
|
|
grid-column-end:-1;
|
|
grid-row-start:4;
|
|
grid-row-end:5;
|
|
grid-column-start:1;
|
|
grid-column-end:-1
|
|
}
|
|
|
|
.presentation article + article .bouton-simple
|
|
{
|
|
grid-row-start:5;
|
|
grid-row-end:-1;
|
|
grid-column-start:1;
|
|
grid-column-end:-1
|
|
}
|
|
|
|
.derniers-services article
|
|
{
|
|
margin:1rem 2rem
|
|
}
|
|
|
|
.derniers-services .bouton-utilise
|
|
{
|
|
margin:1rem auto 1.5rem
|
|
}
|
|
|
|
.engagements article
|
|
{
|
|
margin:3rem 2rem .5rem
|
|
}
|
|
|
|
footer
|
|
{
|
|
grid-template-columns:1fr
|
|
}
|
|
|
|
footer ul
|
|
{
|
|
display:none
|
|
}
|
|
|
|
footer .signature-april
|
|
{
|
|
grid-row-start:1;
|
|
grid-row-end:-1;
|
|
grid-column-start:1;
|
|
grid-column-end:-1
|
|
}
|
|
|
|
header
|
|
{
|
|
grid-template-rows:285px;
|
|
margin-top:-285px
|
|
}
|
|
} |