$primary-background: #222; $link-colour: a0dfdf; $link-colour-hover: #669999;
body {
background-color: $primary-background; color: #fff;
}
a {
color: $link-colour;
}
a:hover {
color: $link-colour-hover
}
.postBody img {
max-width: 100%;
}
.bg-dark {
background-color: $primary-background !important;
}
.jumbotron {
color: #000; padding: 20px;
}
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;
}
.external-link-list h2.display-4, .post-list h2.display-4 {
font-size: 2rem;
}
.external-link-list i {
font-size: 2rem;
}
.external-link-list li {
list-style-type: none; padding-bottom: 16px;
}
.external-link-list a {
position: relative; top: -6px; padding-left: 20px;
}