/* CSS Responsive */

    @media all and (max-device-width: 480px)
{
    header
    {
        display: flex;
        flex-direction: column;
        align-items: center;
       text-align: center;
       font-size: 3em;
       
    }
    .logo
    {
        width: 100%;
    }
    .logo_seul img
    {
        width: 100%;
    }
.container
{
    
     min-width: 0px;
    margin: 0;
    
}
nav ul
{
    list-style-type: none;
    display: flex;
    flex-direction: column;
   margin: auto;
}
nav li
{
    margin: auto;
    margin-bottom: 20px;
}
.image_accueil
{

}
#image_accueil img
{

}
.section
{
    font-size: 4em;
    width: 400px;
    margin: auto;
    margin-bottom: 50px;
    margin-top: 50px;
    text-align: center;
    font-family: Fashion Fetish Regular;
    border-bottom: 3px solid #000000;
}

#news_container
{
    flex-direction: column;
}
.news_box
{
    width: 80%;
    height: 600px;
    border-radius: 10px;
   box-shadow: 0px 4px 4px #A9A9A9;
    padding: 10px;
    margin: auto;
  margin-bottom: 50px;
}
.news_box h2
{
    font-size: 2.5em;
  
    text-align: center;
}
.news_box h3
{
font-size: 2em;
color: #A9A9A9;
  
    text-align: center;
}
.groupe
{
   
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    text-align: center;
    height: 300px;
    
}
.logo_groupe
{
    display: none;
}
.logo_groupe img
{
  width: 600px; 
  margin: auto; 
}
.nom_groupe
{
    width: 100%;
    
    margin: 0;
    padding-bottom: 20px;
    font-size: 2em;
}
.description_groupe
{
   width: 100%;
    
    margin: 0; 
    font-size: 2em;
}
.bouton
{
    width: 100%;
   height: 50px;
    margin: 0;
    padding-bottom: 20px;
    padding-top: 20px;
    padding-left: 20px;
    margin-bottom: 50px;
    border: unset;
}
.bouton h3
{
    border: 2px solid #000000;
   margin-left: 200px;
   margin-right: 200px;
    text-align: center;
    border: none;
    margin-bottom: 50px;
    font-size: 1.5em;

}
.image_groupe_1
{
    height: 400px;
    background-image: url("photo_cinematheque.jpg");
  background-attachment: local;
  background-size: 100%;
  background-repeat: no-repeat;
}
.image_groupe_2
{
    height: 400px;
    background-image: url("yss_masdelbosc.png");
  background-attachment: local;
  background-size: 100%;
  background-repeat: no-repeat;
}
.image_groupe_3
{
    height: 400px;
    background-image: url("buvez du rouge.png");
  background-attachment: local;
  background-size: 100%;
  background-repeat: no-repeat;
}
.ligne_date
{
    flex-direction: column;
    text-align: center;
    font-size: 2em;

}
.bouton_2
{
    width: 100%;
   height: 50px;
    margin: 0;
    padding-bottom: 20px;
    padding-top: 20px;
    padding-left: 20px;
    margin-bottom: 20px;
    flex: 1;
    border: 0px;
    font-size: 1.5em;
}
.bouton_2 h3
{
    height: 50px;
   margin-left: 200px;
   margin-right: 200px;
    text-align: center;

}
.contacts
{
    font-size: 2em;
}
}