body {
// Make sure that the footer is always at the bottom of the page
min-height: 100vh;
display: flex;
flex-direction: column;
// Hide horizontal overflow (required for animated contact forms)
overflow-x: hidden;
}
.main {
flex: 1;
// Fallback as IE does not respect min-height flex containers
flex-basis: auto;
}
// Page padding for print
@media print {
@page {
margin: 1.5cm;
}
}
// Visually hidden
.vh {
position: absolute;
top: -9999px;
left: -9999px;
}
// Container mixins
@mixin container {
width: 100%;
padding: 0 1.5rem;
margin: 0 auto;
@media (max-width: 30em) {
padding: 0 1rem;
}
@media print {
padding: 0;
}
}
@mixin container--full {
@include container;
max-width: 60rem;
}
@mixin container--text {
@include container;
max-width: 42rem;
}