.site {

margin: 0 auto;
min-height: 100vh;
display: flex;
flex-flow: column;
justify-content: space-between;

}

site-header {

min-height: $site-header-min-height;
background: $site-header-background;
border-top: 5px solid #424242;

}

site-footer {

min-height: $site-footer-min-height;
background: $site-footer-background;
border-bottom: 5px solid #424242;

}

site-body {

flex: auto;
background: $site-body-background;

}

site-header, site-footer, site-body {

box-sizing: border-box;
display: flex;

}

.site-header-content, .site-footer-content, .site-body-content {

flex: auto;
margin: 0 auto;
padding: 10px 0;
max-width: $site-width;
display: flex;

}

site-main {

flex: auto;
box-sizing: border-box;
min-width: 0;
display: flex;
flex-flow: column;

}

site-sidebar {

flex: 0 0 320px;
box-sizing: border-box;
@include sidebar($sidebar-enabled, $sidebar-aside);

}

@media (max-width: 760px) {

#site-sidebar {
  display: none;
}

}