/* This is the layout CSS file. */
html, body {
height: 100%;
}
code {
background-color: $masthead_color; color: $link_color;
}
.main-container {
@media (min-width: 768px) { width: 750px; }
}
.author-container, .author-container + .mastfoot {
background: #f0f0f0;
}
.author-container {
border-top: 1px solid #d8d8d8; h3 { font-family: $font-family !important; font-weight: normal; font-size: 22px; text-align: center; } .row { margin-top: 1em; }
}
.masthead {
background: $masthead_color; border-bottom: 1px solid darken($masthead_color, 10); .navbar-collapse { padding-right: 0; } .navbar-toggle { margin-top: 23px; margin-bottom: 23px; .icon-bar { background: $link_color; } } a:hover { background: transparent !important; color: lighten($link_color, 30%); } .navbar-brand, .navbar-nav a { height: 80px; line-height: 80px; padding-top: 0; padding-bottom: 0; } @media screen and (max-width: 767px) { .navbar-collapse a { height: auto; line-height: 100%; padding-top: 10px; padding-bottom: 10px; } } .navbar-brand { font-family: $title-font-family; font-size: 30px; } .navbar { margin-bottom: 0; }
}
.mastfoot {
text-align: center; font-size: 0.9em; color: #808080; padding-top: 3em; padding-bottom: 1.5em; font-weight: lighter;
}
.blog-post {
header h2 { @media (min-width: 768px) { margin-top: 1em; margin-bottom: 1em; } @media (max-width: 767px) { margin-top: 0.5em; margin-bottom: 0.5em; text-align: center; } } .post-meta { @media (min-width: 768px) { color: #606060; font-size: 90%; } @media (max-width: 767px) { text-align: center; margin-bottom: 2em; p { display: inline; &::before { color: #606060; content: ' | '; } } p:first-child { &::before { content: ''; } } } }
}
.footnotes {
margin-top: 2em; border-top: 1px solid #e0e0e0; &::before { content: 'Footnotes:'; font-size: 20px; line-height: 40px; }
}
.home {
margin-top: 30px; margin-bottom: 40px; font-weight: bold;
}
.xml-button {
font-family: $font-family;
}
.social-share {
margin-top: 10px; display: block !important; &:before { content: none !important; }
}
.social-share a {
width: 32px; height: 32px; line-height: 32px; font-size: 21px; display: inline-block; margin-right: 1px; text-align: center; border-radius: 2px; border: 1px solid rgba(black, 0.25); background-image: linear-gradient(rgba(white, 0.25), rgba(white, 0)); @media screen and (min-width: 768px) { width: 24px; height: 24px; line-height: 24px; font-size: 16px; } &:hover { text-decoration: none; } &.twitter-share { background-color: #1DA1F2; color: white; } &.facebook-share { background-color: #3B5998; color: white; } &.plus-share { background-color: #d34836; color: white; } &.linkedin-share { background-color: #0077b5; color: white; } &.whatsapp-share { background-color: #25D366; color: white; }
}