html * {
    font-family: Helvetica, sans-serif;
}

body {
    background-color: #f2f2f2;
    color: #333333;
}

#bio > p > .fa {
    font-size: large;
} 


#bio > p > a > .fa-clickable {
    font-size: larger;
} 

#bio > p > a {
    color: #2E86C1;
    text-decoration: none;
}

#bio > p > a:hover {
    text-decoration: underline;
 }

/* .pub_div > p {
    margin: 0px;
    padding: 0px;
} */

.pub > a {
    color: #333333;
    text-decoration: none;
}

.pub > a:hover {
    color: #54a2d6;
    text-decoration: underline;
}

.authors {
    padding: 0px;
    margin: 0px;
}

.pub {
    font-size: medium;
    font-family: Helvetica;
    font-weight: bold;
}

.conf {
    font-style: italic;
}

footer {
    color: gray;
    font-size: smaller;
}

#pic {
    margin-left:10px;
    float: right;
    height: 230;
}

.exinfo {
    font-family: sans-serif;
    font-size: small;
    background-color: #2E86C1;
    color: #f2f2f2;
    padding: 2px 3px 2px 3px;
    font-weight: 500;
    border-radius: 5px;
    text-decoration: none;
}
.exinfo:hover{
    text-decoration: underline;
}

@media (min-width: 960px) {
    body {
        margin: 0% 20% 0% 20%;
    }
}


@media (max-width: 960px) {
    body {
        margin: 0% 5% 0% 5%;
    }
    #pic {
        margin-left:10px;
        width: 40%;
        height: 40%;
    }
}
img {
    width: 250px; 
    object-fit: cover;
    object-position: 0% 40%; 
}