.wrap-header .container .head-logo {
       width:240px;
      display: inline-block;
      position: relative;
      animation: rotate3  1s linear }


.wrap-header .container .head-logo p {
       width:57px;
      display: inline-block;
      position: relative;
      animation: rotate  3s linear infinite;}

 @keyframes rotate{
      0%{ transform: rotateY( 360deg); opcity:0.5;}   
      40%{ transform: rotateY( 0deg);}
      60%{ transform: rotateY( 0deg);}
     100%{ transform: rotateY( 0deg);}
        }

.wrap-header .container .head-logo span {
       width:178px;
      display: inline-block;
      position: absolute;
      animation: rotate2  5s linear  infinite;}

 @keyframes rotate2{
   30%{ margin-top:0px; opacity:1;}  
 90%{ margin-top:0px; opacity:1;} 
 93%{ margin-top:0px; opacity:.7;}  
 95%{ margin-top:0px; opacity:.5;}   
 98%{ margin-top:0px; opacity:.3;}   
   100%{ margin-top:0px; opacity:1;}     }

  /*@keyframes rotate3{
0%  {
    transform: scale(3); opacity:0;
  }
   30%  {
    transform: scale(3); opacity:0;
  }
 
  40% {
    transform: none;opacity:1;
  }
}*/

@keyframes rotate3{
      0%{ margin-top:-300px;opacity:0;}   
   40%{ margin-top:0px; opacity:1;}     }