.link {
    text-align: left;
    display: inline-block;
    border: none;
    min-width: 150px;
    height: 34px;
    border-bottom: 2px solid transparent;
    text-indent: 4px;
    font-size: 18px;
    letter-spacing: 1.5px;
    font-family: 'londrina solid';
    margin: 4px 2px 4px 2px;
    color: white;
    border-radius: 2px;
    box-shadow: 0px 2px 2px rgba(0,0,0, 0.3);
    text-shadow: 0px 1.5px 2px rgba(0,0,0, 0.3);
    box-sizing: border-box;
    cursor: pointer;
}


.link img{
    width: 20px;
    display: inline-block;
    float: right;
    transform: rotate(90deg);
}

.link:hover {
    transition: 0.5s;
    border-bottom: 2px solid rgba(0, 0, 0, 0.3);
}
.link:hover img {
    animation: example 3.5s infinite;
}

@keyframes example {
  0%   {transform: rotate(90deg);}
  1%   {transform: rotate(88deg);}  
  5%  {transform: rotate(105deg);}
  10%  {transform: rotate(75deg);}
  18% {transform: rotate(95deg);}
  20% {transform: rotate(90deg);} 
  100% {transform: rotate(90deg);}
}

@media only screen and (max-width: 400px) {
    .link {
        width: 100%;
        font-size: 15px;
        text-indent: 4px;
    }
}