// Sidebar // // Styles for the sidebar.
.masthead {
text-align: center; margin: auto; width: 100%; a { color: inherit; text-decoration: none; }
}
.avatar-image {
width: 30%; height: auto; border-radius: 50%; display: block; margin-right: auto; margin-left: auto;
}
.masthead-title {
padding: 0; margin: 0; font-size: 2rem; font-weight: 900; a:hover, a:focus { color: var(--link-hover-color); }
}
.masthead-tagline {
padding: 0; margin: 0; font-size: 1.25rem; font-weight: 400; opacity: .7;
}
.navigation-list {
margin-top: var(--spacer-2); padding: 0; list-style: none;
}
.navigation-item {
display: block; margin-bottom: var(--spacer);
}
.navigation-item a {
background: transparent; color: inherit; letter-spacing: 0.05em; font-size: 90%; border-bottom: 2px solid; border-color: inherit; &:hover, &:focus { color: var(--link-hover-color); }
}
.social {
margin-top: var(--spacer-2); font-size: 150%; white-space: normal; line-height: .5;
}
.social-icon {
padding: var(--spacer); &:hover, &:focus { color: var(--link-hover-color); background-color: transparent; }
}
@media (max-width: $md-width) {
.avatar-image { width: 15%; }
}