/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.12,
* Autoprefixer: v10.4.4
* Browsers: last 4 version
*/
    
body #content{
    min-height: 100%;
   
  
}
                                                            /* zone 1*/
#zv1 {
    text-align: center;
    width: 100%;
} 
#zv1 .box1 {
    padding-top: 50px;
    width: 90%; 
    height: auto;
    text-align: center;
    margin: 0 auto;
}
                                                        /* Code zone 1 titre */
#zv1 .box1 h1{
    font-family: Impact;
    color: rgb(24, 24, 24);
    font-size: 50px;
    text-shadow: rgb(219, 219, 219) 0.6px 3px;
    padding-top: 100px;
}
#zv1 .box1 p{
    padding: 12px;
    font-family: arial;
    font-size: 27px;
    text-align:justify ;
    line-height: 60px;
}


                                                                 /* code de la zone 2 a propos*/

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

                                                                    /* boite zone 2 */


#zv2 .b1{
    text-align: center;
    width: 100%;
    height: 200px;
    background-image: url(img/banner\ 1.png);
    margin: 0 auto;
}
#zv2 .b1 h1{
    font-family: Impact;
    color: rgb(255, 255, 255);
    font-size: 50px;
    text-shadow: rgb(26, 26, 26) 0.6px 3px;
    padding-top: 70px;
}
                                                                    /* zone 2 box 1 */
#zv2 .box1 {
    padding-top: 50px;
    width: 90%; 
    height: auto;
    text-align: center;
    margin: 0 auto;
}
                                                                 /* boite zone 2 texte */

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

                                                                /* zone 2 style bouton a propos  */
#zv2 .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;
    
}
#zv2 .box1 .button:hover{
    background-color: rgb(24, 24, 24);
}

                                                        /* code de la zone 3 Bio */

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

                                                            /* boite zone 3 */

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

                                                            /* boite zone 3 titre bio*/

#zv3 .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 */

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

                                                        /* zone 3 style bouton a bio  */
#zv3 .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;
    
}

#zv3 .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*/
#zv4 {
    width: 100%;
    height: auto;
    background-image: url(img/fond\ programme2.png);
    background-repeat: no-repeat;
} 

                                                            /* boite zone 4 */

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

                                                            /* boite zone 4 titre */

#zv4 .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 */

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

                                                    /* zone 4 style bouton a propos  */
#zv4 .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;
    
}

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

 

@media screen and (max-width:800px){
    #zv1{
        margin: 0;
        padding: 0;
        padding-top: 10px;
        
    }
    #zv1 .box1 h1{
        font-family: Impact;
        color: rgb(31, 31, 31);
        font-size: 30px;
        text-shadow: rgb(236, 236, 236) 0.6px 3px;
        
    }
                                                    /* zone texte */
    #zv1 .box1 p{
    font-family:'Lucida Sans';
    font-size: 18px;
    text-align:justify;
    line-height: 40px;
    width: 100%;
    padding-bottom: 20px;
        
    }     
                                                    /* zone 2 box1 */
    #zv2 .box1{
        width: 90%; 
        text-align: center;
        margin: 0 auto;
         
    } 
                                                /* zone 2 banniere */
        #zv2 .b1 h1{
            font-family: Impact;
            color: rgb(255, 255, 255);
            font-size: 30px;
            text-shadow: rgb(26, 26, 26) 0.6px 3px;
            
        }
                                   
                                                 /* container zone 2 texte */
        
        #zv2 .box1  p{
            font-family:'Lucida Sans';
            font-size: 18px;
            text-align:justify;
            line-height: 40px;
            width: 100%;
           
        }
        #zv3 .box2 {
            padding-top: 50px;
            width: 90%; 
            height: auto;
            text-align: center;
            margin: 0 auto;
        }
        
                                                                    /* boite zone 3 titre bio*/
        
        #zv3 .box2 h1{
            text-align: center;
            font-family: Impact;
            color: rgb(255, 255, 255);
            font-size: 25px;
            text-shadow: rgb(123, 0, 180) 0.7px 3px;
        }
        
                                                                    /* boite zone 3 texte */
        
        #zv3 .box2 p{
            font-family:'Lucida Sans';
            font-size: 18px;
            text-align:justify;
            line-height: 40px;
            width: 100%;
        }
                                                                /* zone4 programme */
        #zv4 .box3 {
            padding-top: 50px;
            padding-bottom: 50px;
            width: 90%; 
            height: auto;
            text-align: center;
            margin: 0 auto;
        }
        
                                                                    /* boite zone 4 titre */
        
        #zv4 .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 */
        
        #zv4 .box3 p{
            font-family:'Lucida Sans';
            font-size: 18px;
            text-align:justify;
            line-height: 40px;
            width: 100%;
        }      
        
}