html body{
width:100%;
margin:0;
padding:0;

}
#header{
height:10%;
width:100%;
 background: url("../images/bord_haut.jpg") repeat  ;
 box-shadow: 0 0 10px -1px #000000;
}

#footer{
height:10%;
width:100%;
 background: url("../images/bord_haut.jpg") repeat ;
 position:fixed; bottom:0;
 box-shadow: 0 0 10px -1px #000000;
}
#container {
    min-height: 600px;padding: 50px 0;
}


#mascotte {
    background: url("../images/mascotte.png") no-repeat scroll center center rgba(0, 0, 0, 0);
    height: 445px;
    width: 240px;
}


#mag {
    animation: 5s ease 0s normal none infinite rotate-main;
    float: left;
    left: 38px;
    position: relative;
    top: 273px;
}

#pid {
    animation: 3s ease 0s normal none infinite rotate-pied;
    float: left;
    left: 56px;
    position: relative;
    top: 371px;
}

#ballon {
    animation: 5s ease 0s normal none infinite rotate-main;
    float: left;
    left: -97px;
    position: relative;
    top: 25px;
}
@keyframes rotate-pied {
    0% {
        transform: rotate(0deg)
    }
   
    50% {
        transform: rotate(25deg)
    }
   
   
    100% {
        transform: rotate(0deg)
    }
} 
@keyframes rotate-main {
    0% {
        transform: translateY(0px)
    }
   
    50% {
        transform: translateY(-10px)
    }
   
   
    100% {
        transform: translateY(0px)
    }
}
.texte > h3 {
    font-family: 'Pacifico',Cambria,Georgia,serif;
    font-size: 31px;
    margin: 0 0 10px;
} 

h2:hover { z-index:999999}