/************ MOUVE **************/
/*************** VOIR PLUS *****************/
div .col:hover a{
                            -webkit-transition: width 2s, height 2s, -webkit-transform 2s;
                            -webkit-transform: rotate(360deg); /* Safari */
                              transform: rotate(360deg);
                            }

                            div .col-4:hover img{
                            transform: scale(1.2,1.2) translate(5px, 0px);
                            transition-duration: 2s;}
/************** MENU *************************/
  ul #mouve:hover {
                            transform: scale(1.2,1.2) translate(5px, 0px);
                            transition-duration: 0.1s;}
/************ PHOTO DG ************/
 #DG:hover {
                              transform: scale(1.8) translate(40px, 63px);
                              transition-duration: 5s;
                                border: 3px solid rgba(0,0,0,.4); 
}

/********* logo armp ***************/


.element {
  display: inline-block;

 

  text-align: center;
  
  font-family: Verdana, sans-serif;

 
}

.one { 
  transform: rotateX(40deg);
  animation: one 2s infinite;
  animation-direction: alternate;
}

.two {
  transform: rotateY(40deg);
  animation: two 2s infinite;
  animation-direction: alternate;
  background-color: #831a4a;
}

.three {
  transform: rotateZ(100deg);
  animation: three 2s infinite;
  animation-direction: alternate;
  background-color: #439772;
}

@keyframes one {
  0% {
    transform: rotateX(0);
  }
  100% {
    transform: rotateX(50deg);
  }
}

@keyframes two {
  0% {
    transform: rotateY(0);
  }
  100% {
    transform: rotateY(70deg);
  }
}

@keyframes three {
  0% {
    transform: rotateZ(0);
  }
  100% {
    transform: rotateZ(100deg);
  }
}