html{
    height: 100%
}

body {
    font-family: 'League Spartan Variable';
    background: radial-gradient(circle at top left, rgba(171,237,206,0.55) 0%, rgba(171,235,237,0.55) 16.17%, rgba(171,197,237,0.55) 33.13%, rgba(195,171,237,0.55) 50.25%, rgba(237,171,193,0.55) 66.38%, rgba(237,198,171,0.55) 82.32%, rgba(237,217,171,0.55) 100%);
    background-size: cover;
    background-position: fixed;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}

@media only screen and (max-width: 768px) {
    body {
        background: radial-gradient(circle at top left, rgba(171,237,206,0.55) 0%, rgba(171,235,237,0.55) 16.17%, rgba(171,197,237,0.55) 33.13%, rgba(195,171,237,0.55) 50.25%, rgba(237,171,193,0.55) 66.38%, rgba(237,198,171,0.55) 82.32%, rgba(237,217,171,0.55) 100%);
        background-size: cover;
        background-attachment: fixed;
        background-repeat: no-repeat;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
    }
}

.profile_card {
    background:rgb(255, 255, 255, 0.70);
    border-radius: 10px;
    height: auto;
    width: 343px;
    margin-top: 32px;
    overflow: auto;
}

.profile_picture {
    display: inline-block;
    position: relative;
    width: 279px;
    height: 279px;
    overflow: hidden;
    border-radius: 50%;
    margin-top: 32px;
    border-color: #FFFFFF;
    box-shadow: 0 3px 5px 0 rgb(102, 111, 117, 0.15);
    border-style: solid;
    border-width: 8px;
}
  
.profile_picture img {
    width: 280px;
    height: auto;
}

.profile_info {
    margin: 0 16px;
}

.no_user {
    font-variation-settings: "wght" 600;
    font-size: 17pt;
    line-height: 28pt;
    color: #030505;
}

.username {
    font-variation-settings: "wght" 600;
    font-size: 18pt;
    line-height: 28pt;
    color: #030505;
}

@media only screen and (max-width: 768px) {
    .profile_info {
        margin-top: 8px;
    }
}


.user_age {
    font-weight: 400;
    font-size: 18pt;
    line-height: 28pt;
    color: #030505;
}

.user_pronouns {
    font-variation-settings: "wght" 400;
    font-size: 12pt;
    line-height: 18pt;
    color: #030505;
}

.description {
    font-variation-settings: "wght" 400;
    font-size: 12pt;
    line-height: 18pt;
    color: #68666B;
    margin: 0 16px;
}

.download_button {
    background-color: #030505;
    display: block;
    border-radius: 10px;
    box-shadow: 0 3px 5px 0 rgba(102, 111, 117, 0.15);
    font-variation-settings: "wght" 600;
    font-size: 15pt;
    line-height: 24pt;
    color: #FFFFFF;
    width: 279px;
    margin: 16px 32px 32px 32px;
    padding: 7px 0;
}

.download_button a {
    text-decoration: none;
    color: #FFFFFF;
}

.download_button a:hover 
{
     color:#FFFFFF; 
     text-decoration:none; 
     cursor:pointer;  
}

.footer_callout {
    font-variation-settings: "wght" 600;
    font-size: 18pt;
    line-height: 28pt;
    color: #030505;
    margin-top: 16px;
    margin-bottom: 16px;
}

.footer_callout img{
    width: 24px;
    vertical-align: middle;
}