JustalK/PORTFOLIO

@import (reference) "libs/constants.less";
@import (reference) "libs/mixins.less";
 
#LINKS {
    font-family: 'Lato-Light', sans-serif;
    position: absolute;
    right: -75px;
    top: 100px;
    font-weight: bold;
    color: #fff;
    text-transform: uppercase;
    font-size: 4rem;
    transform: translateX(100%) translateY(-12.5px) rotateZ(90deg);
    transform-origin: left;
    .transition(transform 0.25s ease 0.75s);
 
    display: flex;
 
    & a {
        margin-right: 20px;
        display: flex;
        .transition(all 0.25s ease);
 
        &:hover {
            color: @text-color;
        }
 
        & span:hover {
            color: @background-bloc-2;
            .transition(all 0.25s ease);
        }
    }
 
    &.is_animated,
    &.invisible {
        transform: translateX(100%) translateY(-450px) rotateZ(90deg);
    }
}
 
@media screen and (max-width: @SCREEN_1200) {
    #LINKS {
        right: -55px;
    }
}
 
@media screen and (max-width: @SCREEN_900) {
    #LINKS {
        display: none;
    }
}