.blocMod.infosCles{padding:50px 20px;}

.blocMod.infosCles .wrapper{
width:1200px;
max-width:100%;
margin:0 auto;
color:var(--noir);
}

.blocMod.infosCles.txt_beige .wrapper{color:var(--beige);}

.blocMod.infosCles .wrapper .filAriane{text-align:center;}

.blocMod.infosCles.txt_beige .filAriane{color:var(--beige);}

.blocMod.infosCles.txt_beige .filAriane span.separ{background-color:var(--beige);}

.blocMod.infosCles .wrapper .intro{
width:460px;
max-width:100%;
margin:0 auto;
text-align:center;
padding-top:10px;
}

.blocMod.infosCles .wrapper .intro .ti + .ckeditor{padding-top:10px;}

.blocMod.infosCles .wrapper .articles{
padding-top:60px;
position:relative;
display:flex;
flex-flow:row wrap;
width:calc(100% + 20px);
left:-10px;
}

.blocMod.infosCles .wrapper .intro.hidden, .blocMod.infosCles .wrapper .articles.hidden{display:none;}

.blocMod.infosCles .wrapper .intro.hidden + .articles{padding-top:0;}

.blocMod.infosCles .wrapper .articles > article{
margin:10px;
padding:5px 0 7px 10px;
border-bottom:1px solid var(--noir);
border-left:1px solid var(--noir);
}

.blocMod.infosCles.txt_beige .wrapper .articles > article{
border-bottom:1px solid var(--beige);
border-left:1px solid var(--beige);
}

.blocMod.infosCles .wrapper .articles .ti_liste{
width:calc(100% - 20px);
margin:10px;
}

.blocMod.infosCles .wrapper .articles .ti_liste.ti_encadre{
padding:5px 0 7px 10px;
border-bottom:1px solid var(--noir);
border-left:1px solid var(--noir);
}

.blocMod.infosCles.txt_beige .wrapper .articles .ti_liste.ti_encadre{
border-bottom:1px solid var(--beige);
border-left:1px solid var(--beige);
}

.blocMod.infosCles .wrapper .articles > article{
width:calc((100% / 3) - 20px);
position:relative;
transform:scale(1.1);
opacity:0;
transition:all 0.3s ease-in-out;
}

.blocMod.infosCles.col4 .wrapper .articles > article{width:calc(25% - 20px);}

.blocMod.infosCles .wrapper .articles > article.onanim{
transform:scale(1);
opacity:1;
}

.blocMod.infosCles .wrapper .articles > article .bloc{
display:flex;
transition:opacity 0.5s ease-in-out;
}

.blocMod.infosCles .wrapper .articles > article a.bloc:hover, .blocMod.infosCles .wrapper .articles > article a.bloc:focus{opacity:0.5;}

.blocMod.infosCles .wrapper .articles > article .bloc > figure{
width:80px;
padding-right:10px;
}

.blocMod.infosCles .wrapper .articles > article .bloc > figure img{
max-height:80px;
width:auto;
margin:0 auto;
}

.blocMod.infosCles .wrapper .articles > article .bloc > .txt{width:100%;}

.blocMod.infosCles .wrapper .articles > article .bloc > figure + .txt{width:calc(100% - 80px);}

.blocMod.infosCles .wrapper .articles > article .bloc > .txt .ti + .ckeditor{padding-top:5px;}

.blocMod.infosCles .wrapper > .liens{
padding-top:50px;
display:flex;
flex-flow:row wrap;
align-items:center;
position:relative;
width:calc(100% + 20px);
left:-10px;
justify-content:center;
}

.blocMod.infosCles .wrapper .liens a{margin:10px;}

.blocMod.infosCles .wrapper .intro.hidden + .articles.hidden + .liens{padding-top:0;}

/********** medias **********/
@media screen and (max-width:1180px){
.blocMod.infosCles .wrapper .articles{padding-top:40px;}

.blocMod.infosCles.col4 .wrapper .articles > article{width:calc(50% - 20px);}
}

@media screen and (max-width:980px){
.blocMod.infosCles .wrapper .articles{
width:calc(100% + 10px);
left:-5px;
}

.blocMod.infosCles .wrapper .articles .ti_liste, .blocMod.infosCles .wrapper .articles > article{margin:10px 5px;}

.blocMod.infosCles .wrapper .articles .ti_liste{width:calc(100% - 10px);}

.blocMod.infosCles .wrapper .articles > article{width:calc((100% / 3) - 10px);}

.blocMod.infosCles.col4 .wrapper .articles > article{width:calc(50% - 10px);}
}

@media screen and (max-width:680px){
.blocMod.infosCles{padding:40px 20px;}

.blocMod.infosCles .wrapper .articles{
width:100%;
left:0;
}

.blocMod.infosCles .wrapper .articles .ti_liste, .blocMod.infosCles .wrapper .articles > article{margin:10px 0;}

.blocMod.infosCles .wrapper .articles .ti_liste, .blocMod.infosCles .wrapper .articles > article, .blocMod.infosCles.col4 .wrapper .articles > article{width:100%;}

.blocMod.infosCles .wrapper .articles, .blocMod.infosCles .wrapper > .liens{padding-top:25px;}
}