/* Style Settings */
@import url('https://fonts.googleapis.com/css?family=Karla:400,700&display=swap');
:root {
    --bgColor: rgb(41, 149, 212);
    --accentColor: white;
    --font: 'Karla', sans-serif;
}

body{
    /*background-color: var(--bgColor);*/
    background: rgb(14,167,214);
background: -moz-linear-gradient(0deg, rgba(14,167,214,1) 0%, rgba(12,114,196,1) 100%);
background: -webkit-linear-gradient(0deg, rgba(14,167,214,1) 0%, rgba(12,114,196,1) 100%);
background: linear-gradient(0deg, rgba(14,167,214,1) 0%, rgba(12,114,196,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0ea7d6",endColorstr="#0c72c4",GradientType=1);
background-repeat: no-repeat;
    background-attachment: fixed;
    padding:0 15px;
}

#userPhoto{
    width: 150px;
    /*height: 96px;*/
    /*max-width:250px;*/
    display: block;
    /*margin: 50px auto 50px;*/
    margin: 30px auto 20px;
    /*border-radius: 50%;*/
}

#userName{
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.25;
    display: block;
    font-family: var(--font);
    width: 100%;
    text-align: center;
    text-decoration: none;
}

#links{
    max-width: 675px;
    width: auto;
    display: block;
    margin: 27px auto;
}
.link{
    display: block;
    background-color: var(--accentColor);
    color: var(--bgColor);
    font-family: var(--font);
    text-align: center;
    margin-bottom: 20px;
    padding: 17px;
    text-decoration: none;
    font-size: 1.5rem;
    transition: all .25s cubic-bezier(.08,.59,.29,.99);
    border: solid var(--accentColor) 2px;
    position:relative;
    text-transform:uppercase;
    position:relative;
}

.link:hover{
    background-color: var(--bgColor);
    color: var(--accentColor);
}

#links p{
    padding-top:15px;
    text-align:center;
    font-family: var(--font);
}

.link i{
    position:absolute;
    left:17px;
    font-size:1.5em;
    /*position:relative;*/
    /*top:.12em;*/
    top:50%;
    transform:translateY(-50%);
}

#footer{
    padding-top:25px;
    color:#fff;
    text-align:center;
    font-family: var(--font);
}

.row{
    display:flex;
    margin:0 -9px;
}
.col2{
    display:inline-block;
    width:50%;
    padding:0 9px;
}