.mphe {
    display: flex;
    margin-bottom: 40px;
}

@keyframes text {
    0%   {letter-spacing: 0px;}
    50% {letter-spacing: 30px;}
    100%   {letter-spacing: 0px;}
}

@keyframes text2 {
    0%   {letter-spacing: 30px;}
    50% {letter-spacing: 0px;}
    100%   {letter-spacing: 30px;}
}

@keyframes up {
    0%   {translate: 0 50px; transform: rotate(0.05turn);}
    25%  {translate: 0 0px; transform: rotate(0turn);}
    50% {translate: 0 50px; transform: rotate(-0.05turn);}
    75%  {translate: 0 0px; transform: rotate(0turn);}
    100%   {translate: 0 50px; transform: rotate(0.05turn);}
}

@keyframes down {
    0%   {translate: 0 0px; transform: rotate(-0.05turn);}
    25%  {translate: 0 50px; transform: rotate(0turn);}
    50% {translate: 0 0px; transform: rotate(0.05turn);}
    75%  {translate: 0 50px; transform: rotate(0turn);}
    100%   {translate: 0 0px; transform: rotate(-0.05turn);}
}

.links {
    animation-name: text;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.links2 {
    animation-name: text2;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.m, .h {
    animation-name: up;
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.p, .e {
    animation-name: down;
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}