.close_echange{display: none;}

html.echange_participatif.start{position: relative;}
html.echange_participatif.start:after{content: "";display: block;height: 350px;width: 350px;background: url(/img/echange_part_robot.png)no-repeat;background-size: contain;margin-left: 40px;margin-top: 20px;}
.echange_participatif #header .btn_link{
   position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: none;
    border: none;
    margin: 0;
    text-align: center;
    display: flex;justify-content: center;flex-direction: column;align-items: center;
}
.echange_participatif footer {
    display: none;
}
.echange_participatif #bloc_text{padding: 0 10px;margin-top: 60px;}
.echange_participatif #logo{width: 230px;height: 230px;flex-shrink: 0;position: relative;vertical-align: middle;text-align: center;background-color: #f6f6f6;border-radius: 50%;padding: 40px;display: flex;align-items: center;justify-content: center;left: inherit;transform: none;top: inherit;margin: inherit;margin-top: -50px;margin-left: -15px;}
.echange_participatif #header{background-color: transparent;}
.echange_participatif #header .goback{display: block; position: absolute;right: 20px;top: 20px;height: 105px;width: 130px;background-color: #03344c;border-radius: 10px 0;transition: .2s;}
.echange_participatif #header .goback:hover{border-radius: 0 10px;}
.echange_participatif #header .goback .btn_link:before{content: "";display: block;background: url(/img/icon_retour.png)no-repeat;background-size: contain;height: 40px;width: 40px;}
#althead{ 
   flex-grow: 1;
   padding-top: 40px;
}
#bloc_text h1{ 
   color: #000;
    display: block;
    text-align: center;
    padding-bottom: 5px;
    font-weight: 900;
}
#bloc_text h2{ 
   color: #f4bb58;
   text-align:center;
   margin:0px;
    font-size: 28px;
}
#echange_bloc{display:flex;justify-content:center;align-items:center;flex-wrap: wrap;}
.echange_bloc{
   background: #000;
   text-align: center;
   color: #FFF;
   width: 290px;
   padding: 20px;
   margin:15px;
}
#echange_bloc .echange_bloc .btn_link{
   background:#fff;
   border:none;
   color:#000;
   border-radius:8px;
   padding: 4px 50px;
   font-weight: bold;
   font-size: 18px;
   margin-top:0px;
    transition: .2s;
}
#echange_bloc .echange_bloc .btn_link:hover{
   background:#ffd53f;
   color:#000;
    text-decoration: none;
}
#echange_bloc .echange_bloc .date{color:#ffd53f;}
#echange_bloc .echange_bloc .titre{
   display:flex;
   justify-content:center;
   align-items:center;
   height:80px;
   margin:20px 0px;
   font-size: 22px;
    font-weight: 500;
}
#echange_bloc .echange_bloc.done{
   background:#444;
}
#echange_bloc .echange_bloc .bloc_done{
   background: #000;
   border-radius: 8px;
   padding: 5px 50px;
   font-weight: bold;
   margin-top: 0px;
   margin-bottom: 15px;
}

.bloc_ask{
   position: relative;
   display:flex;
   align-items: center;
}
.bloc_ask img{
   margin-right: 10px;
   margin-top: 15px;
}
.bloc_ask img.picto_bulle{
	margin-right: -1px;
   bottom: 0px;
   margin-top: 30px;
   width: 30px;
}
#bloc_formulaire .indic_etape{flex-grow:1;border-radius: 5px;margin: 20px auto;background: #F3F3F3;padding: 20px;font-style: italic;margin-left: 0;}

#bloc_formulaire .head{color: #000; border-color: #ffd53f;font-size: 26px;font-weight: 500;text-transform: uppercase;display: inline-block;border-bottom: 3px solid #ffd53f;}

.echange_participatif #bloc_formulaire .champ {margin: 20px 0;border-radius: 30px 0;}

.echange_participatif #bloc_formulaire .bloc_succes{background: #68b642;position: relative;border-radius: 30px 0;}
.echange_participatif #bloc_formulaire div[data-step=end]:after{content: "";background: url(/img/gabby_succes.png)no-repeat; background-size: contain;height: 390px;width: 390px;display: block;margin-top: 30px;}

#bloc_formulaire .checkbox, #bloc_formulaire .checkbox_multi, #bloc_formulaire .checkbox_img{
   line-height: 60px;
    height: 60px;
    border-radius: 40px;
    font-size: 18px;
    color: #000;
    vertical-align: top;
    width: 220px;
    background: #F3F3F3;
    text-align: center;
    margin: 10px;
    cursor: pointer;
    font-size: 20px;
}
#bloc_formulaire .checkbox{padding: 10px;display: flex;align-items: center;justify-content: center;font-weight: 400;}
#bloc_formulaire .checkbox.sel, #bloc_formulaire .bloc.sel .checkbox.sel, #bloc_formulaire .checkbox_multi.sel, #bloc_formulaire .bloc.sel .checkbox_multi.sel, #bloc_formulaire .checkbox_img.sel, #bloc_formulaire .bloc.sel .checkbox_img.sel{background:#000;color:#ffd53f; }

#bloc_formulaire .bloc {position: relative;}
#bloc_formulaire {max-width: 930px;margin: 60px auto;}
#bloc_formulaire .btn_link{text-transform:uppercase;background-color: #f4bb58;transition: .3s;border-radius: 40px;border: none;font-size: 20px;padding: 10px 40px;margin: 15px;cursor: pointer;color: #fff;font-weight: bold;display: inline-block;}
#bloc_formulaire .btn_link:hover {color: #fff;background-color: #f4bb58;opacity: .85;}
#bloc_formulaire select{min-width: 150px;}

.echange_participatif #bloc_formulaire .champ.type_checkbox,.echange_participatif #bloc_formulaire .champ.type_checkbox_multi,.echange_participatif #bloc_formulaire .champ.type_checkbox_img, .echange_participatif #bloc_formulaire .champ.type_prd {text-align: left;margin: 20px 0;display: flex;flex-wrap: wrap;justify-content: flex-start;}
.echange_participatif #bloc_formulaire label{color: #000;font-weight: bold;width: 100%;}
.echange_participatif #bloc_formulaire label span.req{color: #9d1261;}

@media all and (max-width:991px){
    .echange_participatif #bloc_text {margin-top: 100px;}
    .echange_participatif #logo{height: 200px;width: 200px;}
    .echange_participatif #logo img{max-width: 150px;}
    #bloc_formulaire{max-width: 90%;}
    #bloc_formulaire .head{font-size: 22px;}
    #bloc_formulaire .indic_etape p{margin: 0;}
    #bloc_formulaire .checkbox, #bloc_formulaire .checkbox_multi, #bloc_formulaire .checkbox_img{font-size: 16px;}
    #bloc_formulaire .btn_link{font-size: 18px;}
}

@media all and (max-width:767px){
    #echange_bloc{flex-direction: column;}
    #bloc_text h1{font-size: 36px;}
    #echanges-participatifs #bloc_text{}
    html.echange_participatif.start:after{height: 340px;width: 340px;}
    #echanges-participatifs #header .goback{height: 90px;width: 110px;top: 10px;right: 10px;}
    .echange_participatif #header .goback{height: 90px;width: 130px;}
    .echange_participatif #logo{display: none;}
    .echange_participatif #header{position: relative;}
    .echange_participatif #header .close_echange{display: flex;justify-content: center;align-items: center; position: absolute;top: 10px;left: 10px;background-color: #03344c;padding: 10px;height: 50px;width: 50px;border-radius: 5px;}
    .echange_participatif #header .close_echange:before{content: "";display: block;background: url(/img/fermer_echange.png)no-repeat;background-size: contain;height: 25px;width: 25px;}
}
@media all and (max-width:500px){
    #bloc_text h1{font-size: 32px;}
    #echanges-participatifs #logo{width: 160px;height: 160px;}
    #echanges-participatifs #logo img{max-width: 110px;}
    .echange_participatif #logo{margin-top: -35px;}
    .echange_bloc{width: 90%;}
    #echange_bloc .echange_bloc .titre{margin: 10px 0;}
    #echange_bloc .echange_bloc .btn_link{font-size: 16px;}
    html.echange_participatif.start:after{height: 320px;width: 320px;margin-top: 40px;margin-left: 0;}
    #echanges-participatifs #bloc_text{}
    #bloc_text h2{font-size: 24px;}
    #bloc_formulaire .head{font-size: 18px;}
    #bloc_formulaire{max-width: 95%;margin: 40px auto;}
    .echange_participatif #bloc_formulaire div[data-step=end]:after{width: 320px;height:320px;}
    .echange_participatif #bloc_formulaire .champ.type_checkbox, .echange_participatif #bloc_formulaire .champ.type_checkbox_multi, .echange_participatif #bloc_formulaire .champ.type_checkbox_img, .echange_participatif #bloc_formulaire .champ.type_prd{justify-content: center;}
}
@media all and (max-width:380px){
    html.echange_participatif.start:after{width: 300px;height: 300px;}
    .echange_participatif #header .goback{height: 80px;width: 130px;}
    #echanges-participatifs #header .goback{height: 80px;width: 95px;}
    .echange_participatif #header .goback a.btn_link {padding: 7px;}
    .echange_participatif #bloc_formulaire div[data-step=end]:after{width: 300px;height:300px;}
}