body {
    font-family: 'Open Sans', sans-serif;
}

.monospace {
    font-family: 'Fira Code', Courier, monospace;
}

.section-header {
    font-family: 'Fira Code', Courier, monospace;
    margin-left: -0em;
}

.section-header::before {
    content: "";
}

.sticky-header {
    position  : fixed;
    top       : 0rem;
    left      : 0rem;
    padding   : 1rem;
    font-size : 1.5rem;
    text-align: center;
    word-wrap : break-word;
}

.avatar {
    position: relative;
    width   : 85%;
    /* The size you want */
}

.avatar:after {
    content       : "";
    display       : block;
    padding-bottom: 100%;
    /* The padding depends on the width, not on the height, so with a padding-bottom of 100% you will get a square */
}

.avatar img {
    position                            : absolute;
    /* Take your picture out of the flow */
    top                                 : 0;
    bottom                              : 0;
    left                                : 0;
    right                               : 0;
    /* Make the picture taking the size of it's parent */
    width                               : 100%;
    /* This if for the object-fit */
    height                              : 100%;
    /* This if for the object-fit */
    object-fit                          : cover;
    /* Equivalent of the background-size: cover; of a background-image */
    object-position                     : center;
    border-radius                       : 50%;
}

:root {
    --mainColor: #5daae0;
}

.link {
    background:
        linear-gradient(to bottom, var(--mainColor) 0%,
            var(--mainColor) 100%);
    background-position: 0 100%;
    background-repeat  : repeat-x;
    background-size    : 4px 0px;
    text-decoration    : none;
    transition         : background-size .08s;
}

.link:hover {
    background-size: 4px 3px;
}

.ultrabold {
    font-weight    : bolder;
    text-decoration: underline;
}

.gh-repo {
    font-size  : 1em;
    line-height: 200%;
}

.project-title {
    margin-left: -0.3em;
}

.project-desc {
    margin-top: -1em;
}

#clustrmaps-widget-v2 {
    display: none;
}

.education-pretitle {
    margin-bottom: -1em;
    font-size: 0.8em;
}
