@media(min-width: 48em) {
html,body {
-webkit-text-size-adjust: 100%; // iOS
font-size: 16px;
box-direction: normal;
}
.sidebar {
bottom: 0;
left: 0;
position: fixed;
text-align: left;
top: 0;
width: 18rem;
}
.sidebar-sticky {
left: 1rem;
position: absolute;
right: 1rem;
top: 1rem;
}
.content {
margin-left: 20rem;
margin-right: 2rem;
max-width: 38rem;
}
.layout-reverse {
.sidebar {
left: auto;
right: 0;
}
.content {
margin-left: 2rem;
margin-right: 20rem;
}
}
}
@media(min-width: 58em) {
html,body {
text-size-adjust: none;
font-size: 17px;
font-weight: 400;
line-height: 1.611em; // golden ratio
}
}
.content {
padding-bottom: 2rem;
padding-top: 2rem;
}
@media(min-width: 64em) {
.content {
margin-left: 20rem;
margin-right: 2rem;
max-width: 46.056rem;
}
.layout-reverse .content {
margin-left: 4rem;
margin-right: 22rem;
}
}
@media(max-width: 48rem) {
.hidden-tablet {
display: none;
}
}
.element--center {
display: block;
margin-left: auto;
margin-right: auto;
}
.section__title {
font-size: $section__title-font-size;
}
.post-list__item {
margin-bottom: 3em;
}
.item__title--big {
display: block;
font-size: $item__title-big-font-size;
line-height: 1.25;
}
.item__title--small {
font-size: 1rem;
}
.item__date {
color: $item__date-color;
display: block;
font-size: $item__date-font-size;
margin-bottom: .2rem;
margin-top: .2rem;
}
#references~ol {
font-size: .9rem;
}