/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.12,
* Autoprefixer: v10.4.4
* Browsers: last 4 version
*/
    
body #content{
    min-height: 100%;
   
  
}
                                                            /* Code zone 1 banniere a propos*/
#z1 {
    text-align: center;
    width: 100%;
    height: 200px;
    background-image: url(img/banner\ 1.png);
    margin: 0 auto;
   
} 

                                                        /* Code zone 1 titre banniere a propos*/
#z1 .b1 h1{
    font-family: Impact;
    color: rgb(255, 255, 255);
    font-size: 50px;
    text-shadow: rgb(46, 46, 46) 0.6px 3px;
    padding-top: 100px;
}


                                                                 /* code de la zone 2 a propos*/

                                                              /* Code général de la zone a propos*/
#z2 {
    width: 100%;
    height: auto;
    background-color: white;
} 

                                                                    /* boite zone 2 */

#z2 .box1 {
    padding-top: 50px;
    width: 90%; 
    height: auto;
    text-align: center;
    margin: 0 auto;
}

                                                                 /* boite zone 2 texte */

#z2 .box1 p{
    padding: 12px;
    font-family: arial;
    font-size: 27px;
    text-align:justify ;
    line-height: 60px;
}

                                                                /* zone 2 style bouton a propos  */
#z2 .box1 .button {
    padding: .5rem 1rem;
    background-color: #080808e0;
    color:white;
    border: 1px solid transparent;
    border-radius: 5px;
    text-decoration: none;
    display: inline-block;
    margin-bottom: 70px;
    
}

                                                        /* code de la zone 3 Bio */

                                                        /* Code général de la zone bio*/
#z3 {
    width: 100%;
    height: auto;
    background-image: url(img/bio\ back2.png);
    background-repeat: no-repeat;
} 

                                                            /* boite zone 3 */

#z3 .box2 {
    padding-top: 50px;
    width: 90%; 
    height: auto;
    text-align: center;
    margin: 0 auto;
}

                                                            /* boite zone 3 titre bio*/

#z3 .box2 h1{
    text-align: center;
    font-family: Impact;
    padding-top: 50px;
    color: rgb(255, 255, 255);
    font-size: 50px;
    text-shadow: rgb(123, 0, 180) 0.7px 3px;
}

                                                            /* boite zone 3 texte */

#z3 .box2 p{
    padding: 12px;
    font-family: arial;
    font-size: 27px;
    text-align:justify ;
    line-height: 60px;
    color: #fff;
}

                                                        /* zone 3 style bouton a bio  */
#z3 .box2 .button {
    padding: .5rem 1rem;
    background-color: white;
    color:#292929fb;
    border: 1px solid transparent;
    border-radius: 5px;
    text-decoration: none;
    display: inline-block;
    margin-bottom: 80px;
    width: 170px;
    
}

#z3 .box2 .button:hover{
    background-color: rgba(86, 68, 248, 0.568);
    color: white;
}

                                                                    /* code de la zone 4 Programme */

                                                                /* Code général de la zone vision*/
#z4 {
    width: 100%;
    height: auto;
    background-image: url(img/fond\ programme2.png);
    background-repeat: no-repeat;
} 

                                                            /* boite zone 4 */

#z4 .box3 {
    padding-top: 150px;
    padding-bottom: 70px;
    width: 90%; 
    height: auto;
    text-align: center;
    margin: 0 auto;
}

                                                            /* boite zone 4 titre */

#z4 .box3 h1{
    text-align: center;
    font-family: Impact;
    color: rgb(255, 255, 255);
    font-size: 50px;
    text-shadow: rgb(180, 0, 111) 0.7px 3px;
}

                                                            /* boite zone 4 texte */

#z4 .box3 p{
    padding: 12px;
    font-family: arial;
    font-size: 27px;
    text-align:justify ;
    line-height: 60px;
    color: #fff;
}

                                                    /* zone 4 style bouton a propos  */
#z4 .box3 .button {
    padding: .5rem 1rem;
    background-color:  #380b5ed5;
    color:white;
    border: 1px solid transparent;
    border-radius: 5px;
    text-decoration: none;
    display: inline-block;
    margin-bottom: 80px;
    width: 170px;
    
}

#z4 .box3 .button:hover{
    background-color: #57148de8;
}

                                            /* code de la zone 4 témoignage*/

                                            /* Code général de la zone témoignage*/
#z5 {
    width: 100%;
    height: auto;
    background-image: linear-gradient(to top, #fafafa 0%, white 100%);
   
} 

                                                            /* boite zone 5 */

#z5 .box4 {
    padding-top: 20px;
    width: 90%; 
    height: auto;
    text-align: center;
    margin: 0 auto;
}

                                                            /* boite zone 5 titre */

#z5 .box4 h1{
    font-family: Impact;
    color: rgb(29, 29, 29);
    font-size: 50px;
    text-shadow: rgb(228, 228, 228) 0.6px 3px;
    padding-top: 100px;
}

                                                            /* boite zone 5 texte */

#z5 .box4 p{
    padding: 12px;
    font-family: arial;
    font-size: 27px;
    text-align:justify ;
    line-height: 60px;
    color: #1a1a1a;
}

                                                            /* zone 5 style bouton a propos  */
#z5 .box4 .button {
    padding: .5rem 1rem;
    background-color:  #202020d5;
    color:white;
    border: 1px solid transparent;
    border-radius: 5px;
    text-decoration: none;
    display: inline-block;
    margin-bottom: 80px;
    width: 170px;
    
}

#z5 .box4 .button:hover{
    background-color: #3d3d3de8;

}

@media screen and (max-width:800px){
    #z1{
        margin: 0;
        padding: 0;
        padding-top: 10px;
        
    }
    #z1 .b1 h1{
        font-family: Impact;
        color: rgb(255, 255, 255);
        font-size: 30px;
        text-shadow: rgb(46, 46, 46) 0.6px 3px;
        
    }
                                                    /* zone 2 box1 */
    #z2 .box1{
        width: 90%; 
        text-align: center;
        margin: 0 auto;
         
        }                                      
                                                 /* container zone 2 texte */
        
        #z2 .box1  p{
            font-family:'Lucida Sans';
            font-size: 18px;
            text-align:justify;
            line-height: 40px;
            width: 100%;
        }
        #z3 .box2 {
            padding-top: 50px;
            width: 90%; 
            height: auto;
            text-align: center;
            margin: 0 auto;
        }
        
                                                                    /* boite zone 3 titre bio*/
        
        #z3 .box2 h1{
            text-align: center;
            font-family: Impact;
            color: rgb(255, 255, 255);
            font-size: 30px;
            text-shadow: rgb(123, 0, 180) 0.7px 3px;
        }
        
                                                                    /* boite zone 3 texte */
        
        #z3 .box2 p{
            font-family:'Lucida Sans';
            font-size: 18px;
            text-align:justify;
            line-height: 40px;
            width: 100%;
        }
                                                                /* zone4 programme */
        #z4 .box3 {
            padding-top: 50px;
            padding-bottom: 50px;
            width: 90%; 
            height: auto;
            text-align: center;
            margin: 0 auto;
        }
        
                                                                    /* boite zone 4 titre */
        
        #z4 .box3 h1{
            text-align: center;
            font-family: Impact;
            color: rgb(255, 255, 255);
            font-size: 30px;
            text-shadow: rgb(180, 0, 111) 0.7px 3px;
        }
        
                                                                    /* boite zone 4 texte */
        
        #z4 .box3 p{
            font-family:'Lucida Sans';
            font-size: 18px;
            text-align:justify;
            line-height: 40px;
            width: 100%;
        }

        #z5 .box4 {
            padding-top: 20px;
            width: 90%; 
            height: auto;
            text-align: center;
            margin: 0 auto;
        }
        
                                                                    /* boite zone 5 titre */
        
        #z5 .box4 h1{
            font-family: Impact;
            color: rgb(29, 29, 29);
            font-size: 30px;
            text-shadow: rgb(228, 228, 228) 0.6px 3px;
            padding-top: 50px;
        }
        
                                                                    /* boite zone 5 texte */
        
        #z5 .box4 p{
            font-family:'Lucida Sans';
            font-size: 18px;
            text-align:justify;
            line-height: 40px;
            width: 100%;
        }
        
        
        
        
}