body {
    background-color: rgb(51, 51, 51);
    color: rgb(238, 238, 238);
}

h1 {
    margin-bottom: 0.3rem;
}

a {
    display: inline-block;
    font-weight: bold;
    text-decoration: none;
    transition: 0.5s color ease;
    color: #81b3d2;
    -webkit-backface-visibility:hidden;
            backface-visibility:hidden;
    position: relative;
}

a:hover {
    color: #d68592;
}

/* too cheap looking, but kinda nice on the social icons
a:hover {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
}
*/

.container {
    max-width: 850px;
    margin-top: 12%;
    text-align: center;
}

.columns {
    margin-top: 4rem;
    margin-bottom: 4rem;
}

.icon {
    font-size: 3rem;
    padding: 1rem;
}

.layoutcolumn {
    display: none;
}

.socialdesc {
    display: none;
}

#socialmobile {
    text-align: center;
    display: block;
}

#social {
    display: none;
}

#keysicon {
    text-align: center;
    margin-bottom: 0px;
}

#keysdesc {
    text-align: center;
    white-space: nowrap;
    margin-top: 0px;
    margin-bottom: 0px;
}

#cvicon {
    text-align: center;
    margin-bottom: 0px;
}

#cvdesc {
    text-align: center;
    white-space: nowrap;
    margin-top: 0px;
    margin-bottom: 0px;
}

/* debug stuff */
.border_red {
    border: 1px solid red;
}

.border_blue {
    border: 1px solid blue;
}

.border_green {
    border: 1px solid green;
}

.border_yellow {
    border: 1px solid yellow;
}

/* Larger than phablet */
@media (min-width: 550px) {
    .icon {
        font-size: 6rem;
    }

    #socialmobile {
        display: none;
    }

    #social {
        display: block;
    }

    #keysicon {
        text-align: right;
        margin-bottom: 4rem;
    }

    #keysdesc {
        text-align: left;
        margin-top: 4rem;
        margin-bottom: 4rem;
    }

    #cvicon {
        text-align: right;
        margin-bottom: 4rem;
    }

    #cvdesc {
        text-align: left;
        margin-top: 4rem;
        margin-bottom: 4rem;
    }

    .socialdesc {
        display: block;
    }
    .layoutcolumn {
        display: block;
    }
}