/* Bandeau d'image affichage sur 2 colonnes avec menu filtre */
@media screen and (max-width: 850px){
    
        
     /* Réajustement des tailles de polices */
    .titreProgramList, .episode_duree_program_list, .episode_duree_program_list {
        font-size : 80%;
        }
        
    .categorie .col1 .programmCat {
        max-width: none;
        width: 48%;
        margin-bottom: 20px;
        }
    
    .programmCat img {   
        width: 100%;
        }

    .col1{
        width : 60%;
        }
    
    .col2{
        width : 35%;
        }
   
    ul, ol{
        padding-left: 0rem;
        font-size : 90%;
        }

    
}

/* Bandeau d'image affichage sur 1 colonnes avec menu filtre */
@media screen and (max-width: 650px){
        
    .categorie .col1 .programmCat {
        max-width: none; 
        width: 100%;
        margin-bottom: 20px;
    }
        
    .col1 {
        width : 50%;
        
        }
    .col2{
        width : 45%; 
        }
}    
/* Bandeau d'image affichage sur 1 colonnes sans menu filtre */
@media screen and (max-width: 500px){
    
    .categorie .col1 .programmCat {
        width: 100%;
        }
        
    .col1{
        width : 100%;
        }
        
    .cols{
        flex-direction : column;
        align-items : center;
        }
            
    .col2{
        width : 100%;
        }
        
    .pagination{
        margin-bottom : 20px;
        } 
        

    .titreProgramList, .episode_duree_program_list, .episode_duree_program_list {
        font-size: 80%;
        margin-left: 4px;
        }
        
    
} 

/* PAGE ABOUT*/ 

    /* PARAGRAPHE */
@media screen and (max-width: 1060px){
    
    .desc , .talk {
    margin: 10px;
    }
}    

    /* ZONE ADRESSE MAIL */ 
@media screen and (max-width: 1000px){

    .talk {
        display: flex;
        width: 95%;
        flex-direction :column;
    }
    
    .talk b {
        width:100%;    
    }
    
    .talk div  {
        flex-wrap: wrap;
        }
    
    .talk div div{
        width : 50%;
        }
    
    
    /* ZONE LOGO */     
    .meet {
        display: flex;
        width: 95%;
        flex-direction :column;
    }
 
    .meet b {
        width:100%;    
    }
    
    .meet div  {
        flex-wrap: wrap;
        }
    
    .meet div div{
        width : 50%;
        }
}

/* PAGE ABOUT 2e POINT DE RUPTURE*/ 
@media screen and (max-width: 600px){

    .talk div div{
        width : 100%;
        }
    
    /* ZONE LOGO */ 
    .meet div div{
        width : 100%;
        }
        
}

/*  FOOTER  */ 

@media screen and (max-width: 800px){
        .twitterWidget{
            width : unset;
        }
    }

@media screen and (max-width: 630px){
    
        .colsFooter{
            flex-direction : column;
            }
            
        .col1Footer{
            margin-bottom : 10px;
        }
        
        .twitterWidget{
            width 95%;
            }
    }
    
/* PAGE ACCUEIL*/

    /* BANDEAU */
@media screen and (max-width: 800px){
    .diapoCat{
        font-size : 95%;
        }
        
    .diapoTitre{
        font-size : 150%;
        }
    
    .diapoSousTitre{
         font-size : 115%;  
        }
}
    
@media screen and (max-width: 600px){
        .diapoCat{
        font-size : 90%;
        }
        
    .diapoTitre{
        font-size : 140%;
        }
    
    .diapoSousTitre{
         font-size : 105%;  
        }
    
}

@media screen and (max-width: 450px){
        .diapoCat{
        font-size : 85%;
        }
        
    .diapoTitre{
        font-size : 120%;
        }
    
    .diapoSousTitre{
         font-size : 95%;  
        }
    
}   
    
    
    /* CORP */
    .newProgHome .programmCat a {
        display:block;
        }
        
    .newProgHome .programmCat img{
        width : 100%;
        }
    
@media screen and (max-width: 1000px){ 
    
    /* 3 collones */ 
    .newProgHome > div {
        width: 29%;
    }
    
    .descNewProgHome span {
        font-size : 220%;
        }
    
    html body .newProgHome .descNewProgHome {
    width: 60%;
    }
}
    /* 2 collones */ 
@media screen and (max-width: 800px){        
    .newProgHome > div {
        width: 46%;
    }

    .descNewProgHome span {
        font-size : 160%;
        }
    
    html body .newProgHome .descNewProgHome {
    width: 46%;
    }
}
    /* 1 collones */ 
    
@media screen and (max-width: 630px){        
    html body .newProgHome .descNewProgHome {
        width: 98%;
    }
    
    .newProgHome > div {
        width: 98%;
    }
    
}

.descNewProgHome{
    margin: 40px auto;
    max-width: 1200px;
    padding-left: 23px;
    text-transform: uppercase;
    font-size: 100%;
    font-weight: bold;
    }
.newProgHome{
    margin: 20px auto;
    }