/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.12,
* Autoprefixer: v10.4.4
* Browsers: last 4 version
*/


*{
    margin: 0px;
    padding: 0px;  
    -webkit-box-sizing: border-box;  
            box-sizing: border-box;
    outline: none; 
    font-family: Verdana, Geneva, Tahoma, sans-serif
} 

/* Zone1: Code CSS slider 1*/
.zone1{
    margin: 0;
    padding: 0;
    padding-top: 50px;
}
@-webkit-keyframes slider{
    0%{
        left:0;
    }
    20%{
        left:0;
    }
    25%{
        left:-100%;
    }
    45%{
        left:-100%;
    }
    50%{
        left:-200%;
    }
    70%{
        left:-200%;
    }
    73%{
        left:-300%;
    }
    80%{
        left:-300%;
    }
    90%{
        left: -400%;   
    }
    100%{
        left: -400%;   
    }

}
@keyframes slider{
    0%{
        left:0;
    }
    20%{
        left:0;
    }
    25%{
        left:-100%;
    }
    45%{
        left:-100%;
    }
    50%{
        left:-200%;
    }
    70%{
        left:-200%;
    }
    73%{
        left:-300%;
    }
    80%{
        left:-300%;
    }
    90%{
        left: -400%;   
    }
    100%{
        left: -400%;   
    }

}

#slider{
    overflow: hidden;
    width: 100%;
}
#slider figure img{
    width: 20%;
    float: left;
}
#slider figure{
    position: relative;
    width: 500%;
    margin: 0;
    left: 0;
    -webkit-animation: 60s slider infinite;
            animation: 60s slider infinite;
}
                                                    /* Code zone 2 titre banniere vision */
/* code de la zone 2 banniere */
                                         
#zone2 {
    text-align: center;
    width: 100%;
    margin: 0 auto;
    display: inline-block;
} 

#zone2 .box1{
padding-top: 50px;
width: 90%; 
height: 500px;
text-align: center;
margin: 0 auto;
 
}
#zone2 .box1  h1{
    margin-top: 30px;
    font-family: Impact;
    color: rgb(51, 51, 51);
    font-size: 50px;
    text-shadow: rgb(238, 238, 238) 0.7px 3px;
    padding-top: 30px;
}
                                     
#zone2 .box1  p{
    padding: 12px;
    font-family: arial;
    font-size: 27px;
    text-align:justify ;
    line-height: 60px;
   
}

#zone2 .box1 p a{
    color:rgb(33, 14, 66);
    text-decoration: underline;
    font-family: arial;
    font-style: italic;
}
#zone2 .box1 p a:hover{
    color: rgb(0, 140, 255);
    cursor: pointer;
    transition: 0.3s;
}

                                                 /* Code zone 4 banniere a propos*/
#zone4 {
    text-align: center;
    width: 100%;
    height: 200px;
    background-image: url(img/banner\ 1.png);
    margin: 0 auto;
    display: inline-block;
} 

                                            /* Code zone 4 titre banniere a propos*/
#zone4 .banniere2 h1{
    margin-top: 50px;
    font-family: Impact;
    color: rgb(255, 255, 255);
    font-size: 50px;
    text-shadow: rgb(46, 46, 46) 0.6px 3px;
}

                                                 /* code de la zone 5 a propos*/

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

                                            /* boite zone 5 box àpropos */

#zone5 .box2 {
margin: 0 auto;
width: 90%;
padding: 25px;
text-align: center;
}
                                            /* boite à propos texte*/

#zone5 .box2 p{
    font-family: arial;
    font-size: 27px;
    text-align:justify ;
    line-height: 60px;
}

#zone5 .box2 p a{
    color:rgb(33, 14, 66);
    text-decoration: underline;
    font-family: arial;
    font-style: italic;
}
#zone5 .box2 p a:hover{
    color: rgb(0, 140, 255);
    cursor: pointer;
    transition: 0.3s;
}

                                        /* zone 5 style bouton a propos  */
#zone5 .box2 .button {
    padding: .5rem 1rem;
    background-color: #080808e0;
    color:white;
    border-radius: 5px;
    text-decoration: none;
    margin: 0 auto;
    margin-bottom: 50px;
    
}
#zone5 .box2 .button:hover{
    background-color: #232324de;
}
    
                                                /* Zone video */
/* bannière */

#zoney{
    width: 100%;
    height: 170px;
    margin: 0 auto;
    background-color: #FF3CAC;
    background-image: linear-gradient(225deg, #FF3CAC 0%, #784BA0 50%, #2B86C5 100%);

}

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

                       
                                                        /* code de la zone 6 Programme */

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

                                                            /* boite zone 6 */

#zone6 .box3 {
margin: 0 auto;
padding-top:80px ;
width: 95%;
}

                                                            /* boite zone 6 titre */

#zone6 .box3 h1{
    margin-top: 30px;
    font-family: Impact;
    color: rgb(255, 255, 255);
    font-size: 50px;
    text-shadow: rgb(87, 2, 121) 0.7px 3px;
    text-align: center;
}

                                                            /* boite zone 6 texte */

#zone6 .box3 p{
    font-family: arial;
    font-size: 27px;
    text-align:justify ;
    line-height: 60px;
    color: white;
}

                                        /* zone 6 style bouton   */
#zone6 .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;
    
}

#zone6 .box3 .button:hover{
    background-color: #57148de8;
    cursor: pointer;
}


                                                             /* code de la zone 7 soutenir */

                                                            /* Code général de la zone soutenir*/
#zone7 {
    width: 100%;
    height: auto;
    background-repeat: no-repeat;
    text-align: center;
    background-image: linear-gradient(to top, #fafafa 0%, white 100%);
} 

                                                            /* boite zone 7 */

#zone7 .box4 {
margin: 0 auto;
padding-top:80px ;
width: 95%;
}

                                                            /* boite zone 7 titre */

#zone7 .box4 h1{
    text-align: center;
    font-family: Impact;
    padding-top: 60px;
    color: rgb(51, 51, 51);
    font-size: 50px;
    text-shadow: rgb(238, 238, 238) 0.7px 3px;
}

                                                            /* boite zone 7 texte */

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

                                                         /* zone 7 style bouton  */
#zone7 .box4 .button {
    padding: .5rem 1rem;
    background-color:  rgb(51, 51, 51);
    color:white;
    border: 1px solid transparent;
    border-radius: 5px;
    text-decoration: none;
    display: inline-block;
    margin-bottom: 80px;
    width: 170px;
    
}

#zone7 .box4 .button:hover{
    background-color: rgb(59, 59, 59);
    cursor: pointer;
}

/* banniere diapo 2 */
#zoneb {
    text-align: center;
    width: 100%;
    height: 250px;
    background-image: url(img/don.jpg);
    margin: 0 auto;
    display: inline-block;
} 


                                                        /* code responsive */
@media all and (max-width:1260px){
    .zone1{
        margin: 0;
        padding: 0;
        padding-top: 30px;
    }
}



@media all and (max-width:800px){
    .zone1{
        margin: 0;
        padding: 0;
        padding-top: 40px;
        
    }
                                                    /* zone 2 box1 */
    #zone2 .box1{
        padding-top: 30px;
        width: 90%; 
        height: 500px;
        text-align: center;
        margin: 0 auto;
         
        }                                      
                                                    /* zone2 box 1 titre */
        #zone2 .box1 h1{
            font-size: 30px;
        }
                                                 /* container zone 2 texte */
        
        #zone2 .box1  p{
            font-family:'Lucida Sans';
            font-size: 18px;
            text-align:justify;
            line-height: 40px;
            width: 100%;
        }
        
                                                /* zone 2 style button vision  */
        #zone2 .box1 p a{
            color:rgb(33, 14, 66);
            text-decoration: underline;
            font-family: arial;
            font-style: italic;
        }
                                                 /* Code zone 4 banniere a propos*/
    #zone4 {
    text-align: center;
    width: 100%;
    height: 150px;
    background-image: url(img/banner\ 1.png);
    margin: 0 auto;
    display: inline-block;
    } 
    
                                            /* Code zone 4 titre banniere a propos*/
    #zone4 .banniere2 h1{
    margin-top: 50px;
    font-family: Impact;
    font-size: 30px;
    
    }
    /* video banner */
    #zoney .banner h1{
        margin-top: 30px;
        font-family: Impact;
        font-size: 30px;
        padding-top: 70px;
    }
    
        /* code de la zone 5 a propos*/
    
    /* Code général de la zone a propos*/
    #zone5 {
        width: 100%;
        height: auto;
        background-color: white;
        text-align: center;
        padding-bottom: 10px;
    } 

                                /* boite simple */
                                /* boite zone 5 à propos texte */
    
    #zone5 .box2 p{
            font-family:'Lucida Sans';
            font-size: 18px;
            text-align:justify;
            line-height: 40px;
            width: 100%;
    }
    
                            /* zone 5 style bouton a propos  */
    #zone5 .box2 .button {
        padding: .5rem 1rem;
        background-color: #080808e0;
        color:white;
        border: 1px solid transparent;
        border-radius: 5px;
        text-decoration: none;
        display: inline-block;
        margin-bottom: 20px;
        
    }
    
    #zone5 .box2 .button:hover{
        background-color: #232324de;
    }
                                                         /* boite zone 6 titre */

    #zone6 .box3 h1{
        margin-top: 30px;
        font-family: Impact;
        font-size: 30px;
    }
    
                                                                /* boite zone 6 texte */
    #zone6 .box3 {
        margin: 0 auto;
        padding-top:30px ;
        width: 95%;
        }
    #zone6 .box3 p{
        font-family:'Lucida Sans';
        font-size: 18px;
        text-align:justify;
        line-height: 40px;
        width: 100%;
    }


                                      /* boite zone 7 titre */

                                /* Code général de la zone soutenir*/
#zone7 {
    width: 100%;
    height: auto;
    background-repeat: no-repeat;
} 

                                    /* boite zone 7 */

#zone7 .box4 {
text-align: center;
padding-top:30px ;
width: 95%;
}
#zone7 .box4 h1{
    margin-top: 30px;
    font-family: Impact;
    font-size: 30px;
    padding-top: 30px;
}
                                                           /* boite zone 7 texte */

#zone7 .box4 p{
    font-family:'Lucida Sans';
    font-size: 18px;
    text-align:justify;
    line-height: 40px;
    width: 100%;
}
                                                    

  
}