.mobile-link
{
    position: fixed;
    right: 0;
    z-index: 100005;
    background-color: #232322;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    padding: 0.5rem 1.5rem 0.5rem 1rem;
    line-height: 1rem;
    font-size: 1rem;
    transform-origin: right bottom;
    cursor: pointer;
    text-decoration: none;
    border-radius: 1rem 1rem 0 0;
    bottom: 2rem;
    transform: rotate(-90deg) translate(100%, 0%);
    /*box-shadow: 5px 10px 10px 0px rgba(0, 0, 0, 0.5);*/
    -webkit-transition: all ease-in-out 0.4s;
    -moz-transition: all ease-in-out 0.4s;
    -ms-transition: all ease-in-out 0.4s;
    -o-transition: all ease-in-out 0.4s;
    transition: all ease-in-out 0.4s;

}

.mobile-link:hover
{
    color: rgba(122, 196, 170, 1);
}

.mobile-link span
{
    display: inline-block;
    text-transform: unset;
}

.mobile-link .title
{
    letter-spacing: 0.15rem;
    display: inline-block;
    text-transform: unset;
    line-height: 1.25rem;
    background-color: rgba(0, 0, 0, 0.1);
    letter-spacing: 0.15rem;
    /*padding: 0.25rem 0.5rem;*/
    /*border-radius: 0.5rem;*/
}

@-webkit-keyframes pulse2
{
    0%
    {
        -webkit-box-shadow: 0 0 0 0 rgba(122, 196, 170, 0.4);
    }
    70%
    {
        -webkit-box-shadow: 0 0 0 25px rgba(122, 196, 170, 0);
    }
    100%
    {
        -webkit-box-shadow: 0 0 0 0 rgba(122, 196, 170, 0);
    }
}

@keyframes pulse2
{
    0%
    {
        -moz-box-shadow: 0 0 0 0 rgba(122, 196, 170, 0.4);
        box-shadow: 0 0 0 0 rgba(122, 196, 170, 0.4);
    }
    70%
    {
        -moz-box-shadow: 0 0 0 25px rgba(122, 196, 170, 0);
        box-shadow: 0 0 0 25px rgba(122, 196, 170, 0);
    }
    100%
    {
        -moz-box-shadow: 0 0 0 0 rgba(122, 196, 170, 0);
        box-shadow: 0 0 0 0 rgba(122, 196, 170, 0);
    }
}

.mobile-link .pulse
{
    right: 0;
    top: 50%;
    position: absolute;
    transform: translate(0, -50%);
    display: block;
    width: 1rem;
    height: 1rem;
    margin-right: 0.75rem;
    border-radius: 50%;
    background: rgba(122, 196, 170, 1);
    cursor: pointer;
    box-shadow: 0 0 0 rgba(122, 196, 170, 0.4);
    animation: pulse2 2s infinite;
}

.mobile-link .pulse:hover
{
    animation: none;
}

/*

@phoneLandscapeViewportWidth: 30em;     // 480px
@tabletViewportWidth: 48em;             // 768px
@tabletLandscapeViewportWidth: 64em;    // 1024px
@desktopViewportWidth: 78.75em;         // 1260px

*/

@media (min-width: 768px)
{
    .mobile-link
    {
        font-size: 1.25rem;
        padding: 1rem 2.5rem 1rem 1.5rem;
        bottom: 50%;
        transform: rotate(-90deg) translate(25%, 0%);
    }
}