// breakpoints
$breakpoint-small: 800px
$breakpoint-medium: 1600px

    
html
    background-color: #EEE
body
    background-color: #FFF
main
    min-height: calc( 100vh - 150px )

// body
body
    margin: auto
    min-height: 100vh
    
// small screen
@media (max-width: $breakpoint-small)
    body
        width: 95vw
    .page
        width: 100%

// medium screen
@media (min-width: $breakpoint-small) and (max-width: $breakpoint-medium)
    body
        width: 80vw
    .page
        width: 80%

// large screen
@media (min-width: $breakpoint-medium)
    body
        width: 65vw
    .page
        width: 66%
    .w3-margin-mobile
        margin: 16px
    .w3-padding-mobile
        padding: 8px 16px