main.page > .listeActus:first-child{
 padding-top:200px;
}
.listeActus > .titre1{
text-align:center;
 margin-bottom:80px;
}
.listeActus > .bt{
 margin:25px auto 0;
 display:block;
 width:max-content;
 width:-moz-max-content;
 max-width:100%;
}
.listeActus .liste{
 display:flex;
 flex-flow:row wrap;
 justify-content:center;
}

.listeActus .liste.hidden{display:none;}

.listeActus .liste article{
 display:flex;
 flex-direction:column;
 margin:0 10px 20px;
}
.listeActus .liste.col2 article{
 width:calc(50% - 20px);
}
.listeActus .liste.col3 article{
 width:calc(calc(100%/3) - 20px);
}
.listeActus .liste.col4 article{
 width:calc(calc(100%/4) - 20px);
}
.listeActus .liste article .txt .titre{
 font-family:var(--font-bold);
}
.listeActus .lien_img{
 position:relative;
 padding-bottom:100%;
width:100%;
 overflow:hidden;
 margin-bottom:15px;
}
.listeActus .lien_img > img{
 position:absolute;
 top:0;
 left:0;
 z-index:1;
}
.listeActus .lien_img.video .video_icon{
 content:'';
 position:absolute;
 top:0;
 left:0;
 width:100%;
 height:100%;
 display:flex;
 flex-direction:column;
 justify-content:center;
 align-items:center;
 padding:10px;
 z-index:2;
}
.popin_video{
 position:fixed;
 top:0;
 left:0;
 z-index:550;
 width:100%;
 height:100%;
 padding:50px;
 display:none;
}

.popin_video > .bg{
 position:absolute;
 top:0;
 left:0;
 width:100%;
 height:100%;
 background:rgba(0, 0, 0, 0.8);
}

.popin_video .centre{
 position:relative;
 background:#fff;
 width:1200px;
 max-width:100%;
 transform:translate(-50%, -50%);
 left:50%;
 top:50%;
 padding:60px 30px;
 max-height:100%;
 overflow:auto;
 font-size:14px;
}

.popin_video .centre .close{
 position:absolute;
 top:20px;
 right:20px;
 width:28px;
 cursor:pointer;
}
.popin_video .centre .contenu{
 position:relative;
 width:100%;
 padding-bottom:56.25%;
}
.popin_video .centre .contenu iframe{
 position:absolute;
 top:0;
 left:0;
 width:100%;
 height:100%;
}
@media screen and (max-width:1280px){
 .listeActus > .titre1{
  text-align:center;
  margin-bottom:50px;
 }
}
@media screen and (max-width:980px){
 main.page > .listeActus:first-child{
  padding-top:85px;
 }
 .listeActus .liste.col4 article{
  width:calc(calc(100%/2) - 20px);
 }
}
@media screen and (max-width:650px){
 .listeActus .liste.col3 article{
  width:calc(calc(100%/2) - 20px);
 }
}
@media screen and (max-width:400px){
 .listeActus .liste.col2 article,
 .listeActus .liste.col3 article,
 .listeActus .liste.col4 article{
  width:100%;
 }
}
