.link{
color: #fff;
font-family: 'Lobster', cursive;
font-size: 30px;
font-weight: 400;
line-height: 25px;
letter-spacing: 1px;
text-transform: capitalize;
padding: 2px 2px 0;
display: inline-block;
overflow: hidden;
position: relative;
transition: all .4s ease;
}
.link:focus,
.link:hover{ color: #1e3799; }
.link:before{
content: attr(data-content);
color: #0984e3;
background-color: #fff;
width: 100%;
height: 100%;
padding: 2px 2px 0;
transform-origin: top center;
position: absolute;
left: 0;
top: 0;
transition: all 0.4s ease-out;
}
.link:hover:before{
opacity: 0;
transform: perspective(500px) rotateY(150deg);
}
@media only screen and (max-width: 767px){
.link{ margin: 0 0 30px; }
}