body {
    font-family:Monaco, "Bitstream Vera Sans Mono", "Lucida Console", Terminal, monospace;
    background-color: #1e1e1e;
    color: #cccccc;
    height: 100%;
    background-image: url("static/background.png");
    background-repeat: no-repeat;
    background-size: cover;
}
        
@media (min-width: 1132px) {
    aside {
        height: 100%;
    }
}

.card-text {
    color: #000;
}

.code-text:hover > * {
    color: #1fa87a;
}

.social-button {
    position: relative;
    cursor: pointer;
    display: inline-block;
    text-align: center;
    -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0;
    -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s; -ms-transition: all .3s; transition: all .3s;
    width: 48px;
    height: 48px;
    margin: 8px;
    padding: 0px;
    font-size: 160%;
    line-height: 48px;
    z-index: 0;
}

.social-button:hover {
    color: #fff;
}

.social-button:before {
    position: absolute;
    content: '';
    top: -2px;
    left: -2px;
    height: calc(100% + 4px);
    width: calc(100% + 4px);
    border-radius: 5px;
    z-index: -1;
    opacity: 0;
    filter: blur(5px);
    background: linear-gradient(45deg, #ff0000, #ff7300, #fffb00, #48ff00, #00ffd5, #002bff, #7a00ff, #ff00c8, #ff0000);
    background-size: 400%;
    transition: opacity .3s ease-in-out;
    animation: animate 20s linear infinite
}

.social-button:hover:before {
    opacity: 1
}

.social-button:hover:active {
    background: none;
}

.social-button:hover:active:before {
    filter: blur(2px)
}

@keyframes animate {
    0% {
        background-position: 0 0
    }

    50% {
        background-position: 400% 0
    }

    100% {
        background-position: 0 0
    }
}

.social-button-github { background: #424c55; }
.social-button-github:before {
    background: linear-gradient(45deg,  #424c55, #929292 );
    background-size: 400%;
    transition: opacity .3s ease-in-out;
    animation: animate 20s linear infinite
}

.social-button-linkedin { background: #0077B5; }
.social-button-linkedin:before {
    background: linear-gradient(45deg,  #72b2d4, #0077B5 );
    background-size: 400%;
    transition: opacity .3s ease-in-out;
    animation: animate 20s linear infinite
}

.social-button-ludumdare { background: #e99343; }
.social-button-ludumdare:before {
    background: linear-gradient(45deg,  #ffbb00, #ff5e00 );
    background-size: 400%;
    transition: opacity .3s ease-in-out;
    animation: animate 20s linear infinite
}