body

{
  margin : 0;
} 


.centrer{

display: flex;
justify-content: center;

}

.alignement_gains_pixelup{
display: none;
position: absolute;
margin-left: 8px;
margin-top: 24px;
}

.carre_pixelup{
width: 45px;
height: 67px;
background: #D5EBFB;
border-radius: 8px;
}

.image_pixelup{
position: absolute;
margin-top: 9px;
margin-left: 9px;
}

#gains{
position: absolute;
margin-top: 42px;
margin-left: 18px;
width: 9px;
height: 21px;
font-family: 'Poppins';
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 21px;
color: #45B2FF;
}

.carre_fond_top{
}

.alignement_top{
display: flex;
justify-content: center;
margin-top: 20px;
}

.gains_titre{
display: none;
position: absolute;
margin-top: 1px;
margin-left: 0px;
width: 59px;
height: 21px;
font-family: 'Quantico';
font-style: normal;
font-weight: 400;
font-size: 15px;
line-height: 21px;
text-align: center;
color: #FEA832;
}

.profil{
display: none;
position: absolute;
margin-left: 279px;
margin-top: 28px;
}

.alignement_bien_dormir{
display: flex;
justify-content: center;
}

.carre_fond_theme{
width: 700px;
height: 191px;
background: #F5FAFF;
border-radius: 9px;
}

.carre_fond_theme_jaune{
width: 700px;
height: 191px;
background: #FFFCE4;
border-radius: 9px;
}

.image_categorie{
display: flex;
justify-content: center;
margin-top: -3px;
}

.format_image{
width: 73px;
height: 73px;
}

.titre_bien_dormir{
display: flex;
justify-content: center;
margin-top: 11px;
font-family: 'Poppins';
font-style: normal;
font-weight: 600;
font-size: 14px;
line-height: 21px;
color: #383842;
}

.image_fermer{
display: flex;
margin-top: 18px;
justify-content: flex-end;
margin-right: 13px;
}

.alignement_titre_gamification{
display: flex ;
justify-content: center;
margin-top: 20px;
}

.titre_gamification{
font-family: 'Poppins';
font-style: normal;
font-weight: 400;
font-size: 17px;
line-height: 26px;
color: #FEA832;
}

.alignement_son1{
display: flex;
justify-content: center;
margin-top: 27px;
}

.alignement_son_autre{
display: flex;
justify-content: center;
margin-top: 12px;
}

.carre_son{
box-sizing: border-box;
width: 700px;
height: 77px;
border: 1px solid #45B2FF;
border-radius: 6px;
}

.carre_son_jaune{
box-sizing: border-box;
width: 700px;
height: 77px;
border: 1px solid #FEDB41;
border-radius: 6px;
}

.bouton_lecture{
position: absolute;
margin-left: 10px;
margin-top: 14.5px;
}

.titre_son{
position: absolute;
height: 17px;
margin-top: 18px;
margin-left: 73px;
font-family: 'Poppins';
font-style: normal;
font-weight: 400;
font-size: 17px;
line-height: 17px;
color: #45B1FF;
}

.titre_son_jaune{
position: absolute;
height: 17px;
margin-top: 18px;
margin-left: 73px;
font-family: 'Poppins';
font-style: normal;
font-weight: 400;
font-size: 17px;
line-height: 17px;
color: #FFD422;
}

.auteur_son{
position: absolute;
height: 15px;
margin-top: 44px;
margin-left: 74px;
font-family: 'Poppins';
font-style: normal;
font-weight: 400;
font-size: 15px;
line-height: 15px;
color: #787878;
}

.temps_son{
display: flex;
justify-content: flex-end;
height: 15px;
margin-top: 18px;
margin-right: 25px;
font-family: 'Poppins';
font-style: normal;
font-weight: 400;
font-size: 15px;
line-height: 15px;
color: #45B2FF;
}


.gain_meditation{
margin-top: 18px;
margin-left: 288px;
}

@media all and (max-width: 900px)
{

.carre_son{
width: 510px;
}

.carre_son_jaune{
width: 510px;
}


.carre_fond_theme{
width: 510px;
height: 191px;
background: #F5FAFF;
border-radius: 9px;
}

.carre_fond_theme_jaune{
width: 510px;
height: 191px;
background: #FFFCE4;
border-radius: 9px;
}

}


@media all and (max-width: 500px)
{

  .carre_son{
width: 333px;
}

.carre_son_jaune{
width: 333px;
}


.carre_fond_theme{
width: 333px;
height: 191px;
background: #F5FAFF;
border-radius: 9px;
}

.carre_fond_theme_jaune{
width: 333px;
height: 191px;
background: #FFFCE4;
border-radius: 9px;
}


}