#teamNav {
    text-align: center;
    background-color: #2d6a9f; /*Bootstrap darker blue */
    color: #FFF;
}

.full-width > div {
    font-size: 2rem;
    border: 2px solid black;
    background-color: #428bca; /*Bootstrap lighter blue */
    padding: 2%;
}
div.active {
    background-color: #2d6a9f;
}
a {
    text-decoration: none;
    color: inherit;
}

a:hover {
    text-decoration: none;
    color: inherit;
}

.glyph {
    padding: 1rem;
    text-align: right;
    font-size: 3rem;
}

.left {
    border-right: 1px solid gray;
}

.right {
    border-left: 1px solid gray;
}

.big-text {
    font-size: 2rem;
}

hr {
    background-color: #000;
    color: #000;
    height: 1px;
}

div.circle-avatar {
    /* make it responsive */
max-width: 100%;
width:100%;
height:auto;
display:block;
/* div height to be the same as width*/
padding-top:100%;

/* make it a circle */
border-radius:50%;

/* Centering on image`s center*/
background-position-y: center;
background-position-x: center;
background-repeat: no-repeat;

/* it makes the clue thing, takes smaller dimension to fill div */
background-size: cover;

/* it is optional, for making this div centered in parent*/
margin: 0 auto;
top: 0;
left: 0;
right: 0;
bottom: 0;
}