/* 
    Cree le : 30 sept. 2016, 19:31:04
    Auteur  : Emmanuel
*/

div#header {
    animation-duration: 5s;
    animation-name: height_header;
    animation-iteration-count: 1;
}

div#header img {
    animation-duration: 5s;
    animation-name: scale;
    animation-iteration-count: 1;
}

div#zomb_accueil, div#accroche_accueil h2, nav#menu {
    animation-duration: 5s;
    animation-name: opacity;
    animation-iteration-count: 1;
    animation-delay: 4s;
    animation-fill-mode: backwards;

}

#premier_accroche_accueil {
    animation-duration: 2s;
    animation-name: slide_in_right;
    animation-iteration-count: 1;
    animation-delay: 5s;
    animation-fill-mode: backwards;
}

#deuxieme_accroche_accueil {
    animation-duration: 2s;
    animation-name: slide_in_right;
    animation-iteration-count: 1;
    animation-delay: 7s;
    animation-fill-mode: backwards;
}

#troisieme_accroche_accueil {
    animation-duration: 2s;
    animation-name: slide_in_right;
    animation-iteration-count: 1;
    animation-delay: 9s;
    animation-fill-mode: backwards;
}

#quatrieme_accroche_accueil {
    animation-duration: 2s;
    animation-name: slide_in_right;
    animation-iteration-count: 1;
    animation-delay: 11s;
    animation-fill-mode: backwards;
}

div#texte_accueil, div#savoir_plus {
    animation-duration: 5s;
    animation-name: opacity;
    animation-iteration-count: 1;
    animation-delay: 12s;
    animation-fill-mode: backwards;
}

img.tete_attitude {
    animation-duration: 5s;
    animation-name: rotate_tete_bas_droite;
    animation-iteration-count: infinite;
}

img.bras_gauche_attitude, img.bras_droite_attitude {
    animation-duration: 5s;
    animation-name: rotate_bras_gauche_attitude;
    animation-iteration-count: infinite;
}

img.main_gauche_attitude {
    animation-duration: 5s;
    animation-name: rotate_main_gauche_attitude;
    animation-iteration-count: infinite;
}

img.main_droite_attitude {
    animation-duration: 5s;
    animation-name: rotate_main_droite_attitude;
    animation-iteration-count: infinite;
}

img.bras_droit_accueil {
    animation-duration: 5s;
    animation-name: rotate_bras_droite_accueil;
    animation-iteration-count: infinite;
}


img.torse_accueil {
    animation-duration: 5s;
    animation-name: rotate_torse_accueil;
    animation-iteration-count: infinite;
}

img.tete_accueil {
    animation-duration: 5s;
    animation-name: rotate_tete_accueil;
    animation-iteration-count: infinite;
}

img.jambe_gauche_loisir {
    animation-duration: 5s;
    animation-name: rotate_jambe_gauche_loisir;
    animation-iteration-count: infinite;
}

img.jambe_droite_loisir {
    animation-duration: 5s;
    animation-name: rotate_jambe_droite_loisir;
    animation-iteration-count: infinite;
}

img.balle_tennis {
    animation-duration: 2s;
    animation-name: rotate_balle_tennis;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

img.tete_loisir {
    animation-duration: 5s;
    animation-name: rotate_tete_loisir;
    animation-iteration-count: infinite;
}

img.corde_capture {
    animation-duration: 5s;
    animation-name: rotate_corde_capture;
    animation-iteration-count: infinite;
}

img.jambe_gauche_capture {
    animation-duration: 5s;
    animation-name: rotate_jambe_gauche_capture;
    animation-iteration-count: infinite;
}

img.bras_gauche_capture {
    animation-duration: 5s;
    animation-name: rotate_bras_gauche_capture;
    animation-iteration-count: infinite;
}

img.bras_gauche_capture {
    animation-duration: 5s;
    animation-name: rotate_bras_gauche_capture;
    animation-iteration-count: infinite;
}

img.torse_capture {
    animation-duration: 5s;
    animation-name: torse_capture;
    animation-iteration-count: infinite;
}

img.bras_droit_capture {
    animation-duration: 5s;
    animation-name: bras_droit_capture;
    animation-iteration-count: infinite;
}

img.bras_tourne_inverse {
    animation-duration: 5s;
    animation-name: bras_tourne_inverse;
    animation-iteration-count: infinite;
}


img.bras_tourne_montre {
    animation-duration: 5s;
    animation-name: bras_tourne_montre;
    animation-iteration-count: infinite;
}

img.shake_head {
    animation-duration: 6s;
    animation-name: shake_head;
    animation-iteration-count: infinite;
}


/*****
        KeyFrames
*****/

@keyframes shake_head {
    from {
        transform: rotate(5deg);
    }
    2.5% {
        transform: rotate(-4deg);
    }
    5% {
        transform: rotate(4deg);
    }
    10% {
        transform: rotate(8deg);
    }
    13% {
        transform: rotate(-2deg);
    }
    15% {
        transform: rotate(1deg);
    }
    20% {
        transform: rotate(-8deg);
    }
    25% {
        transform: rotate(5deg);
    }
    30% {
        transform: rotate(1deg);
    }
    35% {
        transform: rotate(10deg);
    }
    40% {
        transform: rotate(8deg);
    }
    45% {
        transform: rotate(12deg);
    }
    50% {
        transform: rotate(13deg);
    }
    55% {
        transform: rotate(6deg);
    }
    60% {
        transform: rotate(-3deg);
    }
    to {
        transform: rotate(5deg);
    }
}

@keyframes bras_tourne_montre {
    from {
        transform: rotate(360deg);
    }
    to {
        transform: rotate(0deg);
    }
}

@keyframes bras_tourne_inverse {
    from {
        transform: rotate(360deg);
        top: 0;
    }
    50% {
        
        top: 40px;
    }
    to {
        transform: rotate(0deg);
        top: 0;
    }
}


@keyframes bras_droit_capture {
    from {
        transform: rotate(2deg);
    }
    50% {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(2deg);
    }
}

@keyframes torse_capture {
    from {
        transform: rotate(-4deg);
    }
    50% {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(-4deg);
    }
}

@keyframes rotate_bras_gauche_capture {
    from {
        transform: rotate(-10deg);
    }
    50% {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(-10deg);
    }
}


@keyframes rotate_jambe_gauche_capture {
    from {
        transform: rotate(-4deg);
    }
    50% {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(-4deg);
    }
}

@keyframes rotate_corde_capture {
    from {
        transform: rotate(3deg);
    }
    50% {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(3deg);
    }
}

@keyframes rotate_tete_loisir {
    from {
        transform: rotate(2deg);
    }
    50% {
        transform: rotate(-2deg);
    }
    to {
        transform: rotate(2deg);
    }
}

@keyframes rotate_balle_tennis {
    from {
        transform: rotate(360deg);
    }
    to {
        transform: rotate(0deg);
    }
}

@keyframes rotate_jambe_droite_loisir {
    from {
        transform: rotate(-5deg);
    }
    50% {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(-5deg);
    }
}


@keyframes rotate_jambe_gauche_loisir {
    from {
        transform: rotate(5deg);
    }
    50% {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(5deg);
    }
}

@keyframes rotate_tete_accueil {
    from {
        transform: rotate(6deg);
    }
    50% {
        transform: rotate(4deg);
    }
    to {
        transform: rotate(6deg);
    }
}

@keyframes rotate_torse_accueil {
    from {
        transform: rotate(2deg);
    }
    50% {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(2deg);
    }
}

@keyframes rotate_bras_droite_accueil {
    from {
        transform: rotate(3deg);
        margin-top: 10px;
    }
    50% {
        transform: rotate(0deg);
        margin-top: 0;
    }
    to {
        transform: rotate(3deg);
        margin-top: 10px;
    }
}

@keyframes rotate_main_droite_attitude {
    from {
        transform: rotate(12deg);
        margin-top: 20px;
    }
    50% {
        transform: rotate(0deg);
        margin-top: 0;
    }
    to {
        transform: rotate(12deg);
        margin-top: 20px;
    }
}

@keyframes rotate_main_gauche_attitude {
    from {
        transform: rotate(-7deg);
    }
    50% {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(-7deg);
    }
}

@keyframes rotate_bras_gauche_attitude {
    from {
        transform: rotate(-5deg);
    }
    50% {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(-5deg);
    }
}

@keyframes rotate_tete_bas_droite {
    from {
        transform: rotate(2deg);
    }
    50% {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(2deg);
    }
}


@keyframes height_header {
    from {
        padding-bottom: 1200px;
    }

    to {
        padding-bottom: 0;
    }
}

@keyframes scale {
    from {
        margin-top: 600px;
        transform: scale(4,4);
    }

    to {
        margin-top: 0;
        transform: scale(1,1);
    }
}

@keyframes opacity {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes slide_in_right {
    from {
        margin-left: 150%;
        width: 100%;
    }

    to {
        margin-right:0%;
        width: 100%;
    }
}


@keyframes key_monte-desc {
    from {
        margin-top: 5%;
    }
    10% {
        margin-top: 10%;
    }
    20%{
        margin-top: 5%;
    }
    50% {
        margin-top: 5%;
    }
    60% {
        margin-top: 10%;
    }
    to {
        margin-top: 5%;
    }
}